Remote MCP Server On Cloudflare Vk5

🚀 Remote MCP Server Setup on Cloudflare

Let's get a remote MCP server up and running on Cloudflare Workers, complete with OAuth login functionality!

🚀 Quick Start

💻 Local Development

# Clone the repository
git clone git@github.com:cloudflare/ai.git

# Install dependencies
cd ai
npm install

# Run locally
npx nx dev remote-mcp-server

You should be able to open a browser window at http://localhost:8787/.

🔗 Connect MCP Inspector to Your Server

To explore the new MCP API, you can use the MCP Inspector.

• Start it using npx @modelcontextprotocol/inspector.
• Switch the "Transport Type" to SSE in the inspector and enter http://localhost:8787/sse in the URL to connect to the MCP server, then click "Connect".
• You'll be redirected to a (simulated) user/password login screen. Enter any email and password to log in.
• You should be redirected back to the MCP inspector and can now list and call any defined tools!

🔗 Connect Claude Desktop to Your Local MCP Server

The MCP inspector is great, but we really want to connect it to Claude! Follow Anthropic's Quick Start Guide, go to "Settings" > "Developer" > "Edit Configuration" in Claude Desktop to find your configuration file. Open the file with a text editor and replace it with the following configuration:

{
  "mcpServers": {
    "math": {
      "command": "npx",
      "args": [
        "mcp-remote",
        "http://localhost:8787/sse"
      ]
    }
  }
}

This will run a local proxy that allows Claude to communicate with your MCP server over HTTP. When you open Claude, a browser window should open and allow you to log in. You should see available tools in the bottom right corner. As prompted, Claude should be able to call the tools.

🚀 Deployment to Cloudflare

1. npx wrangler kv namespace create OAUTH_KV
2. Follow the instructions to add the KV namespace ID to wrangler.jsonc.
3. npm run deploy

🔗 Connect a Remote MCP Client to Your Newly Deployed Remote MCP Server

Just like in "Local Development" above, run the MCP inspector: npx @modelcontextprotocol/inspector@latest Then enter your Worker's workers.dev URL (e.g., worker-name.account-name.workers.dev/sse) as the MCP server URL in the inspector to connect, and click "Connect". You've now connected the MCP server from a remote MCP client.

🔗 Connect Claude Desktop to Your Remote MCP Server

Update the Claude configuration file to point to your workers.dev URL (e.g., worker-name.account-name.workers.dev/sse), then restart Claude.

{
  "mcpServers": {
    "math": {
      "command": "npx",
      "args": [
        "mcp-remote",
        "https://worker-name.account-name.workers.dev/sse"
      ]
    }
  }
}

🐞 Debugging

If you encounter any issues, restarting Claude or directly connecting to your MCP server via the following command may help.

npx mcp-remote http://localhost:8787/sse

In rare cases, clearing the files in ~/.mcp-auth may be helpful.

rm -rf ~/.mcp