mcp-server-figma

The Remote MCP Server on Cloudflare guide is designed to help users set up and deploy a Model Context Protocol server using Cloudflare Workers. The guide covers local development, connecting the MCP Inspector to the server, and integrating with Claude Desktop for enhanced functionality. It also includes instructions for deploying the server to Cloudflare and connecting to it from a remote MCP client. The guide provides detailed steps for each process, ensuring users can effectively manage and utilize their MCP server. Additionally, it offers troubleshooting tips for common issues that may arise during setup or operation.

Features

• Local Development: Instructions for setting up and running the MCP server locally using Node.js and npm.
• MCP Inspector Connection: Steps to connect the MCP Inspector to the server for API exploration and tool invocation.
• Claude Desktop Integration: Guide to configuring Claude Desktop to interact with the MCP server for tool usage.
• Cloudflare Deployment: Detailed process for deploying the MCP server to Cloudflare Workers.
• Remote Client Connection: Instructions for connecting to the deployed MCP server from a remote client.

Usage with Different Platforms

Develop Locally

bash
# 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

Connect MCP Inspector

bash
npx @modelcontextprotocol/inspector

Connect Claude Desktop Locally

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

Deploy to Cloudflare

bash
npx wrangler kv namespace create OAUTH_KV
# Follow the guidance to add the kv namespace ID to `wrangler.jsonc`
npm run deploy

Connect Claude Desktop Remotely

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