VS Code MCP for WhatsApp: Connect GitHub Copilot to WaBot

What VS Code’s agent is, in one paragraph

VS Code runs AI agents through what Microsoft calls an agent harness: the layer that connects a model to your files, terminal and tools, asks you to approve actions, and keeps track of the session. It supports several harnesses, including Copilot, Anthropic Claude and OpenAI Codex. The Copilot harness shares its runtime with GitHub Copilot CLI and the Copilot app; the Local harness runs inside the editor. MCP servers add tools to these sessions, and which configuration file a session reads depends on the harness. That’s the only tricky part of this setup.

Before you start

• A WaBot account with a connected WhatsApp number. Open Developer → Developer Credentials in the WaBot app and copy your Client ID and Client Secret. The page also has a Copy MCP config button and links to the MCP guide.
• VS Code with AI features enabled and a local project folder open.
• Your own WhatsApp number to test with. Send your business number a “hi” from it first, so the 24-hour window is open for free-form test messages.

Option 1 (recommended): Copilot Global config with environment variables

VS Code’s Add MCP servers guide recommends Global → Copilot Global for a personal server you use across projects. It writes to ~/.copilot/mcp-config.json (or $COPILOT_HOME/mcp-config.json if you set COPILOT_HOME). This portable format uses a top-level mcpServers object, and HTTP header values can reference environment variables with ${NAME}.

1. Set two user environment variables, WABOT_CLIENT_ID and WABOT_CLIENT_SECRET, with the values from Developer Credentials.
2. Quit and reopen VS Code. Microsoft’s docs warn that setting a variable in an unrelated terminal doesn’t update an Agent Host that is already running.
3. Open the Command Palette and run MCP: Add Server, choose HTTP (HTTP or Server-Sent Events), enter https://api.wabot.shop/mcp, use the server ID wabot, and pick Global → Copilot Global. Then add the two headers in the configuration form (Chat: Open Customizations → MCP Servers → select the server). Or edit the file directly so it looks like this:

{
  "mcpServers": {
    "wabot": {
      "type": "http",
      "url": "https://api.wabot.shop/mcp",
      "headers": {
        "clientid": "${WABOT_CLIENT_ID}",
        "clientsecret": "${WABOT_CLIENT_SECRET}"
      },
      "tools": ["*"]
    }
  }
}

This mirrors Microsoft’s own environment-variable example. Note the braced ${NAME} form: the docs say it’s the form that works in both the Copilot runtime and VS Code, and that ${env:NAME} is only for the VS Code format. Type the variable reference, never the secret itself, into the form.

Option 2: .vscode/mcp.json with prompted secrets (Local harness)

If you use the Local harness, or you’d rather type the secret once than keep it in an environment variable, use the VS Code format. Run MCP: Open User Configuration (your profile’s mcp.json) or MCP: Open Workspace Folder MCP Configuration (.vscode/mcp.json) and add:

{
  "inputs": [
    {
      "type": "promptString",
      "id": "wabot-client-id",
      "description": "WaBot Client ID",
      "password": true
    },
    {
      "type": "promptString",
      "id": "wabot-client-secret",
      "description": "WaBot Client Secret",
      "password": true
    }
  ],
  "servers": {
    "wabot": {
      "type": "http",
      "url": "https://api.wabot.shop/mcp",
      "headers": {
        "clientid": "${input:wabot-client-id}",
        "clientsecret": "${input:wabot-client-secret}"
      }
    }
  }
}

Per the configuration reference, VS Code asks for each ${input:...} value the first time the server starts and stores it securely, and password: true hides what you type. The file only holds placeholders, so it’s safe to commit. Two caveats from the same docs: VS Code doesn’t forward servers that need these inputs to Copilot harness sessions, and the guided flow labels these destinations as deprecated (they stay available for compatibility). Workspace configs also inherit Workspace Trust, so they won’t start in Restricted Mode.

Check that it works

Microsoft’s advice is to prove the connection with a low-impact request and inspect the tool call, not just trust a plausible answer. Start an agent session and type:

Use the wabot MCP server to list my WhatsApp numbers and my approved templates. Don't send anything.

Copilot should call get_account, list_channels and list_templates, asking for approval first. Expand each call and check that it came from wabot. If nothing happens, run MCP: List Servers to start the server or see its output (see Manage MCP servers). To limit which WaBot tools the agent sees, use Chat: Open Customizations → Tools in Copilot sessions or Configure Tools in the chat input for Local sessions. You never need to give the agent an account ID: WaBot works it out from the Client ID.

Use case 1: send a test order update to your own phone and read the reply

You’ve just written the code that fires an order confirmation, and you want to see the real message before customers do.

Send the approved template order_update to +91 98xxx xxxxx with name Asha and order number 1042. Show me the exact message and number before sending. Then wait for my reply and tell me what I said.

• Tools: get_account (to find your whatsappPhoneId), get_template, send_template_message, then wait_for_reply.
• What you see: the template preview and recipient in chat, an approval prompt, the message arriving on your phone, then the reply you typed, quoted back by the agent. wait_for_reply waits up to 30 seconds per call, so reply quickly or ask the agent to check again with get_messages.
• Why a template: a first message, or anything sent more than 24 hours after the customer last wrote, must be an approved template. Inside the 24-hour window the agent can use send_session_message for free-form text.

Use case 2: create a utility template and get it approved

Your feature needs a new message, say a shipping update, and you’d rather draft it next to the code that fills its variables.

Create a UTILITY template called shipping_update in English: "Hi {{1}}, your order {{2}} has shipped. Track it here: {{3}}". Show me the components first. After submitting, check its status with Meta every few minutes until it's approved or rejected.

• Tools: list_channels, create_template, then get_template_status with sync: true, which asks Meta for the latest status.
• What you see: the template comes back as PENDING. Meta reviews new templates, which can take minutes to hours. If it’s rejected, ask the agent to explain the reason and submit a corrected version under a new name.

Use case 3: document an existing automation as a diagram

Someone on the team built auto-replies in WaBot months ago and nobody remembers how they connect. Put the answer in the repo’s docs.

List my WaBot workflows. For the one called Price enquiry, get the schematic and save the Mermaid diagram and step list to docs/whatsapp-automations.md.

• Tools: list_workflows, preview_workflow_schematic (returns a Mermaid flowchart plus a step list), and VS Code’s own file tools to write the Markdown.
• What you see: a new Markdown file with the trigger text, the templates each step sends and the order they run in, ready for review in your pull request.

Stay safe: real messages go to real people

• Ask the agent to show the message and recipient before every send, and approve tool calls one at a time. Don’t pre-approve send_template_message or send_session_message.
• Test on your own number first.
• Only message customers who agreed to hear from you. See WhatsApp opt-in rules.
• New automations are created inactive. Turn them on deliberately with activate: true or set_workflow_status once you’ve checked them.
• WaBot allows 60 MCP requests a minute per Client ID and writes every tool call to an audit log.

Limits to know

WaBot can also push reply notifications over the MCP session’s event stream (subscribe_replies), but only clients that keep that stream open receive them, and VS Code’s docs don’t say whether they surface these custom notifications. Use wait_for_reply instead. For other editors see WhatsApp MCP in Cursor and ChatGPT and Codex, or the full list in the WhatsApp MCP server guide.

Frequently asked questions

Does VS Code support remote MCP servers with custom headers?

Yes. In both the VS Code format (.vscode/mcp.json or the profile mcp.json) and the portable Copilot format (~/.copilot/mcp-config.json or .mcp.json), an HTTP server takes a url and a headers object. WaBot needs the headers clientid and clientsecret.

Which file should I use, .vscode/mcp.json or ~/.copilot/mcp-config.json?

For Copilot harness sessions, use the portable ~/.copilot/mcp-config.json with environment variables. VS Code doesn’t forward servers that need ${input:…} prompts to Copilot sessions. Use .vscode/mcp.json with inputs if you work in the Local harness.

Can I commit the WaBot MCP config to my repository?

Only if it contains references, not secrets: ${WABOT_CLIENT_ID} style environment variables or ${input:…} prompts. Never commit the Client Secret itself, and don’t commit the config copied from WaBot’s Copy MCP config button, because it contains your real credentials.

Can Copilot send WhatsApp messages to my customers?

Yes, through send_template_message and send_session_message, after you approve each call. Test on your own number, check the recipient before approving, and only message customers who opted in.

Can the agent run WhatsApp campaigns through MCP?

No. Campaigns, broadcast scheduling, analytics and segmentation stay in the WaBot app. MCP covers templates, single messages, chats, simple automations and WhatsApp Flows.