modelcontextprotocol/inspector
Watch
1
0
Fork
You've already forked inspector
 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions 4

Merge branch 'main' into fix-required

Browse source
This commit is contained in:
olaservo 2025-06-10 21:24:10 -07:00
commit 15967d5572
3 changed files with 102 additions and 54 deletions
Download patch file Download diff file Expand all files Collapse all files

29
client/src/components/Sidebar.tsx
View file

@ -285,13 +285,28 @@ const Sidebar = ({
<label className="text-sm font-medium" htmlFor="sse-url-input"> <label className="text-sm font-medium" htmlFor="sse-url-input">
URL URL
</label> </label>
<Input {sseUrl ? (
id="sse-url-input" <Tooltip>
placeholder="URL" <TooltipTrigger asChild>
value={sseUrl} <Input
onChange={(e) => setSseUrl(e.target.value)} id="sse-url-input"
className="font-mono" placeholder="URL"
/> value={sseUrl}
onChange={(e) => setSseUrl(e.target.value)}
className="font-mono"
/>
</TooltipTrigger>
<TooltipContent>{sseUrl}</TooltipContent>
</Tooltip>
) : (
<Input
id="sse-url-input"
placeholder="URL"
value={sseUrl}
onChange={(e) => setSseUrl(e.target.value)}
className="font-mono"
/>
)}
</div> </div>
<div className="space-y-2"> <div className="space-y-2">
<Button <Button

106
server/src/index.ts
View file

@ -91,7 +91,7 @@ const serverTransports: Map<string, Transport> = new Map<string, Transport>(); /
const createTransport = async (req: express.Request): Promise<Transport> => { const createTransport = async (req: express.Request): Promise<Transport> => {
const query = req.query; const query = req.query;
console.log("Query parameters:", query); console.log("Query parameters:", JSON.stringify(query));
const transportType = query.transportType as string; const transportType = query.transportType as string;
@ -103,7 +103,7 @@ const createTransport = async (req: express.Request): Promise<Transport> => {
const { cmd, args } = findActualExecutable(command, origArgs); 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({ const transport = new StdioClientTransport({
command: cmd, command: cmd,
@ -113,8 +113,6 @@ const createTransport = async (req: express.Request): Promise<Transport> => {
}); });
await transport.start(); await transport.start();
console.log("Spawned stdio transport");
return transport; return transport;
} else if (transportType === "sse") { } else if (transportType === "sse") {
const url = query.url as string; const url = query.url as string;
@ -132,8 +130,6 @@ const createTransport = async (req: express.Request): Promise<Transport> => {
}, },
}); });
await transport.start(); await transport.start();
console.log("Connected to SSE transport");
return transport; return transport;
} else if (transportType === "streamable-http") { } else if (transportType === "streamable-http") {
const headers = getHttpHeaders(req, transportType); const headers = getHttpHeaders(req, transportType);
@ -147,7 +143,6 @@ const createTransport = async (req: express.Request): Promise<Transport> => {
}, },
); );
await transport.start(); await transport.start();
console.log("Connected to Streamable HTTP transport");
return transport; return transport;
} else { } else {
console.error(`Invalid transport type: ${transportType}`); console.error(`Invalid transport type: ${transportType}`);
@ -176,11 +171,10 @@ app.get("/mcp", async (req, res) => {
app.post("/mcp", async (req, res) => { app.post("/mcp", async (req, res) => {
const sessionId = req.headers["mcp-session-id"] as string | undefined; const sessionId = req.headers["mcp-session-id"] as string | undefined;
console.log(`Received POST message for sessionId ${sessionId}`);
let serverTransport: Transport | undefined; let serverTransport: Transport | undefined;
if (!sessionId) { if (!sessionId) {
try { try {
console.log("New streamable-http connection"); console.log("New StreamableHttp connection request");
try { try {
serverTransport = await createTransport(req); serverTransport = await createTransport(req);
} catch (error) { } catch (error) {
@ -196,16 +190,17 @@ app.post("/mcp", async (req, res) => {
throw error; throw error;
} }
console.log("Connected MCP client to server transport"); console.log("Created StreamableHttp server transport");
const webAppTransport = new StreamableHTTPServerTransport({ const webAppTransport = new StreamableHTTPServerTransport({
sessionIdGenerator: randomUUID, sessionIdGenerator: randomUUID,
onsessioninitialized: (sessionId) => { onsessioninitialized: (sessionId) => {
webAppTransports.set(sessionId, webAppTransport); webAppTransports.set(sessionId, webAppTransport);
serverTransports.set(sessionId, serverTransport!); serverTransports.set(sessionId, serverTransport!);
console.log("Created streamable web app transport " + sessionId); console.log("Client <-> Proxy sessionId: " + sessionId);
}, },
}); });
console.log("Created StreamableHttp client transport");
await webAppTransport.start(); await webAppTransport.start();
@ -224,6 +219,7 @@ app.post("/mcp", async (req, res) => {
res.status(500).json(error); res.status(500).json(error);
} }
} else { } else {
console.log(`Received POST message for sessionId ${sessionId}`);
try { try {
const transport = webAppTransports.get( const transport = webAppTransports.get(
sessionId, sessionId,
@ -272,15 +268,15 @@ app.delete("/mcp", async (req, res) => {
app.get("/stdio", async (req, res) => { app.get("/stdio", async (req, res) => {
try { try {
console.log("New connection"); console.log("New STDIO connection request");
let serverTransport: Transport | undefined; let serverTransport: Transport | undefined;
try { try {
serverTransport = await createTransport(req); serverTransport = await createTransport(req);
console.log("Created server transport");
} catch (error) { } catch (error) {
if (error instanceof SseError && error.code === 401) { if (error instanceof SseError && error.code === 401) {
console.error( console.error(
"Received 401 Unauthorized from MCP server:", "Received 401 Unauthorized from MCP server. Authentication failure.",
error.message,
); );
res.status(401).json(error); res.status(401).json(error);
return; return;
@ -289,31 +285,43 @@ app.get("/stdio", async (req, res) => {
throw error; throw error;
} }
console.log("Connected MCP client to backing server transport");
const webAppTransport = new SSEServerTransport("/message", res); const webAppTransport = new SSEServerTransport("/message", res);
console.log("Created client transport");
webAppTransports.set(webAppTransport.sessionId, webAppTransport); webAppTransports.set(webAppTransport.sessionId, webAppTransport);
serverTransports.set(webAppTransport.sessionId, serverTransport); serverTransports.set(webAppTransport.sessionId, serverTransport);
console.log("Created client/server transports");
await webAppTransport.start(); await webAppTransport.start();
(serverTransport as StdioClientTransport).stderr!.on("data", (chunk) => { (serverTransport as StdioClientTransport).stderr!.on("data", (chunk) => {
webAppTransport.send({ if (chunk.toString().includes("MODULE_NOT_FOUND")) {
jsonrpc: "2.0", webAppTransport.send({
method: "notifications/stderr", jsonrpc: "2.0",
params: { method: "notifications/stderr",
content: chunk.toString(), params: {
}, content: "Command not found, transports removed",
}); },
});
webAppTransport.close();
serverTransport.close();
webAppTransports.delete(webAppTransport.sessionId);
serverTransports.delete(webAppTransport.sessionId);
console.error("Command not found, transports removed");
} else {
webAppTransport.send({
jsonrpc: "2.0",
method: "notifications/stderr",
params: {
content: chunk.toString(),
},
});
}
}); });
mcpProxy({ mcpProxy({
transportToClient: webAppTransport, transportToClient: webAppTransport,
transportToServer: serverTransport, transportToServer: serverTransport,
}); });
console.log("Set up MCP proxy");
} catch (error) { } catch (error) {
console.error("Error in /stdio route:", error); console.error("Error in /stdio route:", error);
res.status(500).json(error); res.status(500).json(error);
@ -323,7 +331,7 @@ app.get("/stdio", async (req, res) => {
app.get("/sse", async (req, res) => { app.get("/sse", async (req, res) => {
try { try {
console.log( console.log(
"New SSE connection. NOTE: The sse transport is deprecated and has been replaced by streamable-http", "New SSE connection request. NOTE: The sse transport is deprecated and has been replaced by StreamableHttp",
); );
let serverTransport: Transport | undefined; let serverTransport: Transport | undefined;
try { try {
@ -331,32 +339,38 @@ app.get("/sse", async (req, res) => {
} catch (error) { } catch (error) {
if (error instanceof SseError && error.code === 401) { if (error instanceof SseError && error.code === 401) {
console.error( console.error(
"Received 401 Unauthorized from MCP server:", "Received 401 Unauthorized from MCP server. Authentication failure.",
error.message,
); );
res.status(401).json(error); res.status(401).json(error);
return; return;
} else if (error instanceof SseError && error.code === 404) {
console.error(
"Received 404 not found from MCP server. Does the MCP server support SSE?",
);
res.status(404).json(error);
return;
} else if (JSON.stringify(error).includes("ECONNREFUSED")) {
console.error("Connection refused. Is the MCP server running?");
res.status(500).json(error);
} else {
throw error;
} }
throw error;
} }
console.log("Connected MCP client to backing server transport"); if (serverTransport) {
const webAppTransport = new SSEServerTransport("/message", res);
webAppTransports.set(webAppTransport.sessionId, webAppTransport);
console.log("Created client transport");
serverTransports.set(webAppTransport.sessionId, serverTransport!);
console.log("Created server transport");
const webAppTransport = new SSEServerTransport("/message", res); await webAppTransport.start();
webAppTransports.set(webAppTransport.sessionId, webAppTransport);
console.log("Created client transport");
serverTransports.set(webAppTransport.sessionId, serverTransport);
console.log("Created server transport");
await webAppTransport.start(); mcpProxy({
transportToClient: webAppTransport,
mcpProxy({ transportToServer: serverTransport,
transportToClient: webAppTransport, });
transportToServer: serverTransport, }
});
console.log("Set up MCP proxy");
} catch (error) { } catch (error) {
console.error("Error in /sse route:", error); console.error("Error in /sse route:", error);
res.status(500).json(error); res.status(500).json(error);
@ -366,7 +380,7 @@ app.get("/sse", async (req, res) => {
app.post("/message", async (req, res) => { app.post("/message", async (req, res) => {
try { try {
const sessionId = req.query.sessionId; const sessionId = req.query.sessionId;
console.log(`Received message for sessionId ${sessionId}`); console.log(`Received POST message for sessionId ${sessionId}`);
const transport = webAppTransports.get( const transport = webAppTransports.get(
sessionId as string, sessionId as string,

21
server/src/mcpProxy.ts
View file

@ -6,7 +6,15 @@ function onClientError(error: Error) {
} }
function onServerError(error: Error) { function onServerError(error: Error) {
console.error("Error from MCP server:", error); if (
(error?.message &&
error.message.includes("Error POSTing to endpoint (HTTP 404)")) ||
(error?.cause && JSON.stringify(error.cause).includes("ECONNREFUSED"))
) {
console.error("Connection refused. Is the MCP server running?");
} else {
console.error("Error from MCP server:", error);
}
} }
export default function mcpProxy({ export default function mcpProxy({
@ -19,6 +27,8 @@ export default function mcpProxy({
let transportToClientClosed = false; let transportToClientClosed = false;
let transportToServerClosed = false; let transportToServerClosed = false;
let reportedServerSession = false;
transportToClient.onmessage = (message) => { transportToClient.onmessage = (message) => {
transportToServer.send(message).catch((error) => { transportToServer.send(message).catch((error) => {
// Send error response back to client if it was a request (has id) and connection is still open // Send error response back to client if it was a request (has id) and connection is still open
@ -38,6 +48,15 @@ export default function mcpProxy({
}; };
transportToServer.onmessage = (message) => { transportToServer.onmessage = (message) => {
if (!reportedServerSession) {
if (transportToServer.sessionId) {
// Can only report for StreamableHttp
console.error(
"Proxy <-> Server sessionId: " + transportToServer.sessionId,
);
}
reportedServerSession = true;
}
transportToClient.send(message).catch(onClientError); transportToClient.send(message).catch(onClientError);
}; };