@modelcontextprotocol/inspector 0.10.2 → 0.12.0

package/client/dist/index.html

@@ -5,7 +5,7 @@
     <link rel="icon" type="image/svg+xml" href="/mcp.svg" />
     <meta name="viewport" content="width=device-width, initial-scale=1.0" />
     <title>MCP Inspector</title>
-    <script type="module" crossorigin src="/assets/index-CMyU_PZH.js"></script>
+    <script type="module" crossorigin src="/assets/index-CHwMp9hp.js"></script>
     <link rel="stylesheet" crossorigin href="/assets/index-D5WIP3OH.css">
   </head>
   <body>

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@modelcontextprotocol/inspector",
-  "version": "0.10.2",
+  "version": "0.12.0",
   "description": "Model Context Protocol inspector",
   "license": "MIT",
   "author": "Anthropic, PBC (https://anthropic.com)",
@@ -26,6 +26,7 @@
     "build-server": "cd server && npm run build",
     "build-client": "cd client && npm run build",
     "build-cli": "cd cli && npm run build",
+    "clean": "rimraf ./node_modules ./client/node_modules ./cli/node_modules ./build ./client/dist ./server/build ./cli/build ./package-lock.json && npm install",
     "dev": "concurrently \"cd client && npm run dev\" \"cd server && npm run dev\"",
     "dev:windows": "concurrently \"cd client && npm run dev\" \"cd server && npm run dev:windows\"",
     "start": "node client/bin/start.js",
@@ -35,13 +36,14 @@
     "test-cli": "cd cli && npm run test",
     "prettier-fix": "prettier --write .",
     "prettier-check": "prettier --check .",
+    "prepare": "npm run build",
     "publish-all": "npm publish --workspaces --access public && npm publish --access public"
   },
   "dependencies": {
-    "@modelcontextprotocol/inspector-cli": "^0.10.2",
-    "@modelcontextprotocol/inspector-client": "^0.10.2",
-    "@modelcontextprotocol/inspector-server": "^0.10.2",
-    "@modelcontextprotocol/sdk": "^1.10.0",
+    "@modelcontextprotocol/inspector-cli": "^0.12.0",
+    "@modelcontextprotocol/inspector-client": "^0.12.0",
+    "@modelcontextprotocol/inspector-server": "^0.12.0",
+    "@modelcontextprotocol/sdk": "^1.11.0",
     "concurrently": "^9.0.1",
     "shell-quote": "^1.8.2",
     "spawn-rx": "^5.1.2",
@@ -52,7 +54,9 @@
     "@types/jest": "^29.5.14",
     "@types/node": "^22.7.5",
     "@types/shell-quote": "^1.7.5",
+    "jest-fixed-jsdom": "^0.0.9",
     "prettier": "3.3.3",
+    "rimraf": "^6.0.1",
     "typescript": "^5.4.2"
   }
 }

package/server/build/index.js

@@ -4,11 +4,19 @@ import { parseArgs } from "node:util";
 import { parse as shellParseArgs } from "shell-quote";
 import { SSEClientTransport, SseError, } from "@modelcontextprotocol/sdk/client/sse.js";
 import { StdioClientTransport, getDefaultEnvironment, } from "@modelcontextprotocol/sdk/client/stdio.js";
+import { StreamableHTTPClientTransport } from "@modelcontextprotocol/sdk/client/streamableHttp.js";
+import { StreamableHTTPServerTransport } from "@modelcontextprotocol/sdk/server/streamableHttp.js";
 import { SSEServerTransport } from "@modelcontextprotocol/sdk/server/sse.js";
 import express from "express";
 import { findActualExecutable } from "spawn-rx";
 import mcpProxy from "./mcpProxy.js";
+import { randomUUID } from "node:crypto";
 const SSE_HEADERS_PASSTHROUGH = ["authorization"];
+const STREAMABLE_HTTP_HEADERS_PASSTHROUGH = [
+    "authorization",
+    "mcp-session-id",
+    "last-event-id",
+];
 const defaultEnvironment = {
     ...getDefaultEnvironment(),
     ...(process.env.MCP_ENV_VARS ? JSON.parse(process.env.MCP_ENV_VARS) : {}),
@@ -22,7 +30,11 @@ const { values } = parseArgs({
 });
 const app = express();
 app.use(cors());
-let webAppTransports = [];
+app.use((req, res, next) => {
+    res.header("Access-Control-Expose-Headers", "mcp-session-id");
+    next();
+});
+const webAppTransports = new Map(); // Transports by sessionId
 const createTransport = async (req) => {
     const query = req.query;
     console.log("Query parameters:", query);
@@ -69,15 +81,107 @@ const createTransport = async (req) => {
         console.log("Connected to SSE transport");
         return transport;
     }
+    else if (transportType === "streamable-http") {
+        const headers = {
+            Accept: "text/event-stream, application/json",
+        };
+        for (const key of STREAMABLE_HTTP_HEADERS_PASSTHROUGH) {
+            if (req.headers[key] === undefined) {
+                continue;
+            }
+            const value = req.headers[key];
+            headers[key] = Array.isArray(value) ? value[value.length - 1] : value;
+        }
+        const transport = new StreamableHTTPClientTransport(new URL(query.url), {
+            requestInit: {
+                headers,
+            },
+        });
+        await transport.start();
+        console.log("Connected to Streamable HTTP transport");
+        return transport;
+    }
     else {
         console.error(`Invalid transport type: ${transportType}`);
         throw new Error("Invalid transport type specified");
     }
 };
 let backingServerTransport;
-app.get("/sse", async (req, res) => {
+app.get("/mcp", async (req, res) => {
+    const sessionId = req.headers["mcp-session-id"];
+    console.log(`Received GET message for sessionId ${sessionId}`);
     try {
-        console.log("New SSE connection");
+        const transport = webAppTransports.get(sessionId);
+        if (!transport) {
+            res.status(404).end("Session not found");
+            return;
+        }
+        else {
+            await transport.handleRequest(req, res);
+        }
+    }
+    catch (error) {
+        console.error("Error in /mcp route:", error);
+        res.status(500).json(error);
+    }
+});
+app.post("/mcp", async (req, res) => {
+    const sessionId = req.headers["mcp-session-id"];
+    console.log(`Received POST message for sessionId ${sessionId}`);
+    if (!sessionId) {
+        try {
+            console.log("New streamable-http connection");
+            try {
+                await backingServerTransport?.close();
+                backingServerTransport = await createTransport(req);
+            }
+            catch (error) {
+                if (error instanceof SseError && error.code === 401) {
+                    console.error("Received 401 Unauthorized from MCP server:", error.message);
+                    res.status(401).json(error);
+                    return;
+                }
+                throw error;
+            }
+            console.log("Connected MCP client to backing server transport");
+            const webAppTransport = new StreamableHTTPServerTransport({
+                sessionIdGenerator: randomUUID,
+                onsessioninitialized: (sessionId) => {
+                    webAppTransports.set(sessionId, webAppTransport);
+                    console.log("Created streamable web app transport " + sessionId);
+                },
+            });
+            await webAppTransport.start();
+            mcpProxy({
+                transportToClient: webAppTransport,
+                transportToServer: backingServerTransport,
+            });
+            await webAppTransport.handleRequest(req, res, req.body);
+        }
+        catch (error) {
+            console.error("Error in /mcp POST route:", error);
+            res.status(500).json(error);
+        }
+    }
+    else {
+        try {
+            const transport = webAppTransports.get(sessionId);
+            if (!transport) {
+                res.status(404).end("Transport not found for sessionId " + sessionId);
+            }
+            else {
+                await transport.handleRequest(req, res);
+            }
+        }
+        catch (error) {
+            console.error("Error in /mcp route:", error);
+            res.status(500).json(error);
+        }
+    }
+});
+app.get("/stdio", async (req, res) => {
+    try {
+        console.log("New connection");
         try {
             await backingServerTransport?.close();
             backingServerTransport = await createTransport(req);
@@ -92,21 +196,49 @@ app.get("/sse", async (req, res) => {
         }
         console.log("Connected MCP client to backing server transport");
         const webAppTransport = new SSEServerTransport("/message", res);
-        console.log("Created web app transport");
-        webAppTransports.push(webAppTransport);
+        webAppTransports.set(webAppTransport.sessionId, webAppTransport);
         console.log("Created web app transport");
         await webAppTransport.start();
-        if (backingServerTransport instanceof StdioClientTransport) {
-            backingServerTransport.stderr.on("data", (chunk) => {
-                webAppTransport.send({
-                    jsonrpc: "2.0",
-                    method: "notifications/stderr",
-                    params: {
-                        content: chunk.toString(),
-                    },
-                });
+        backingServerTransport.stderr.on("data", (chunk) => {
+            webAppTransport.send({
+                jsonrpc: "2.0",
+                method: "notifications/stderr",
+                params: {
+                    content: chunk.toString(),
+                },
             });
+        });
+        mcpProxy({
+            transportToClient: webAppTransport,
+            transportToServer: backingServerTransport,
+        });
+        console.log("Set up MCP proxy");
+    }
+    catch (error) {
+        console.error("Error in /stdio route:", error);
+        res.status(500).json(error);
+    }
+});
+app.get("/sse", async (req, res) => {
+    try {
+        console.log("New SSE connection. NOTE: The sse transport is deprecated and has been replaced by streamable-http");
+        try {
+            await backingServerTransport?.close();
+            backingServerTransport = await createTransport(req);
+        }
+        catch (error) {
+            if (error instanceof SseError && error.code === 401) {
+                console.error("Received 401 Unauthorized from MCP server:", error.message);
+                res.status(401).json(error);
+                return;
+            }
+            throw error;
         }
+        console.log("Connected MCP client to backing server transport");
+        const webAppTransport = new SSEServerTransport("/message", res);
+        webAppTransports.set(webAppTransport.sessionId, webAppTransport);
+        console.log("Created web app transport");
+        await webAppTransport.start();
         mcpProxy({
             transportToClient: webAppTransport,
             transportToServer: backingServerTransport,
@@ -122,7 +254,7 @@ app.post("/message", async (req, res) => {
     try {
         const sessionId = req.query.sessionId;
         console.log(`Received message for sessionId ${sessionId}`);
-        const transport = webAppTransports.find((t) => t.sessionId === sessionId);
+        const transport = webAppTransports.get(sessionId);
         if (!transport) {
             res.status(404).end("Session not found");
             return;