@mcpjam/inspector 0.2.3 → 0.3.0

package/server/build/index.js

@@ -36,9 +36,9 @@ app.use((req, res, next) => {
     next();
 });
 const webAppTransports = new Map(); // Transports by sessionId
+const backingServerTransports = new Map();
 const createTransport = async (req) => {
     const query = req.query;
-    console.log("Query parameters:", query);
     const transportType = query.transportType;
     if (transportType === "stdio") {
         const command = query.command;
@@ -46,7 +46,7 @@ const createTransport = async (req) => {
         const queryEnv = query.env ? JSON.parse(query.env) : {};
         const env = { ...process.env, ...defaultEnvironment, ...queryEnv };
         const { cmd, args } = findActualExecutable(command, origArgs);
-        console.log(`Stdio transport: command=${cmd}, args=${args}`);
+        console.log(`🚀 Stdio transport: command=${cmd}, args=${args}`);
         const transport = new StdioClientTransport({
             command: cmd,
             args,
@@ -54,7 +54,6 @@ const createTransport = async (req) => {
             stderr: "pipe",
         });
         await transport.start();
-        console.log("Spawned stdio transport");
         return transport;
     }
     else if (transportType === "sse") {
@@ -69,7 +68,6 @@ const createTransport = async (req) => {
             const value = req.headers[key];
             headers[key] = Array.isArray(value) ? value[value.length - 1] : value;
         }
-        console.log(`SSE transport: url=${url}, headers=${Object.keys(headers)}`);
         const transport = new SSEClientTransport(new URL(url), {
             eventSourceInit: {
                 fetch: (url, init) => fetch(url, { ...init, headers }),
@@ -79,7 +77,6 @@ const createTransport = async (req) => {
             },
         });
         await transport.start();
-        console.log("Connected to SSE transport");
         return transport;
     }
     else if (transportType === "streamable-http") {
@@ -99,18 +96,16 @@ const createTransport = async (req) => {
             },
         });
         await transport.start();
-        console.log("Connected to Streamable HTTP transport");
         return transport;
     }
     else {
-        console.error(`Invalid transport type: ${transportType}`);
+        console.error(`❌ Invalid transport type: ${transportType}`);
         throw new Error("Invalid transport type specified");
     }
 };
-let backingServerTransport;
 app.get("/mcp", async (req, res) => {
     const sessionId = req.headers["mcp-session-id"];
-    console.log(`Received GET message for sessionId ${sessionId}`);
+    console.log(`📥 Received GET message for sessionId ${sessionId}`);
     try {
         const transport = webAppTransports.get(sessionId);
         if (!transport) {
@@ -122,45 +117,51 @@ app.get("/mcp", async (req, res) => {
         }
     }
     catch (error) {
-        console.error("Error in /mcp route:", 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}`);
+    console.log(`📥 Received POST message for sessionId ${sessionId}`);
     if (!sessionId) {
         try {
-            console.log("New streamable-http connection");
+            console.log("🔄 New streamable-http connection");
+            let backingServerTransport;
             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);
+                    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);
+                onsessioninitialized: (newSessionId) => {
+                    console.log("✨ Created streamable web app transport " + newSessionId);
+                    webAppTransports.set(newSessionId, webAppTransport);
+                    backingServerTransports.set(newSessionId, backingServerTransport);
+                    console.log(`✨ Connected MCP client to backing server transport for session ${newSessionId}`);
+                    mcpProxy({
+                        transportToClient: webAppTransport,
+                        transportToServer: backingServerTransport,
+                    });
+                    webAppTransport.onclose = () => {
+                        console.log(`🧹 Cleaning up transports for session ${newSessionId}`);
+                        webAppTransports.delete(newSessionId);
+                        backingServerTransports.delete(newSessionId);
+                    };
                 },
             });
             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);
+            console.error("❌ Error in /mcp POST route:", error);
             res.status(500).json(error);
         }
     }
@@ -175,86 +176,96 @@ app.post("/mcp", async (req, res) => {
             }
         }
         catch (error) {
-            console.error("Error in /mcp route:", error);
+            console.error("❌ Error in /mcp route:", error);
             res.status(500).json(error);
         }
     }
 });
 app.get("/stdio", async (req, res) => {
     try {
-        console.log("New connection");
+        console.log("🔄 New stdio/sse connection");
+        const webAppTransport = new SSEServerTransport("/message", res);
+        const sessionId = webAppTransport.sessionId;
+        webAppTransports.set(sessionId, webAppTransport);
         try {
-            await backingServerTransport?.close();
-            backingServerTransport = await createTransport(req);
+            const backingServerTransport = await createTransport(req);
+            backingServerTransports.set(sessionId, backingServerTransport);
+            webAppTransport.onclose = () => {
+                console.log(`🧹 Cleaning up transports for session ${sessionId}`);
+                webAppTransports.delete(sessionId);
+                backingServerTransports.delete(sessionId);
+            };
+            await webAppTransport.start();
+            if (backingServerTransport instanceof StdioClientTransport) {
+                backingServerTransport.stderr.on("data", (chunk) => {
+                    webAppTransport.send({
+                        jsonrpc: "2.0",
+                        method: "stderr",
+                        params: {
+                            data: chunk.toString(),
+                        },
+                    });
+                });
+            }
+            mcpProxy({
+                transportToClient: webAppTransport,
+                transportToServer: backingServerTransport,
+            });
+            console.log(`✨ Connected MCP client to backing server transport for session ${sessionId}`);
         }
         catch (error) {
             if (error instanceof SseError && error.code === 401) {
-                console.error("Received 401 Unauthorized from MCP server:", error.message);
+                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();
-        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);
+        console.error("❌ Error in /stdio route:", error);
+        // Can't send a 500 response if headers already sent (which they are for SSE)
     }
 });
 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");
+        console.log("🔄 New sse connection");
+        const webAppTransport = new SSEServerTransport("/message", res);
+        const sessionId = webAppTransport.sessionId;
+        webAppTransports.set(sessionId, webAppTransport);
         try {
-            await backingServerTransport?.close();
-            backingServerTransport = await createTransport(req);
+            const backingServerTransport = await createTransport(req);
+            backingServerTransports.set(sessionId, backingServerTransport);
+            webAppTransport.onclose = () => {
+                console.log(`🧹 Cleaning up transports for session ${sessionId}`);
+                webAppTransports.delete(sessionId);
+                backingServerTransports.delete(sessionId);
+            };
+            await webAppTransport.start();
+            mcpProxy({
+                transportToClient: webAppTransport,
+                transportToServer: backingServerTransport,
+            });
+            console.log(`✨ Connected MCP client to backing server transport for session ${sessionId}`);
         }
         catch (error) {
             if (error instanceof SseError && error.code === 401) {
-                console.error("Received 401 Unauthorized from MCP server:", error.message);
+                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,
-        });
-        console.log("Set up MCP proxy");
     }
     catch (error) {
-        console.error("Error in /sse route:", error);
-        res.status(500).json(error);
+        console.error("❌ Error in /sse route:", error);
+        // Can't send a 500 response if headers already sent (which they are for SSE)
     }
 });
 app.post("/message", async (req, res) => {
     try {
         const sessionId = req.query.sessionId;
-        console.log(`Received message for sessionId ${sessionId}`);
+        console.log(`📥 Received message for sessionId ${sessionId}`);
         const transport = webAppTransports.get(sessionId);
         if (!transport) {
             res.status(404).end("Session not found");
@@ -263,7 +274,7 @@ app.post("/message", async (req, res) => {
         await transport.handlePostMessage(req, res);
     }
     catch (error) {
-        console.error("Error in /message route:", error);
+        console.error("❌ Error in /message route:", error);
         res.status(500).json(error);
     }
 });
@@ -281,7 +292,7 @@ app.get("/config", (req, res) => {
         });
     }
     catch (error) {
-        console.error("Error in /config route:", error);
+        console.error("❌ Error in /config route:", error);
         res.status(500).json(error);
     }
 });
@@ -295,10 +306,12 @@ const findAvailablePort = async (startPort) => {
                 resolve(port);
             });
         });
-        server.on('error', (err) => {
-            if (err.code === 'EADDRINUSE') {
+        server.on("error", (err) => {
+            if (err.code === "EADDRINUSE") {
                 // Port is in use, try the next one
-                findAvailablePort(startPort + 1).then(resolve).catch(reject);
+                findAvailablePort(startPort + 1)
+                    .then(resolve)
+                    .catch(reject);
             }
             else {
                 reject(err);
@@ -316,7 +329,7 @@ const startServer = async () => {
             if (availablePort !== Number(PORT)) {
                 console.log(`⚠️  Port ${PORT} was in use, using available port ${availablePort} instead`);
             }
-            console.log(`⚙️ Proxy server listening on port ${availablePort}`);
+            console.log(`\x1b[32m%s\x1b[0m`, `⚙️ Proxy server listening on port ${availablePort}`);
         });
         server.on("error", (err) => {
             console.error(`❌ Server error: ${err.message}`);