Model Context Protocol (MCP) Server + Github OAuth

Dies ist ein Model Context Protocol (MCP)-Server, der Remote-MCP-Verbindungen unterstützt und Github OAuth integriert hat.

Sie können ihn in Ihrem eigenen Cloudflare-Konto bereitstellen. Nachdem Sie Ihre eigene Github-OAuth-Client-App erstellt haben, verfügen Sie über einen voll funktionsfähigen Remote-MCP-Server, auf dem Sie aufbauen können. Benutzer können sich über ihr GitHub-Konto anmelden und so eine Verbindung zu Ihrem MCP-Server herstellen.

Sie können dies als Referenzbeispiel dafür verwenden, wie Sie andere OAuth-Anbieter mit einem auf Cloudflare bereitgestellten MCP-Server integrieren, mithilfe der workers-oauth-provider-Bibliothek.

Der MCP-Server (unterstützt durch Cloudflare Workers):

• Fungiert als OAuth-Server für Ihre MCP-Clients

• Fungiert als OAuth-Client gegenüber Ihrem echten OAuth-Server (in diesem Fall GitHub)

[!WARNING] Dies ist eine Demo-Vorlage, die Ihnen den schnellen Einstieg erleichtern soll. Obwohl wir mehrere Sicherheitskontrollen implementiert haben, müssen Sie vor der Bereitstellung in der Produktion alle präventiven und mehrschichtigen Sicherheitsmaßnahmen implementieren. Bitte lesen Sie unseren umfassenden Sicherheitsleitfaden: Securing MCP Servers

Erste Schritte

Klonen Sie das Repository direkt und installieren Sie die Abhängigkeiten: npm install.

Alternativ können Sie die folgende Befehlszeile verwenden, um den Remote-MCP-Server auf Ihrem lokalen Rechner zu erstellen:

npm create cloudflare@latest -- my-mcp-server --template=cloudflare/ai/demos/remote-mcp-github-oauth

Für die Produktion

Erstellen Sie eine neue GitHub-OAuth-App:

• Geben Sie für die Homepage-URL https://mcp-github-oauth.<your-subdomain>.workers.dev an

• Geben Sie für die Authorization-Callback-URL https://mcp-github-oauth.<your-subdomain>.workers.dev/callback an

• Notieren Sie sich Ihre Client-ID und generieren Sie ein Client-Secret.

• Legen Sie die Secrets über Wrangler fest

wrangler secret put GITHUB_CLIENT_ID
wrangler secret put GITHUB_CLIENT_SECRET
wrangler secret put COOKIE_ENCRYPTION_KEY # add any random string here e.g. openssl rand -hex 32

[!IMPORTANT] Wenn Sie das erste Secret erstellen, fragt Wrangler, ob Sie einen neuen Worker erstellen möchten. Geben Sie „Y" ein, um einen neuen Worker zu erstellen und das Secret zu speichern.

Ein KV-Namespace einrichten

• Erstellen Sie den KV-Namespace: wrangler kv namespace create "OAUTH_KV"

• Aktualisieren Sie die Wrangler-Datei mit der KV-ID

Bereitstellen und Testen

Stellen Sie den MCP-Server bereit, um ihn auf Ihrer workers.dev-Domain verfügbar zu machen wrangler deploy

Testen Sie den Remote-Server mit Inspector:

npx @modelcontextprotocol/inspector@latest

Geben Sie https://mcp-github-oauth.<your-subdomain>.workers.dev/sse ein und klicken Sie auf Verbinden. Sobald Sie den Authentifizierungsablauf durchlaufen haben, sehen Sie die Tools in Aktion:

Sie haben jetzt einen Remote-MCP-Server bereitgestellt!

Zugriffskontrolle

Dieser MCP-Server verwendet GitHub OAuth zur Authentifizierung. Alle authentifizierten GitHub-Benutzer können auf grundlegende Tools wie „add" und „userInfoOctokit" zugreifen.

Das Tool „generateImage" ist auf bestimmte GitHub-Benutzer beschränkt, die in der Konfiguration ALLOWED_USERNAMES aufgeführt sind:

// Add GitHub usernames for image generation access
const ALLOWED_USERNAMES = new Set(["yourusername", "teammate1"]);

Zugriff auf den Remote-MCP-Server über Claude Desktop

Öffnen Sie Claude Desktop und navigieren Sie zu Einstellungen -> Entwickler -> Konfiguration bearbeiten. Dadurch wird die Konfigurationsdatei geöffnet, die steuert, auf welche MCP-Server Claude zugreifen kann.

Ersetzen Sie den Inhalt durch die folgende Konfiguration. Nachdem Sie Claude Desktop neu gestartet haben, öffnet sich ein Browserfenster mit Ihrer OAuth-Anmeldeseite. Schließen Sie den Authentifizierungsablauf ab, um Claude Zugriff auf Ihren MCP-Server zu gewähren. Nachdem Sie den Zugriff gewährt haben, stehen Ihnen die Tools zur Verfügung.

{
  "mcpServers": {
    "math": {
      "command": "npx",
      "args": [
        "mcp-remote",
        "https://mcp-github-oauth.<your-subdomain>.workers.dev/sse"
      ]
    }
  }
}

Sobald die Tools (unter 🔨) in der Oberfläche angezeigt werden, können Sie Claude bitten, sie zu verwenden. Zum Beispiel: „Könntest du das Mathe-Tool verwenden, um 23 und 19 zu addieren?" Claude sollte das Tool aufrufen und das vom MCP-Server generierte Ergebnis anzeigen.

Für die lokale Entwicklung

Wenn Sie Ihren MCP-Server iterativ weiterentwickeln und testen möchten, können Sie dies in der lokalen Entwicklung tun. Dazu müssen Sie eine weitere OAuth-App auf GitHub erstellen:

• Geben Sie für die Homepage-URL http://localhost:8788 an

• Geben Sie für die Authorization-Callback-URL http://localhost:8788/callback an

• Notieren Sie sich Ihre Client-ID und generieren Sie ein Client-Secret.

• Erstellen Sie eine .dev.vars-Datei im Projektstammverzeichnis mit:

GITHUB_CLIENT_ID=your_development_github_client_id
GITHUB_CLIENT_SECRET=your_development_github_client_secret

Entwickeln und Testen

Führen Sie den Server lokal aus, um ihn unter http://localhost:8788 verfügbar zu machen wrangler dev

Um den lokalen Server zu testen, geben Sie http://localhost:8788/sse in Inspector ein und klicken Sie auf Verbinden. Sobald Sie den Anweisungen folgen, können Sie „Tools auflisten".

Verwenden von Claude und anderen MCP-Clients

Wenn Sie Claude verwenden, um eine Verbindung zu Ihrem Remote-MCP-Server herzustellen, werden möglicherweise einige Fehlermeldungen angezeigt. Dies liegt daran, dass Claude Desktop Remote-MCP-Server noch nicht unterstützt und daher manchmal verwirrt wird. Um zu überprüfen, ob der MCP-Server verbunden ist, fahren Sie mit der Maus über das 🔨-Symbol in der unteren rechten Ecke der Claude-Oberfläche. Dort sollten Sie Ihre verfügbaren Tools sehen.

Verwenden von Cursor und anderen MCP-Clients

Um Cursor mit Ihrem MCP-Server zu verbinden, wählen Sie Type: „Command" und kombinieren Sie im Feld Command die Felder für Befehl und Argumente zu einem einzigen (z. B. npx mcp-remote https://<your-worker-name>.<your-subdomain>.workers.dev/sse).

Beachten Sie, dass Cursor zwar HTTP+SSE-Server unterstützt, aber keine Authentifizierung. Sie müssen daher weiterhin mcp-remote verwenden (und einen STDIO-Server, keinen HTTP-Server).

Sie können Ihren MCP-Server mit anderen MCP-Clients wie Windsurf verbinden, indem Sie die Konfigurationsdatei des Clients öffnen, dasselbe JSON hinzufügen, das für die Claude-Einrichtung verwendet wurde, und den MCP-Client neu starten.

Wie funktioniert es?

OAuth-Anbieter

Die OAuth-Provider-Bibliothek dient als vollständige OAuth-2.1-Serverimplementierung für Cloudflare Workers. Sie übernimmt die Komplexität des OAuth-Ablaufs, einschließlich Token-Ausstellung, -Validierung und -Verwaltung. In diesem Projekt übernimmt sie eine doppelte Rolle:

• Authentifizierung von MCP-Clients, die eine Verbindung zu Ihrem Server herstellen

• Verwaltung der Verbindung zu den OAuth-Diensten von GitHub

• Sichere Speicherung von Tokens und Authentifizierungsstatus im KV-Speicher

Durable MCP

Durable MCP erweitert die grundlegende MCP-Funktionalität um Cloudflares Durable Objects und bietet:

• Persistente Zustandsverwaltung für Ihren MCP-Server

• Sichere Speicherung des Authentifizierungskontexts zwischen Anfragen

• Zugriff auf authentifizierte Benutzerinformationen über this.props

• Unterstützung für die bedingte Verfügbarkeit von Tools basierend auf der Benutzeridentität

MCP Remote

Die MCP-Remote-Bibliothek ermöglicht es Ihrem Server, Tools bereitzustellen, die von MCP-Clients wie dem Inspector aufgerufen werden können. Sie:

• Definiert das Protokoll für die Kommunikation zwischen Clients und Ihrem Server

• Bietet eine strukturierte Möglichkeit zur Definition von Tools

• Übernimmt die Serialisierung und Deserialisierung von Anfragen und Antworten

• Hält die Server-Sent-Events-Verbindung (SSE) zwischen Clients und Ihrem Server aufrecht