Visual Studio Code + Cloudflare

import { Steps } from "/components"; import AgentHeader from "/components/agent-setup/AgentHeader.astro"; import PlatformAccess from "/components/agent-setup/PlatformAccessSection.astro"; import ExamplePromptsList from "/components/agent-setup/ExamplePromptsList.astro"; import RandomPrompt from "/components/agent-setup/RandomPrompt.astro"; import TipsList from "/components/agent-setup/TipsList.astro"; import FAQList from "/components/agent-setup/FAQList.astro"; import FAQItem from "/components/agent-setup/FAQItem.astro"; import TroubleshootingList from "/components/agent-setup/TroubleshootingList.astro"; import TroubleshootingItem from "/components/agent-setup/TroubleshootingItem.astro"; import BuildAgentsCallout from "/components/agent-setup/BuildAgentsCallout.astro"; import OtherAgents from "/components/agent-setup/OtherAgents.astro";

Quick start

1. **Install Visual Studio Code and GitHub Copilot**

	Install [Visual Studio Code](https://code.visualstudio.com/) and make sure it is fully up to date. Then install the [GitHub Copilot extension](https://marketplace.visualstudio.com/items?itemName=GitHub.copilot) and sign in with a GitHub account. The Copilot free tier is enough to try this.

2. **Configure the Cloudflare MCP server**

	Create `.vscode/mcp.json` inside your workspace folder:

	```json
	{
	  "servers": {
	    "cloudflare-api": {
	      "type": "http",
	      "url": "https://mcp.cloudflare.com/mcp"
	    }
	  }
	}
	```

	Visual Studio Code uses `servers` as the root key. Configurations copied from Cursor or Claude Desktop use `mcpServers` and will silently do nothing here. For domain-specific MCP servers, refer to [mcp-server-cloudflare](https://github.com/cloudflare/mcp-server-cloudflare). For the full Cloudflare API MCP server (Code Mode), refer to [cloudflare/mcp](https://github.com/cloudflare/mcp).

3. **Start the server and authorize**

	After you save `mcp.json`, Visual Studio Code shows a **Start** CodeLens on the `cloudflare-api` server definition. Select it and complete the OAuth flow to authorize the Cloudflare MCP server against your account. Start with a demo account until you are comfortable with the scope you grant.

4. **Try a prompt**

	Open Copilot Chat (**Ctrl+Shift+I** / **Cmd+Shift+I**), switch to agent mode, and try a prompt — for example:

	<RandomPrompt />

For a screenshot-by-screenshot walkthrough — including the OAuth authorization page, verifying the server is running, and using natural language to create and delete DNS records — refer to the detailed walkthrough.

Cloudflare platform access

Example prompts

Tips

• The Cloudflare API MCP server uses Code Mode — the agent writes JavaScript against a typed API to reach any of 2,500+ endpoints in ~1,000 tokens. That is why you see only three tools registered, not thousands.
• Visual Studio Code's MCP configuration uses servers as the root key. Configurations copied from other agents (Cursor, Claude Desktop) use mcpServers and will not work in Visual Studio Code.
• Scope the OAuth grant to a single account, and start with Read only or a Custom permission set before granting Full access.
• Revoke the grant at any time from the Cloudflare dashboard under My Profile → Access Management → Connected Applications.

FAQ

The Cloudflare API specification is roughly two million tokens, which is far too large to hand an agent directly. The Cloudflare MCP server uses a code-execution pattern: the agent gets a tool to search the API spec and a tool to execute calls, and the spec stays server-side. Three tools is the correct, healthy state. No. The same server URL (`https://mcp.cloudflare.com/mcp`) works in Claude Code, Cursor, Claude Desktop, or any MCP-capable client. Visual Studio Code is one option among many. Yes. You can pass a Cloudflare API token as a bearer credential, which makes sense for CI/CD or shared automation. For interactive editor use, OAuth is the recommended path. API tokens using Client IP Address Filtering are not supported. Copilot Chat is the MCP client used in this guide, so yes — you need Copilot (or another MCP-capable extension) to actually drive the server. Visual Studio Code itself provides the MCP configuration and lifecycle, but the chat UI comes from Copilot.

Troubleshooting

The Visual Studio Code build and the Copilot extension are out of sync. Update Visual Studio Code from the blue button in the title bar, let it restart, and try again. The OAuth grant is read-only even though you intended to grant full access. This can happen if you authorize more than once — subsequent flows can silently come through with a reduced scope. Revoke the application under **My Profile → Access Management → Connected Applications** in the Cloudflare dashboard, sign out of the MCP session in Visual Studio Code (the account icon at the bottom of the activity bar), then start the server again. Check the root key in the JSON. Visual Studio Code requires `servers`, not `mcpServers`. Also confirm the file is at `.vscode/mcp.json` inside the open folder, not at the folder root. Decline. If authentication is broken, the fix is the OAuth grant, not pasting a bearer token into a chat window. Follow the API error 10000 troubleshooting steps to re-grant cleanly. Expected behavior until you select **Allow in this Session** in the Copilot Chat authorization prompt.

Build agents on Cloudflare

Other agents