feat: support manual entry of OAuth client information

This commit is contained in:
Xiao Yijun 2025-05-16 16:03:01 +08:00
commit b8120d9f85
No known key found for this signature in database
GPG key ID: 6F648FC1262DB420

View file

@ -30,13 +30,13 @@ import {
Progress,
} from "@modelcontextprotocol/sdk/types.js";
import { RequestOptions } from "@modelcontextprotocol/sdk/shared/protocol.js";
import { useState } from "react";
import { useEffect, useState } from "react";
import { useToast } from "@/lib/hooks/useToast";
import { z } from "zod";
import { ConnectionStatus } from "../constants";
import { Notification, StdErrNotificationSchema } from "../notificationTypes";
import { auth } from "@modelcontextprotocol/sdk/client/auth.js";
import { InspectorOAuthClientProvider } from "../auth";
import { clearClientInformationFromSessionStorage, InspectorOAuthClientProvider, saveClientInformationToSessionStorage } from "../auth";
import packageJson from "../../../package.json";
import {
getMCPProxyAddress,
@ -56,6 +56,9 @@ interface UseConnectionOptions {
env: Record<string, string>;
bearerToken?: string;
headerName?: string;
oauthClientId?: string;
oauthScope?: string;
oauthResource?: string;
config: InspectorConfig;
onNotification?: (notification: Notification) => void;
onStdErrNotification?: (notification: Notification) => void;
@ -73,6 +76,9 @@ export function useConnection({
env,
bearerToken,
headerName,
oauthClientId,
oauthScope,
oauthResource,
config,
onNotification,
onStdErrNotification,
@ -93,6 +99,22 @@ export function useConnection({
>([]);
const [completionsSupported, setCompletionsSupported] = useState(true);
useEffect(() => {
if (!oauthClientId) {
clearClientInformationFromSessionStorage({
serverUrl: sseUrl,
isPreregistered: true,
});
return;
}
saveClientInformationToSessionStorage({
serverUrl: sseUrl,
clientInformation: { client_id: oauthClientId },
isPreregistered: true,
});
}, [oauthClientId, sseUrl]);
const pushHistory = (request: object, response?: object) => {
setRequestHistory((prev) => [
...prev,
@ -277,9 +299,15 @@ export function useConnection({
const handleAuthError = async (error: unknown) => {
if (is401Error(error)) {
const serverAuthProvider = new InspectorOAuthClientProvider(sseUrl);
const serverAuthProvider = new InspectorOAuthClientProvider(
sseUrl,
oauthResource,
);
const result = await auth(serverAuthProvider, { serverUrl: sseUrl });
const result = await auth(serverAuthProvider, {
serverUrl: sseUrl,
scope: oauthScope,
});
return result === "AUTHORIZED";
}
@ -315,7 +343,10 @@ export function useConnection({
const headers: HeadersInit = {};
// Create an auth provider with the current server URL
const serverAuthProvider = new InspectorOAuthClientProvider(sseUrl);
const serverAuthProvider = new InspectorOAuthClientProvider(
sseUrl,
oauthResource,
);
// Use manually provided bearer token if available, otherwise use OAuth tokens
const token =
@ -535,7 +566,10 @@ export function useConnection({
clientTransport as StreamableHTTPClientTransport
).terminateSession();
await mcpClient?.close();
const authProvider = new InspectorOAuthClientProvider(sseUrl);
const authProvider = new InspectorOAuthClientProvider(
sseUrl,
oauthResource,
);
authProvider.clear();
setMcpClient(null);
setClientTransport(null);