MCP OAuth Metadata Debugger

\n Debug OAuth metadata discovery for MCP servers\n

\n\n \n );\n}\n\n// Results page\nfunction ResultsPage(\n { serverUrl, result }: { serverUrl: string; result: DebugResult },\n) {\n return (\n \n

\n MCP OAuth Metadata Debugger\n

\n Debug OAuth metadata discovery for MCP servers\n

\n \n ← New Debug\n \n

\n\n

\n Server:{\" \"}\n \n {serverUrl}\n \n

\n\n

Discovery Steps

\n {result.steps.map((step, index) => (\n \n ))}\n

\n\n {/* Success - Authorization URL found */}\n {result.authorizationUrl && (\n

\n \n \n \n This server looks to be configured correctly\n

\n Successfully generated an authorization URL:\n

\n \n {result.authorizationUrl}\n

\n )}\n \n \n );\n}\n\n// Routes\napp.get(\"/\", (c) => c.html());\n\napp.get(\"/debug\", async (c) => {\n let serverUrl = c.req.query(\"serverUrl\");\n\n if (!serverUrl) {\n return c.redirect(\"/\");\n }\n\n if (!serverUrl.startsWith(\"http\")) {\n serverUrl = `https://${serverUrl}`;\n }\n\n const result = await runOAuthDebugFlow(serverUrl);\n return c.html();\n});\n\n// For val.town\nexport default app.fetch;\n\n// For local Deno development\n// @ts-ignore - Deno global\nif (typeof Deno !== \"undefined\" && Deno.env) {\n // @ts-ignore - Deno global\n const port = parseInt(Deno.env.get(\"PORT\") || \"8000\");\n console.log(`Starting OAuth debugger on http://localhost:${port}`);\n // @ts-ignore - Deno global\n Deno.serve({ port, hostname: \"0.0.0.0\" }, app.fetch);\n}",[97],"e2ccbe0c-fd59-11f0-a11d-42dde27851f2",["D",1769722294613],"/**\n * Debug middleware for capturing HTTP request/response pairs.\n * Adapted from Inspector's debug-middleware.ts for server-side use.\n */\n\nexport interface DebugRequestResponse {\n id: string;\n label: string;\n request: {\n method: string;\n url: string;\n headers: Record;\n body?: unknown;\n };\n response: {\n status: number;\n statusText: string;\n headers: Record;\n body?: unknown;\n };\n}\n\nexport type DebugMiddlewareCallback = (\n entry: DebugRequestResponse,\n) => Promise;\n\n/**\n * Creates a fetch function that captures request/response pairs.\n */\nexport function createDebugFetch(\n onComplete: DebugMiddlewareCallback,\n): typeof fetch {\n return async (input, init) => {\n const url = typeof input === \"string\" ? input : input.toString();\n const method = init?.method || \"GET\";\n\n let requestBody: unknown = undefined;\n if (init?.body) {\n requestBody = parseBody(init.body);\n }\n\n let response: Response;\n try {\n response = await fetch(input, init);\n } catch (fetchError) {\n const errorMessage =\n fetchError instanceof TypeError\n ? \"Network error (CORS or connection failed)\"\n : fetchError instanceof Error\n ? fetchError.message\n : String(fetchError);\n\n const failedEntry: DebugRequestResponse = {\n id: crypto.randomUUID(),\n label: inferLabel(url, method),\n request: {\n method,\n url,\n headers: headersToObject(init?.headers),\n body: requestBody,\n },\n response: {\n status: 0,\n statusText: \"Failed\",\n headers: {},\n body: { error: errorMessage },\n },\n };\n\n await onComplete(failedEntry);\n throw fetchError;\n }\n\n const clonedResponse = response.clone();\n let responseBody: unknown;\n try {\n responseBody = await clonedResponse.json();\n } catch {\n try {\n responseBody = await clonedResponse.text();\n } catch {\n responseBody = null;\n }\n }\n\n const entry: DebugRequestResponse = {\n id: crypto.randomUUID(),\n label: inferLabel(url, method),\n request: {\n method,\n url,\n headers: headersToObject(init?.headers),\n body: requestBody,\n },\n response: {\n status: response.status,\n statusText: response.statusText,\n headers: headersToObject(response.headers),\n body: responseBody,\n },\n };\n\n await onComplete(entry);\n\n return response;\n };\n}\n\nfunction inferLabel(url: string, method: string): string {\n try {\n const parsed = new URL(url);\n return `${method} ${parsed.pathname}`;\n } catch {\n return `${method} ${url}`;\n }\n}\n\nfunction headersToObject(\n headers?: HeadersInit | Headers,\n): Record {\n if (!headers) return {};\n\n if (headers instanceof Headers) {\n const obj: Record = {};\n headers.forEach((value, key) => {\n obj[key] = value;\n });\n return obj;\n }\n\n if (Array.isArray(headers)) {\n return Object.fromEntries(headers);\n }\n\n return headers as Record;\n}\n\nfunction parseBody(body: BodyInit | null | undefined): unknown {\n if (!body) return undefined;\n\n if (typeof body === \"string\") {\n try {\n return JSON.parse(body);\n } catch {\n if (body.includes(\"=\") && body.includes(\"&\")) {\n const params = new URLSearchParams(body);\n const obj: Record = {};\n params.forEach((value, key) => {\n obj[key] = value;\n });\n return obj;\n }\n return body;\n }\n }\n\n if (body instanceof URLSearchParams) {\n const obj: Record = {};\n body.forEach((value, key) => {\n obj[key] = value;\n });\n return obj;\n }\n\n return \"[Binary or unsupported body type]\";\n}\n",[91],"e2cc91ac-fd59-11f0-a11d-42dde27851f2",["D",1769722294613],"/** @jsxImportSource npm:hono@4/jsx */\nimport { raw } from \"npm:hono@4/html\";\n\nimport type { DebugRequestResponse } from \"./debug-middleware.ts\";\n\n// Inline SVG icons (copied from Lucide patterns)\nconst CheckCircle2 = () => (\n \n \n \n);\n\nconst AlertTriangle = (\n { class: className = \"text-yellow-500\" }: { class?: string },\n) => (\n \n \n \n);\n\nconst Info = () => (\n \n \n \n);\n\ninterface StepDisplayProps {\n step: DebugRequestResponse;\n stepNumber: number;\n isComplete: boolean;\n isCurrent: boolean;\n}\n\nfunction getStatusIcon(step: DebugRequestResponse, isComplete: boolean) {\n if (!isComplete) {\n return (\n \n \n \n );\n }\n\n if (step.response.status === 0) {\n // Status 0 = special step (info, warning, or error)\n if (step.response.statusText === \"Info\") return ;\n if (step.response.statusText === \"Warning\") return ;\n return ;\n }\n\n if (step.response.status >= 400) {\n return ;\n }\n\n return ;\n}\n\nexport function StepDisplay({\n step,\n stepNumber,\n isComplete,\n isCurrent,\n}: StepDisplayProps) {\n const isSpecialStep = step.request.method === \"INFO\" ||\n step.request.method === \"WARNING\" ||\n step.request.method === \"ERROR\";\n\n const hasDetails = !isSpecialStep && step.request.url;\n\n // For special steps (info/warning/error), just show the message directly\n if (isSpecialStep) {\n return (\n

\n {getStatusIcon(step, isComplete)}\n {stepNumber}. {step.label}\n

\n \n {typeof step.response.body === \"object\" &&\n step.response.body !== null &&\n \"messageHtml\" in step.response.body\n ? raw(\n String(\n (step.response.body as { messageHtml: unknown }).messageHtml,\n ),\n )\n : typeof step.response.body === \"object\" &&\n step.response.body !== null &&\n \"message\" in step.response.body\n ? String((step.response.body as { message: unknown }).message)\n : JSON.stringify(step.response.body)}\n

\n \n );\n }\n\n // For HTTP requests, use details/summary for click-to-expand (like Inspector)\n return (\n

\n {getStatusIcon(step, isComplete)}\n \n {stepNumber}. {step.label}\n \n \n {step.response.status} {step.response.statusText}\n \n

\n\n

\n {/* Request */}\n

Request

\n {step.request.method}{\" \"}\n {step.request.url}\n

\n {Object.keys(step.request.headers).length > 0 && (\n

Headers:

\n                  {JSON.stringify(step.request.headers, null, 2)}\n

\n )}\n {step.request.body !== undefined && (\n

Body:

\n                  {typeof step.request.body === \"string\"\n                    ? step.request.body\n                    : JSON.stringify(step.request.body, null, 2)}\n

\n )}\n

\n\n {/* Response */}\n

Response

\n = 400\n ? \"text-red-600\"\n : \"text-green-600\"\n }`}\n >\n {step.response.status}\n {\" \"}\n {step.response.statusText}\n

\n {Object.keys(step.response.headers).length > 0 && (\n

Headers:

\n                  {JSON.stringify(step.response.headers, null, 2)}\n

\n )}\n {step.response.body !== undefined && (\n

Body:

\n                  {typeof step.response.body === \"string\"\n                    ? step.response.body\n                    : JSON.stringify(step.response.body, null, 2)}\n

\n )}\n

\n );\n}",[85],"e2cc665a-fd59-11f0-a11d-42dde27851f2",["D",1769722294613],"/**\n * OAuth provider for the debug flow.\n * Adapted from Inspector's DebugOAuthProvider.ts for server-side use.\n */\n\nimport type { OAuthClientProvider } from \"npm:@modelcontextprotocol/sdk@1.25.3/client/auth.js\";\nimport type {\n OAuthClientInformation,\n OAuthClientMetadata,\n OAuthTokens,\n} from \"npm:@modelcontextprotocol/sdk@1.25.3/shared/auth.js\";\n\n/**\n * Debug OAuth provider that captures the authorization URL instead of redirecting.\n */\nexport class DebugOAuthProvider implements OAuthClientProvider {\n authUrl: URL | null = null;\n _codeVerifier: string | null = null;\n private _clientInfo: OAuthClientInformation | null = null;\n\n constructor(private serverUrl: string) {}\n\n get redirectUrl(): string {\n return \"https://mcp-oauth-debugger.example.com/oauth/callback\";\n }\n\n // For CIMD support - use a fake URL that acts as client_id\n get clientMetadataUrl(): string {\n return \"https://mcp-oauth-debugger.example.com/client-metadata.json\";\n }\n\n get clientMetadata(): OAuthClientMetadata {\n return {\n redirect_uris: [this.redirectUrl],\n token_endpoint_auth_method: \"none\",\n grant_types: [\"authorization_code\", \"refresh_token\"],\n response_types: [\"code\"],\n client_name: \"MCP OAuth Debugger\",\n client_uri: \"https://github.com/modelcontextprotocol/inspector\",\n };\n }\n\n async redirectToAuthorization(authorizationUrl: URL): Promise {\n this.authUrl = authorizationUrl;\n }\n\n saveCodeVerifier(verifier: string): void {\n this._codeVerifier = verifier;\n }\n\n codeVerifier(): string {\n if (!this._codeVerifier) {\n throw new Error(\"No code verifier saved\");\n }\n return this._codeVerifier;\n }\n\n tokens(): OAuthTokens | undefined {\n return undefined;\n }\n\n saveTokens(_tokens: OAuthTokens): void {\n // No-op for debugging\n }\n\n clientInformation(): OAuthClientInformation | undefined {\n return this._clientInfo ?? undefined;\n }\n\n saveClientInformation(info: OAuthClientInformation): void {\n this._clientInfo = info;\n }\n}\n",[73],"pulls","branches","forks","envVars",{"_105":20,"_232":20},"connections",{"_105":20,"_231":20},"unfilledCount","emptyCount",{"_27":220,"_13":73,"_71":72,"_37":-5,"_29":30,"_198":34,"_199":178,"_31":255,"_33":20,"_74":75,"_201":222,"_76":24,"_203":-5,"_240":256,"_158":257},{"_27":216,"_13":85,"_71":84,"_37":-5,"_29":30,"_198":34,"_199":178,"_31":252,"_33":20,"_74":75,"_201":218,"_76":24,"_203":-5,"_240":253,"_158":254},{"_27":212,"_13":91,"_71":90,"_37":-5,"_29":30,"_198":34,"_199":178,"_31":249,"_33":20,"_74":75,"_201":214,"_76":24,"_203":-5,"_240":250,"_158":251},{"_27":208,"_13":97,"_71":96,"_37":-5,"_29":30,"_198":34,"_199":178,"_31":246,"_33":20,"_74":98,"_201":210,"_76":24,"_203":-5,"_240":247,"_158":248},{"_27":205,"_13":104,"_71":103,"_37":-5,"_29":30,"_198":34,"_199":178,"_31":243,"_33":20,"_74":75,"_201":159,"_76":24,"_203":-5,"_240":244,"_158":245},{"_27":197,"_13":109,"_71":108,"_37":-5,"_29":30,"_198":34,"_199":178,"_31":239,"_33":20,"_74":75,"_201":202,"_76":24,"_203":-5,"_240":241,"_158":242},["D",1769722294613],"children",[],[109],["D",1769722294613],[],[104],["D",1769722294613],[],[97],["D",1769722294613],[],[91],["D",1769722294613],[],[85],["D",1769722294613],[],[73],["D",1769722294613],{"_11":12,"_157":79},{"_11":12,"_153":-5,"_78":79,"_25":77,"_154":155,"_156":24},{"_33":34,"_13":16,"_27":30,"_142":110,"_143":68,"_144":145,"_146":114,"_147":148,"_149":150,"_151":14,"_152":12},"ctx",{"_46":-5,"_180":295,"_296":297,"_298":299,"_300":24,"_301":24,"_302":24,"_303":178,"_304":-5,"_305":-7,"_306":-7,"_307":20,"_308":24,"_309":24,"_310":-5,"_311":24,"_312":24,"_313":24,"_314":-5},"ENV",{"_266":267,"_268":269,"_270":16,"_271":272,"_273":274,"_275":276,"_277":278,"_279":280,"_281":282,"_283":284,"_285":286,"_287":288,"_289":290,"_291":292,"_293":294},"REACT_APP_SENTRY_DSN","https://586020d86f05489db63a554690acf1e9@o1398359.ingest.sentry.io/6724499","RENDER_GIT_COMMIT","811aa22498c9b0b5a47e8d778de579cdb990f332","RENDER_GIT_BRANCH","POSTHOG_API_TOKEN","phc_nmoyuAkStEZuUp69rYlg1DZgrIt19Gx0Y4Hwf8tGgJP","POSTHOG_API_HOST","https://wart.val.town","WEB_API_TEMPLATE","https://{val}.web.val.run","APP_URL","https://www.val.town","MODULE_URL","https://esm.town","VANITY_WEB_API_TEMPLATE","https://{label}.val.run/","DENOLS_URL","https://lsp.val.town","NODE_ENV","production","CLOUDFLARE_TURNSTILE_SITE_KEY","0x4AAAAAACtaIZJH7s9rBMZ6","GOOGLE_CLIENT_ID","875989696899-jtsqkhlbdv5jrlsk8631p7ipjg3c6o62.apps.googleusercontent.com","STRIPE_PUBLISHABLE_KEY","pk_live_51N2zvWEpZTTLipIkVEwXrUG9AT0yeOOEYxszarZT1jpsZV58Ly6wlg3SltZpHN26CUalOBmUSY7adQRQiSkCZz2500qSXNkf8Y","API_URL","https://api.val.town",[],"preferencesKeybindings","default","preferencesTheme","light","preferencesFixers","preferencesCopilot","preferencesSelectionAi","preferencesCloseBrackets","preferencesChatPanelState","preferencesDprint","preferencesDenofmt","notificationCount","flagDenols","isBusinessOrgMember","businessOrgHandle","isBusinessOrgAdmin","isHigherTownieTier","navCollapsed","currentOrgId"]

History