feat: add HTTPS support for Next.js dev servers (#88)

Author: M1ngY

.gitignore

@@ -16,3 +16,5 @@ _*.md
 test/fixtures/**/pnpm-lock.yaml
 test/fixtures/**/node_modules/
 test/fixtures/**/.next/
+
+certificates

package.json

@@ -36,6 +36,7 @@
     "@modelcontextprotocol/sdk": "1.21.0",
     "find-process": "2.0.0",
     "pid-port": "2.0.0",
+    "undici": "7.16.0",
     "zod": "3.25.76"
   },
   "devDependencies": {

pnpm-lock.yaml

@@ -2,6 +2,7 @@ import { findProcess } from "./find-process-import.js"
 import { pidToPorts } from "pid-port"
 import { exec } from "child_process"
 import { promisify } from "util"
+import { Agent as UndiciAgent } from "undici"
 
 const execAsync = promisify(exec)
 
@@ -41,6 +42,116 @@ function isWSL(): boolean {
   )
 }
 
+// Cache detected protocol per port to avoid repeated detection
+const protocolCache = new Map<number, "http" | "https">()
+
+let insecureHttpsAgent: UndiciAgent | undefined
+
+/**
+ * Get fetch options for HTTPS requests
+ * Automatically allows insecure TLS for HTTPS (self-signed certificates)
+ * Can be disabled via NEXT_DEVTOOLS_ALLOW_INSECURE_TLS=false
+ */
+function getFetchOptions(protocol: "http" | "https") {
+  // For HTTPS, automatically allow insecure TLS (for self-signed certificates)
+  // Can be disabled via environment variable: NEXT_DEVTOOLS_ALLOW_INSECURE_TLS=false
+  const allowInsecure =
+    protocol === "https" && (
+      process.env.NEXT_DEVTOOLS_ALLOW_INSECURE_TLS !== "false" ||
+      process.env.NODE_TLS_REJECT_UNAUTHORIZED === "0"
+    )
+
+  if (protocol !== "https" || !allowInsecure) return {}
+
+  if (!insecureHttpsAgent) {
+    insecureHttpsAgent = new UndiciAgent({ connect: { rejectUnauthorized: false } })
+  }
+  return { dispatcher: insecureHttpsAgent }
+}
+
+/**
+ * Automatically detect protocol by trying HTTPS first, then falling back to HTTP
+ * Caches the result per port to avoid repeated detection
+ */
+async function detectProtocol(port: number): Promise<"http" | "https"> {
+  // Return cached protocol if available
+  if (protocolCache.has(port)) {
+    return protocolCache.get(port)!
+  }
+
+  const host = process.env.NEXT_DEVTOOLS_HOST ?? "localhost"
+  
+  // Try HTTPS first (with insecure TLS allowed for self-signed certificates)
+  try {
+    const httpsUrl = `https://${host}:${port}/_next/mcp`
+    const httpsFetchOptions = getFetchOptions("https")
+    const controller = new AbortController()
+    const timeoutId = setTimeout(() => controller.abort(), 500) // Short timeout for quick failure
+
+    const response = await fetch(httpsUrl, {
+      ...httpsFetchOptions,
+      method: "POST",
+      headers: {
+        "Content-Type": "application/json",
+        Accept: "application/json, text/event-stream",
+      },
+      body: JSON.stringify({
+        jsonrpc: "2.0",
+        method: "tools/list",
+        params: {},
+        id: 1,
+      }),
+      signal: controller.signal,
+    })
+
+    clearTimeout(timeoutId)
+    
+    // If HTTPS succeeds (even if it returns an error, it means the protocol is correct)
+    if (response.status !== 404) {
+      protocolCache.set(port, "https")
+      return "https"
+    }
+  } catch (error) {
+    // HTTPS failed, continue to try HTTP
+  }
+
+  // HTTPS failed, fallback to HTTP
+  try {
+    const httpUrl = `http://${host}:${port}/_next/mcp`
+    const controller = new AbortController()
+    const timeoutId = setTimeout(() => controller.abort(), 500)
+
+    const response = await fetch(httpUrl, {
+      method: "POST",
+      headers: {
+        "Content-Type": "application/json",
+        Accept: "application/json, text/event-stream",
+      },
+      body: JSON.stringify({
+        jsonrpc: "2.0",
+        method: "tools/list",
+        params: {},
+        id: 1,
+      }),
+      signal: controller.signal,
+    })
+
+    clearTimeout(timeoutId)
+    
+    // HTTP succeeded
+    if (response.status !== 404) {
+      protocolCache.set(port, "http")
+      return "http"
+    }
+  } catch (error) {
+    // Both protocols failed
+  }
+
+  // Default to HTTP (backward compatibility)
+  protocolCache.set(port, "http")
+  return "http"
+}
+
 /**
  * Get listening ports for a process using ss command (WSL-compatible)
  * ss output format: LISTEN 0 511 *:3000 *:* users:(("next-server",pid=4660,fd=24))
@@ -136,7 +247,10 @@ async function makeNextJsMCPRequest(
   method: string,
   params: Record<string, unknown> = {}
 ): Promise<NextJsMCPResponse> {
-  const url = `http://localhost:${port}/_next/mcp`
+  const protocol = await detectProtocol(port) // Auto-detect protocol
+  const host = process.env.NEXT_DEVTOOLS_HOST ?? "localhost"
+  const url = `${protocol}://${host}:${port}/_next/mcp`
+  const fetchOptions = getFetchOptions(protocol)
 
   const jsonRpcRequest = {
     jsonrpc: "2.0",
@@ -147,6 +261,7 @@ async function makeNextJsMCPRequest(
 
   try {
     const response = await fetch(url, {
+      ...fetchOptions,
       method: "POST",
       headers: {
         "Content-Type": "application/json",
@@ -250,11 +365,15 @@ export async function callNextJsTool(
  */
 async function verifyMCPEndpoint(port: number): Promise<boolean> {
   try {
-    const url = `http://localhost:${port}/_next/mcp`
+    const protocol = await detectProtocol(port) // Auto-detect protocol
+    const host = process.env.NEXT_DEVTOOLS_HOST ?? "localhost"
+    const url = `${protocol}://${host}:${port}/_next/mcp`
+    const fetchOptions = getFetchOptions(protocol)
     const controller = new AbortController()
     const timeoutId = setTimeout(() => controller.abort(), 1000) // 1 second timeout
 
     const response = await fetch(url, {
+      ...fetchOptions,
       method: "POST",
       headers: {
         "Content-Type": "application/json",
@@ -299,3 +418,6 @@ export async function getAllAvailableServers(
 
   return verifiedServers
 }
+
+// Export detectProtocol for use in nextjs-runtime.ts
+export { detectProtocol }

src/_internal/nextjs-runtime-manager.ts

@@ -4,6 +4,7 @@ import {
   listNextJsTools,
   callNextJsTool,
   getAllAvailableServers,
+  detectProtocol,
 } from "../_internal/nextjs-runtime-manager.js"
 
 export const inputSchema = {
@@ -128,24 +129,37 @@ export async function handler(args: NextjsRuntimeArgs): Promise<string> {
           })
         }
 
+        // Detect protocol for each server (uses cached results)
+        const serversWithProtocol = await Promise.all(
+          servers.map(async (s) => {
+            const protocol = await detectProtocol(s.port)
+            return {
+              ...s,
+              protocol,
+              url: `${protocol}://localhost:${s.port}`,
+              mcpEndpoint: `${protocol}://localhost:${s.port}/_next/mcp`,
+            }
+          })
+        )
+
         return JSON.stringify({
           success: true,
-          count: servers.length,
-          servers: servers.map((s) => ({
+          count: serversWithProtocol.length,
+          servers: serversWithProtocol.map((s) => ({
             port: s.port,
             pid: s.pid,
             command: s.command,
-            url: `http://localhost:${s.port}`,
-            mcpEndpoint: `http://localhost:${s.port}/_next/mcp`,
+            url: s.url,
+            mcpEndpoint: s.mcpEndpoint,
           })),
           message: verifyMCP
-            ? `Found ${servers.length} Next.js server${
-                servers.length === 1 ? "" : "s"
+            ? `Found ${serversWithProtocol.length} Next.js server${
+                serversWithProtocol.length === 1 ? "" : "s"
               } running with MCP support`
-            : `Found ${servers.length} Next.js server${
-                servers.length === 1 ? "" : "s"
+            : `Found ${serversWithProtocol.length} Next.js server${
+                serversWithProtocol.length === 1 ? "" : "s"
               } running (MCP verification skipped)`,
-          summary: servers.map((s) => `Server on port ${s.port} (PID: ${s.pid})`).join("\n"),
+          summary: serversWithProtocol.map((s) => `Server on port ${s.port} (PID: ${s.pid})`).join("\n"),
         })
       }