@modelcontextprotocol/inspector-client 0.14.3 → 0.16.0

package/bin/client.js

@@ -1,5 +1,6 @@
 #!/usr/bin/env node
 
+import open from "open";
 import { join, dirname } from "path";
 import { fileURLToPath } from "url";
 import handler from "serve-handler";
@@ -39,19 +40,23 @@ const server = http.createServer((request, response) => {
   return handler(request, response, handlerOptions);
 });
 
-const port = process.env.PORT || 6274;
+const port = parseInt(process.env.CLIENT_PORT || "6274", 10);
+const host = process.env.HOST || "localhost";
 server.on("listening", () => {
-  console.log(
-    `🔍 MCP Inspector is up and running at http://127.0.0.1:${port} 🚀`,
-  );
+  const url = process.env.INSPECTOR_URL || `http://${host}:${port}`;
+  console.log(`\n🚀 MCP Inspector is up and running at:\n   ${url}\n`);
+  if (process.env.MCP_AUTO_OPEN_ENABLED !== "false") {
+    console.log(`🌐 Opening browser...`);
+    open(url);
+  }
 });
 server.on("error", (err) => {
   if (err.message.includes(`EADDRINUSE`)) {
     console.error(
-      `❌  MCP Inspector PORT IS IN USE at http://127.0.0.1:${port} ❌ `,
+      `❌  MCP Inspector PORT IS IN USE at http://${host}:${port} ❌ `,
     );
   } else {
     throw err;
   }
 });
-server.listen(port);
+server.listen(port, host);

package/bin/start.js

@@ -2,15 +2,202 @@
 
 import open from "open";
 import { resolve, dirname } from "path";
-import { spawnPromise } from "spawn-rx";
+import { spawnPromise, spawn } from "spawn-rx";
 import { fileURLToPath } from "url";
+import { randomBytes } from "crypto";
 
 const __dirname = dirname(fileURLToPath(import.meta.url));
+const DEFAULT_MCP_PROXY_LISTEN_PORT = "6277";
 
 function delay(ms) {
   return new Promise((resolve) => setTimeout(resolve, ms, true));
 }
 
+function getClientUrl(port, authDisabled, sessionToken, serverPort) {
+  const host = process.env.HOST || "localhost";
+  const baseUrl = `http://${host}:${port}`;
+
+  const params = new URLSearchParams();
+  if (serverPort && serverPort !== DEFAULT_MCP_PROXY_LISTEN_PORT) {
+    params.set("MCP_PROXY_PORT", serverPort);
+  }
+  if (!authDisabled) {
+    params.set("MCP_PROXY_AUTH_TOKEN", sessionToken);
+  }
+  return params.size > 0 ? `${baseUrl}/?${params.toString()}` : baseUrl;
+}
+
+async function startDevServer(serverOptions) {
+  const { SERVER_PORT, CLIENT_PORT, sessionToken, envVars, abort } =
+    serverOptions;
+  const serverCommand = "npx";
+  const serverArgs = ["tsx", "watch", "--clear-screen=false", "src/index.ts"];
+  const isWindows = process.platform === "win32";
+
+  const spawnOptions = {
+    cwd: resolve(__dirname, "../..", "server"),
+    env: {
+      ...process.env,
+      SERVER_PORT,
+      CLIENT_PORT,
+      MCP_PROXY_TOKEN: sessionToken,
+      MCP_ENV_VARS: JSON.stringify(envVars),
+    },
+    signal: abort.signal,
+    echoOutput: true,
+  };
+
+  // For Windows, we need to use stdin: 'ignore' to simulate < NUL
+  if (isWindows) {
+    spawnOptions.stdin = "ignore";
+  }
+
+  const server = spawn(serverCommand, serverArgs, spawnOptions);
+
+  // Give server time to start
+  const serverOk = await Promise.race([
+    new Promise((resolve) => {
+      server.subscribe({
+        complete: () => resolve(false),
+        error: () => resolve(false),
+        next: () => {}, // We're using echoOutput
+      });
+    }),
+    delay(3000).then(() => true),
+  ]);
+
+  return { server, serverOk };
+}
+
+async function startProdServer(serverOptions) {
+  const {
+    SERVER_PORT,
+    CLIENT_PORT,
+    sessionToken,
+    envVars,
+    abort,
+    command,
+    mcpServerArgs,
+  } = serverOptions;
+  const inspectorServerPath = resolve(
+    __dirname,
+    "../..",
+    "server",
+    "build",
+    "index.js",
+  );
+
+  const server = spawnPromise(
+    "node",
+    [
+      inspectorServerPath,
+      ...(command ? [`--env`, command] : []),
+      ...(mcpServerArgs ? [`--args=${mcpServerArgs.join(" ")}`] : []),
+    ],
+    {
+      env: {
+        ...process.env,
+        SERVER_PORT,
+        CLIENT_PORT,
+        MCP_PROXY_TOKEN: sessionToken,
+        MCP_ENV_VARS: JSON.stringify(envVars),
+      },
+      signal: abort.signal,
+      echoOutput: true,
+    },
+  );
+
+  // Make sure server started before starting client
+  const serverOk = await Promise.race([server, delay(2 * 1000)]);
+
+  return { server, serverOk };
+}
+
+async function startDevClient(clientOptions) {
+  const {
+    CLIENT_PORT,
+    SERVER_PORT,
+    authDisabled,
+    sessionToken,
+    abort,
+    cancelled,
+  } = clientOptions;
+  const clientCommand = "npx";
+  const host = process.env.HOST || "localhost";
+  const clientArgs = ["vite", "--port", CLIENT_PORT, "--host", host];
+
+  const client = spawn(clientCommand, clientArgs, {
+    cwd: resolve(__dirname, ".."),
+    env: { ...process.env, CLIENT_PORT },
+    signal: abort.signal,
+    echoOutput: true,
+  });
+
+  const url = getClientUrl(
+    CLIENT_PORT,
+    authDisabled,
+    sessionToken,
+    SERVER_PORT,
+  );
+
+  // Give vite time to start before opening or logging the URL
+  setTimeout(() => {
+    console.log(`\n🚀 MCP Inspector is up and running at:\n   ${url}\n`);
+    if (process.env.MCP_AUTO_OPEN_ENABLED !== "false") {
+      console.log("🌐 Opening browser...");
+      open(url);
+    }
+  }, 3000);
+
+  await new Promise((resolve) => {
+    client.subscribe({
+      complete: resolve,
+      error: (err) => {
+        if (!cancelled || process.env.DEBUG) {
+          console.error("Client error:", err);
+        }
+        resolve(null);
+      },
+      next: () => {}, // We're using echoOutput
+    });
+  });
+}
+
+async function startProdClient(clientOptions) {
+  const {
+    CLIENT_PORT,
+    SERVER_PORT,
+    authDisabled,
+    sessionToken,
+    abort,
+    cancelled,
+  } = clientOptions;
+  const inspectorClientPath = resolve(
+    __dirname,
+    "../..",
+    "client",
+    "bin",
+    "client.js",
+  );
+
+  const url = getClientUrl(
+    CLIENT_PORT,
+    authDisabled,
+    sessionToken,
+    SERVER_PORT,
+  );
+
+  await spawnPromise("node", [inspectorClientPath], {
+    env: {
+      ...process.env,
+      CLIENT_PORT,
+      INSPECTOR_URL: url,
+    },
+    signal: abort.signal,
+    echoOutput: true,
+  });
+}
+
 async function main() {
   // Parse command line arguments
   const args = process.argv.slice(2);
@@ -18,6 +205,7 @@ async function main() {
   const mcpServerArgs = [];
   let command = null;
   let parsingFlags = true;
+  let isDev = false;
 
   for (let i = 0; i < args.length; i++) {
     const arg = args[i];
@@ -27,6 +215,11 @@ async function main() {
       continue;
     }
 
+    if (parsingFlags && arg === "--dev") {
+      isDev = true;
+      continue;
+    }
+
     if (parsingFlags && arg === "-e" && i + 1 < args.length) {
       const envVar = args[++i];
       const equalsIndex = envVar.indexOf("=");
@@ -38,34 +231,25 @@ async function main() {
       } else {
         envVars[envVar] = "";
       }
-    } else if (!command) {
+    } else if (!command && !isDev) {
       command = arg;
-    } else {
+    } else if (!isDev) {
       mcpServerArgs.push(arg);
     }
   }
 
-  const inspectorServerPath = resolve(
-    __dirname,
-    "../..",
-    "server",
-    "build",
-    "index.js",
-  );
+  const CLIENT_PORT = process.env.CLIENT_PORT ?? "6274";
+  const SERVER_PORT = process.env.SERVER_PORT ?? DEFAULT_MCP_PROXY_LISTEN_PORT;
 
-  // Path to the client entry point
-  const inspectorClientPath = resolve(
-    __dirname,
-    "../..",
-    "client",
-    "bin",
-    "client.js",
+  console.log(
+    isDev
+      ? "Starting MCP inspector in development mode..."
+      : "Starting MCP inspector...",
   );
 
-  const CLIENT_PORT = process.env.CLIENT_PORT ?? "6274";
-  const SERVER_PORT = process.env.SERVER_PORT ?? "6277";
-
-  console.log("Starting MCP inspector...");
+  // Generate session token for authentication
+  const sessionToken = randomBytes(32).toString("hex");
+  const authDisabled = !!process.env.DANGEROUSLY_OMIT_AUTH;
 
   const abort = new AbortController();
 
@@ -74,42 +258,42 @@ async function main() {
     cancelled = true;
     abort.abort();
   });
+
   let server, serverOk;
+
   try {
-    server = spawnPromise(
-      "node",
-      [
-        inspectorServerPath,
-        ...(command ? [`--env`, command] : []),
-        ...(mcpServerArgs ? [`--args=${mcpServerArgs.join(" ")}`] : []),
-      ],
-      {
-        env: {
-          ...process.env,
-          PORT: SERVER_PORT,
-          MCP_ENV_VARS: JSON.stringify(envVars),
-        },
-        signal: abort.signal,
-        echoOutput: true,
-      },
-    );
+    const serverOptions = {
+      SERVER_PORT,
+      CLIENT_PORT,
+      sessionToken,
+      envVars,
+      abort,
+      command,
+      mcpServerArgs,
+    };
 
-    // Make sure server started before starting client
-    serverOk = await Promise.race([server, delay(2 * 1000)]);
+    const result = isDev
+      ? await startDevServer(serverOptions)
+      : await startProdServer(serverOptions);
+
+    server = result.server;
+    serverOk = result.serverOk;
   } catch (error) {}
 
   if (serverOk) {
     try {
-      // Only auto-open when auth is disabled
-      const authDisabled = !!process.env.DANGEROUSLY_OMIT_AUTH;
-      if (process.env.MCP_AUTO_OPEN_ENABLED !== "false" && authDisabled) {
-        open(`http://127.0.0.1:${CLIENT_PORT}`);
-      }
-      await spawnPromise("node", [inspectorClientPath], {
-        env: { ...process.env, PORT: CLIENT_PORT },
-        signal: abort.signal,
-        echoOutput: true,
-      });
+      const clientOptions = {
+        CLIENT_PORT,
+        SERVER_PORT,
+        authDisabled,
+        sessionToken,
+        abort,
+        cancelled,
+      };
+
+      await (isDev
+        ? startDevClient(clientOptions)
+        : startProdClient(clientOptions));
     } catch (e) {
       if (!cancelled || process.env.DEBUG) throw e;
     }

package/dist/assets/{OAuthCallback-BrCtrNqU.js → OAuthCallback-DMQy4ibj.js}

@@ -1,4 +1,4 @@
-import { u as useToast, r as reactExports, j as jsxRuntimeExports, S as SESSION_KEYS, I as InspectorOAuthClientProvider, a as auth } from "./index-DYfnI33L.js";
+import { u as useToast, r as reactExports, j as jsxRuntimeExports, S as SESSION_KEYS, I as InspectorOAuthClientProvider, a as auth } from "./index-DI7JCTeu.js";
 import { p as parseOAuthCallbackParams, g as generateOAuthErrorDescription } from "./oauthUtils-DTcoXpSP.js";
 const OAuthCallback = ({ onConnect }) => {
   const { toast } = useToast();

package/dist/assets/{OAuthDebugCallback-CnQiL6bh.js → OAuthDebugCallback-9JxBAysc.js}

@@ -1,4 +1,4 @@
-import { r as reactExports, S as SESSION_KEYS, j as jsxRuntimeExports } from "./index-DYfnI33L.js";
+import { r as reactExports, S as SESSION_KEYS, j as jsxRuntimeExports } from "./index-DI7JCTeu.js";
 import { p as parseOAuthCallbackParams, g as generateOAuthErrorDescription } from "./oauthUtils-DTcoXpSP.js";
 const OAuthDebugCallback = ({ onConnect }) => {
   reactExports.useEffect(() => {

package/dist/assets/{index-C1MLjTGf.css → index-BwWj6LL9.css}

@@ -1,7 +1,3 @@
-#root {
-  margin: 0 auto;
-}
-
 .logo {
   height: 6em;
   padding: 1.5em;