diff --git a/client/src/App.tsx b/client/src/App.tsx index 4f99ffd..c36353e 100644 --- a/client/src/App.tsx +++ b/client/src/App.tsx @@ -79,9 +79,9 @@ const App = () => { const [sseUrl, setSseUrl] = useState(() => { return localStorage.getItem("lastSseUrl") || "http://localhost:3001/sse"; }); - const [transportType, setTransportType] = useState<"stdio" | "sse">(() => { + const [transportType, setTransportType] = useState<"stdio" | "sse" | "streamable-http">(() => { return ( - (localStorage.getItem("lastTransportType") as "stdio" | "sse") || "stdio" + (localStorage.getItem("lastTransportType") as "stdio" | "sse" | "streamable-http") || "stdio" ); }); const [logLevel, setLogLevel] = useState("debug"); diff --git a/client/src/components/Sidebar.tsx b/client/src/components/Sidebar.tsx index e3e2118..44d0d53 100644 --- a/client/src/components/Sidebar.tsx +++ b/client/src/components/Sidebar.tsx @@ -39,8 +39,8 @@ import { interface SidebarProps { connectionStatus: ConnectionStatus; - transportType: "stdio" | "sse"; - setTransportType: (type: "stdio" | "sse") => void; + transportType: "stdio" | "sse" | "streamable-http"; + setTransportType: (type: "stdio" | "sse" | "streamable-http") => void; command: string; setCommand: (command: string) => void; args: string; @@ -111,7 +111,7 @@ const Sidebar = ({ diff --git a/client/src/lib/hooks/useConnection.ts b/client/src/lib/hooks/useConnection.ts index ac4605c..1eccfeb 100644 --- a/client/src/lib/hooks/useConnection.ts +++ b/client/src/lib/hooks/useConnection.ts @@ -42,7 +42,7 @@ import { getMCPServerRequestTimeout } from "@/utils/configUtils"; import { InspectorConfig } from "../configurationTypes"; interface UseConnectionOptions { - transportType: "stdio" | "sse"; + transportType: "stdio" | "sse" | "streamable-http"; command: string; args: string; sseUrl: string; diff --git a/server/src/index.ts b/server/src/index.ts index 0987d99..879db92 100644 --- a/server/src/index.ts +++ b/server/src/index.ts @@ -14,6 +14,7 @@ import { } from "@modelcontextprotocol/sdk/client/stdio.js"; import { Transport } from "@modelcontextprotocol/sdk/shared/transport.js"; import { SSEServerTransport } from "@modelcontextprotocol/sdk/server/sse.js"; +import { StreamableHTTPClientTransport } from '@modelcontextprotocol/sdk/client/streamableHttp.js'; import express from "express"; import { findActualExecutable } from "spawn-rx"; import mcpProxy from "./mcpProxy.js"; @@ -94,6 +95,11 @@ const createTransport = async (req: express.Request): Promise => { console.log("Connected to SSE transport"); return transport; + } else if (transportType === "streamable-http") { + const transport = new StreamableHTTPClientTransport(new URL(query.url as string)); + 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");