File size: 4,955 Bytes
f94c05c |
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 |
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<svg width="800" height="600" xmlns="http://www.w3.org/2000/svg">
<!-- Background -->
<rect width="800" height="600" fill="#f8fafc" />
<!-- Title -->
<text x="400" y="50" font-family="'Inter', sans-serif" font-size="24" font-weight="bold" text-anchor="middle" fill="#1e293b">Model Context Protocol (MCP) Architecture</text>
<!-- MCP Clients Section -->
<g>
<rect x="50" y="100" width="280" height="200" fill="#e0f2fe" stroke="#2563eb" stroke-width="2" rx="8" ry="8" />
<text x="190" y="130" font-family="'Inter', sans-serif" font-size="18" font-weight="bold" text-anchor="middle" fill="#1e293b">MCP Clients</text>
<!-- Client Icons -->
<rect x="80" y="150" width="220" height="50" fill="white" stroke="#64748b" stroke-width="1" rx="6" ry="6" />
<text x="190" y="180" font-family="'Inter', sans-serif" font-size="14" text-anchor="middle" fill="#1e293b">Claude Desktop</text>
<rect x="80" y="220" width="220" height="50" fill="white" stroke="#64748b" stroke-width="1" rx="6" ry="6" />
<text x="190" y="250" font-family="'Inter', sans-serif" font-size="14" text-anchor="middle" fill="#1e293b">Custom AI Applications</text>
</g>
<!-- MCP Servers Section -->
<g>
<rect x="470" y="100" width="280" height="350" fill="#ede9fe" stroke="#7c3aed" stroke-width="2" rx="8" ry="8" />
<text x="610" y="130" font-family="'Inter', sans-serif" font-size="18" font-weight="bold" text-anchor="middle" fill="#1e293b">MCP Servers</text>
<!-- Server Icons -->
<rect x="500" y="150" width="220" height="50" fill="white" stroke="#64748b" stroke-width="1" rx="6" ry="6" />
<text x="610" y="180" font-family="'Inter', sans-serif" font-size="14" text-anchor="middle" fill="#1e293b">Filesystem Server</text>
<rect x="500" y="220" width="220" height="50" fill="white" stroke="#64748b" stroke-width="1" rx="6" ry="6" />
<text x="610" y="250" font-family="'Inter', sans-serif" font-size="14" text-anchor="middle" fill="#1e293b">Database Server</text>
<rect x="500" y="290" width="220" height="50" fill="white" stroke="#64748b" stroke-width="1" rx="6" ry="6" />
<text x="610" y="320" font-family="'Inter', sans-serif" font-size="14" text-anchor="middle" fill="#1e293b">API Connectors</text>
<rect x="500" y="360" width="220" height="50" fill="white" stroke="#64748b" stroke-width="1" rx="6" ry="6" />
<text x="610" y="390" font-family="'Inter', sans-serif" font-size="14" text-anchor="middle" fill="#1e293b">Custom Tool Servers</text>
</g>
<!-- Transport Layer -->
<g>
<rect x="200" y="350" width="400" height="120" fill="#ecfdf5" stroke="#059669" stroke-width="2" rx="8" ry="8" />
<text x="400" y="380" font-family="'Inter', sans-serif" font-size="18" font-weight="bold" text-anchor="middle" fill="#1e293b">Transport Layer</text>
<rect x="240" y="400" width="145" height="50" fill="white" stroke="#64748b" stroke-width="1" rx="6" ry="6" />
<text x="313" y="430" font-family="'Inter', sans-serif" font-size="14" text-anchor="middle" fill="#1e293b">stdio (Local)</text>
<rect x="415" y="400" width="145" height="50" fill="white" stroke="#64748b" stroke-width="1" rx="6" ry="6" />
<text x="488" y="430" font-family="'Inter', sans-serif" font-size="14" text-anchor="middle" fill="#1e293b">HTTP/SSE (Remote)</text>
</g>
<!-- Connection Arrows -->
<g>
<!-- Client to Transport -->
<path d="M 190,300 L 190,350" stroke="#64748b" stroke-width="2" fill="none" />
<polygon points="190,350 185,340 195,340" fill="#64748b" />
<!-- Transport to Server -->
<path d="M 610,350 L 610,310" stroke="#64748b" stroke-width="2" fill="none" />
<polygon points="610,310 605,320 615,320" fill="#64748b" />
<!-- Communication Lines -->
<path d="M 330,200 L 500,200" stroke="#64748b" stroke-width="2" fill="none" stroke-dasharray="5,5" />
<path d="M 330,240 L 500,320" stroke="#64748b" stroke-width="2" fill="none" stroke-dasharray="5,5" />
</g>
<!-- Legend -->
<g>
<rect x="50" y="500" width="700" height="80" fill="#f1f5f9" stroke="#94a3b8" stroke-width="1" rx="6" ry="6" />
<text x="400" y="525" font-family="'Inter', sans-serif" font-size="16" font-weight="bold" text-anchor="middle" fill="#1e293b">MCP Communication Flow</text>
<circle cx="80" cy="550" r="6" fill="#2563eb" />
<text x="100" y="555" font-family="'Inter', sans-serif" font-size="14" fill="#1e293b">1. Client connects to Server</text>
<circle cx="280" cy="550" r="6" fill="#7c3aed" />
<text x="300" y="555" font-family="'Inter', sans-serif" font-size="14" fill="#1e293b">2. Client discovers Tools (listTools)</text>
<circle cx="520" cy="550" r="6" fill="#059669" />
<text x="540" y="555" font-family="'Inter', sans-serif" font-size="14" fill="#1e293b">3. Client calls Tools (callTool)</text>
</g>
</svg> |