Remote MCP Server1

🚀 Building a Remote MCP Server on Cloudflare

Let's build a remote MCP server running on Cloudflare Workers with OAuth login functionality!

🚀 Quick Start

📦 Installation

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

# Install dependencies
cd ai
npm install

# Start the local service
npx nx dev remote-mcp-server

You should be able to open and access the browser page at http://localhost:8787/.

💻 Usage Examples

Connecting the MCP Inspector to Your Server

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

• Start it using the command: npx @modelcontextprotocol/inspector
• In the inspector, switch the transport type to SSE and enter http://localhost:8787/sse in the URL field to connect to your MCP server, then click "Connect".
• You will be redirected to a (simulated) user/password login page. Enter any email and password to log in.
• After successful login, you should be redirected back to the MCP Inspector page and be able to list and call any defined tools!

Connecting Claude Desktop to the Local MCP Server

To truly use this feature, we need to connect Claude to it. Follow Anthropic's Quick Start Guide, open Settings > Developer > Edit Profile in Claude Desktop. After finding the profile, replace its contents with the following configuration using a text editor:

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

In this way, Claude will establish a connection with your MCP server through a local proxy. When opening Claude, it will open in the browser by default and prompt you to log in. At this time, you should be able to see a list of available tools.

🚀 Deployment to Cloudflare

To deploy on Cloudflare:

1. Create a KV namespace using the following command:

   wrangler kv namespace create MCP_NAMESPACE_ID --name mcp-namespace
   

2. Update the namespace ID in the wrangler.toml file as follows:

   [context."your accountId"].kv_namespaces = {
     "default" = "MCP_NAMESPACE_ID"
   }
   

🔧 Debugging

If you encounter problems, try the following steps:

1. Restart the Claude application.
2. If the problem still cannot be solved, you can delete the authentication file:

   rm -rf ~/.config/anthropic/
   

Through these steps, you will be able to successfully build and run a remote MCP server based on Cloudflare Workers and integrate it with Claude Desktop.