mirror of
https://github.com/DayuanJiang/next-ai-draw-io.git
synced 2026-01-02 14:22:28 +08:00
feat(mcp-server): add DRAWIO_BASE_URL env for private deployments (#467)
* feat(mcp-server): add DRAWIO_BASE_URL env for private deployments * Fix postMessage origin check and URL normalization - Add getOrigin() function to extract scheme+host+port from DRAWIO_BASE_URL - Use DRAWIO_ORIGIN for postMessage security check instead of full URL - Add normalizeUrl() to remove trailing slash and avoid double slashes - This fixes issues when users configure DRAWIO_BASE_URL with trailing slash or path
This commit is contained in:
@@ -90,7 +90,7 @@ Use the standard MCP configuration with:
|
|||||||
- **Natural Language**: Describe diagrams in plain text - flowcharts, architecture diagrams, etc.
|
- **Natural Language**: Describe diagrams in plain text - flowcharts, architecture diagrams, etc.
|
||||||
- **Edit Support**: Modify existing diagrams with natural language instructions
|
- **Edit Support**: Modify existing diagrams with natural language instructions
|
||||||
- **Export**: Save diagrams as `.drawio` files
|
- **Export**: Save diagrams as `.drawio` files
|
||||||
- **Self-contained**: Embedded server, works offline (except draw.io UI which loads from embed.diagrams.net)
|
- **Self-contained**: Embedded server, works offline (except draw.io UI which loads from `embed.diagrams.net` by default, configurable via `DRAWIO_BASE_URL`)
|
||||||
|
|
||||||
## Available Tools
|
## Available Tools
|
||||||
|
|
||||||
@@ -130,6 +130,33 @@ Use the standard MCP configuration with:
|
|||||||
| Variable | Default | Description |
|
| Variable | Default | Description |
|
||||||
|----------|---------|-------------|
|
|----------|---------|-------------|
|
||||||
| `PORT` | `6002` | Port for the embedded HTTP server |
|
| `PORT` | `6002` | Port for the embedded HTTP server |
|
||||||
|
| `DRAWIO_BASE_URL` | `https://embed.diagrams.net` | Base URL for the draw.io embed. Set this to use a self-hosted draw.io instance for private deployments. |
|
||||||
|
|
||||||
|
### Private Deployment (Self-hosted draw.io)
|
||||||
|
|
||||||
|
For security-sensitive environments that require private deployment of draw.io:
|
||||||
|
|
||||||
|
```json
|
||||||
|
{
|
||||||
|
"mcpServers": {
|
||||||
|
"drawio": {
|
||||||
|
"command": "npx",
|
||||||
|
"args": ["@next-ai-drawio/mcp-server@latest"],
|
||||||
|
"env": {
|
||||||
|
"DRAWIO_BASE_URL": "https://drawio.your-company.com"
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
```
|
||||||
|
|
||||||
|
You can deploy your own draw.io instance using the official Docker image:
|
||||||
|
|
||||||
|
```bash
|
||||||
|
docker run -d -p 8080:8080 jgraph/drawio
|
||||||
|
```
|
||||||
|
|
||||||
|
Then set `DRAWIO_BASE_URL=http://localhost:8080` (or your server's URL).
|
||||||
|
|
||||||
## Troubleshooting
|
## Troubleshooting
|
||||||
|
|
||||||
|
|||||||
@@ -13,6 +13,28 @@ import {
|
|||||||
} from "./history.js"
|
} from "./history.js"
|
||||||
import { log } from "./logger.js"
|
import { log } from "./logger.js"
|
||||||
|
|
||||||
|
// Configurable draw.io embed URL for private deployments
|
||||||
|
const DRAWIO_BASE_URL =
|
||||||
|
process.env.DRAWIO_BASE_URL || "https://embed.diagrams.net"
|
||||||
|
|
||||||
|
// Extract origin (scheme + host + port) from URL for postMessage security check
|
||||||
|
function getOrigin(url: string): string {
|
||||||
|
try {
|
||||||
|
const parsed = new URL(url)
|
||||||
|
return `${parsed.protocol}//${parsed.host}`
|
||||||
|
} catch {
|
||||||
|
return url // Fallback if parsing fails
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
const DRAWIO_ORIGIN = getOrigin(DRAWIO_BASE_URL)
|
||||||
|
|
||||||
|
// Normalize URL for iframe src - ensure no double slashes
|
||||||
|
function normalizeUrl(url: string): string {
|
||||||
|
// Remove trailing slash to avoid double slashes
|
||||||
|
return url.replace(/\/$/, '')
|
||||||
|
}
|
||||||
|
|
||||||
interface SessionState {
|
interface SessionState {
|
||||||
xml: string
|
xml: string
|
||||||
version: number
|
version: number
|
||||||
@@ -403,7 +425,7 @@ function getHtmlPage(sessionId: string): string {
|
|||||||
</div>
|
</div>
|
||||||
<div id="status" class="status disconnected">Connecting...</div>
|
<div id="status" class="status disconnected">Connecting...</div>
|
||||||
</div>
|
</div>
|
||||||
<iframe id="drawio" src="https://embed.diagrams.net/?embed=1&proto=json&spin=1&libraries=1"></iframe>
|
<iframe id="drawio" src="${normalizeUrl(DRAWIO_BASE_URL)}/?embed=1&proto=json&spin=1&libraries=1"></iframe>
|
||||||
</div>
|
</div>
|
||||||
<button id="history-btn" title="History" ${sessionId ? "" : "disabled"}>
|
<button id="history-btn" title="History" ${sessionId ? "" : "disabled"}>
|
||||||
<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
|
<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
|
||||||
@@ -433,7 +455,7 @@ function getHtmlPage(sessionId: string): string {
|
|||||||
let pendingAiSvg = false;
|
let pendingAiSvg = false;
|
||||||
|
|
||||||
window.addEventListener('message', (e) => {
|
window.addEventListener('message', (e) => {
|
||||||
if (e.origin !== 'https://embed.diagrams.net') return;
|
if (e.origin !== '${DRAWIO_ORIGIN}') return;
|
||||||
try {
|
try {
|
||||||
const msg = JSON.parse(e.data);
|
const msg = JSON.parse(e.data);
|
||||||
if (msg.event === 'init') {
|
if (msg.event === 'init') {
|
||||||
|
|||||||
Reference in New Issue
Block a user