Blog / AI agents

VS Code MCP Server Setup: Add Live Web Data to Copilot

28 Sept 2026Perceptlayer7 min read

To set up an MCP server in VS Code, add it to .vscode/mcp.json (or your user profile's mcp.json) under servers, start it, and use its tools from Copilot Chat in agent mode. For Perceptlayer, the server is an http server at https://api.perceptlayer.com/mcp, and the API key goes in an Authorization header filled from a promptString input with password: true, so VS Code asks for the key once and never writes it to the file.

What do you need before you start?

VS Code with GitHub Copilot Chat, which runs MCP tools in agent mode, and a Perceptlayer API key. Get a free API key; keys start with sk_live_, and verifying your email gives you 1,000 free credits every month, with no card. Nothing else needs installing: the server is remote, over Streamable HTTP, so there's no local process or package.

If you've already added the server to Claude Desktop or Cursor, the URL and header are the same; only the file format differs. The guide to adding an MCP server to Claude Desktop and Cursor covers those two clients, so this one sticks to VS Code.

How do you write .vscode/mcp.json?

Create .vscode/mcp.json in your workspace with an input for the key and one server that uses it. VS Code's configuration reference describes this format: a top-level servers object, an optional inputs array for sensitive values, and ${input:id} references that VS Code fills in when the server starts. HTTP servers take type, url and headers (VS Code MCP configuration reference, 2026).

{
  "inputs": [
    {
      "type": "promptString",
      "id": "perceptlayer-key",
      "description": "Perceptlayer API key",
      "password": true
    }
  ],
  "servers": {
    "perceptlayer": {
      "type": "http",
      "url": "https://api.perceptlayer.com/mcp",
      "headers": { "Authorization": "Bearer ${input:perceptlayer-key}" }
    }
  }
}

We haven't run this config in VS Code against the live server for this article; it follows VS Code's configuration reference and the AI agents (MCP) docs. The first time the server starts, VS Code prompts for perceptlayer-key with the input masked, and stores the value securely for later sessions. Because the file holds only the reference, you can commit it and every teammate gets their own prompt for their own key. Don't replace the reference with a literal key in a committed file: the reference says not to commit tokens or populated authentication headers.

The header value must include the Bearer prefix. The server also accepts the key in an X-API-Key header, but Authorization: Bearer is what the AI agents (MCP) docs use, and it's what most clients expect.

Can you add it for every workspace instead?

Yes. Put the same JSON in your user profile's mcp.json, which the command MCP: Open User Configuration opens. A server there is available in every workspace without a file in each repository, which suits a personal key. The workspace file suits a team, since it travels with the repository.

You can also run MCP: Add Server from the Command Palette, choose an HTTP server, enter the URL and an ID such as perceptlayer, and pick where to save it (VS Code: Add MCP servers, 2026). The guided flow doesn't add the key input for you, so open the file it wrote and add the inputs entry and headers block from the example above. Recent versions of VS Code offer more destinations in that flow; the server definition is the same wherever it's saved.

How do you start the server and check its tools?

Start the server from the mcp.json editor or the MCP server list, confirm that you trust it, and enter your key when prompted. VS Code treats trusting a server to start as a separate step from authenticating to it and from approving tool calls. Once it starts, it discovers the server's tools: you should see search_endpoints, get_endpoint and call_endpoint.

Open Copilot Chat, switch to agent mode, and open Configure Tools in the chat input to check that the three tools are enabled for the session. If you have many MCP servers, turning off the tools you don't need for a task keeps the model's choices short; the article on MCP servers with too many tools explains why Perceptlayer exposes three tools rather than one per endpoint.

What does the first tool call look like?

Ask something that needs live data and name the server, which is also VS Code's suggested way to check a connection. Try: "Use perceptlayer to search Google for best restaurants in Berlin and list the top two results." The model calls search_endpoints to find a Google search endpoint and may call get_endpoint to read its parameters, both free. Then it calls call_endpoint:

{
  "endpoint": "google-search.search",
  "params": { "query": "best restaurants in Berlin", "hl": "en", "safe": "off" }
}

Expand the tool call in the chat to see which server answered and what it returned. This is our recorded response for the same request made over the HTTP API, trimmed; through MCP, call_endpoint returns the same JSON:

{
  "search_information": {
    "query_displayed": "best restaurants in Berlin",
    "organic_results_count": 6
  },
  "organic_results": [
    {
      "position": 1,
      "title": "The Best Restaurants in Berlin - Food Guide & Map",
      "link": "https://andershusa.com/best-restaurants-berlin-germany-guide/",
      "source": "Anders & Kaitlin",
      …
    },
    {
      "position": 2,
      "title": "Restaurants - Berlin",
      "link": "https://guide.michelin.com/us/en/berlin-region/berlin/restaurants",
      "source": "MICHELIN Guide",
      …
    }
  ],
  …
}

After the JSON, the tool result carries a second line: Credits used: 1. Credits remaining: … and a request ID. The Google Search API page lists the endpoint's other parameters, such as gl for country and device.

Why don't you see a confirmation before each call?

Because every Perceptlayer tool is marked read-only. VS Code's MCP guide says it shows a confirmation dialog before running a tool that lacks the readOnlyHint annotation (VS Code MCP developer guide, 2026). All three Perceptlayer tools declare readOnlyHint: true, which is accurate, since they only read data, so VS Code can run them straight away.

Reading data still costs credits. Each successful call_endpoint spends the endpoint's credits, and in agent mode the model can make several calls for one question. Keep an eye on the Credits used and Credits remaining lines while you try it out, and tell the agent your limit in the prompt, such as "make at most 3 call_endpoint calls". For a cap that holds regardless of the prompt, enforce it in your own code; the guide to AI agent cost control shows how.

Failed calls cost nothing. A call with a bad parameter comes back as a tool result starting Error invalid_parameters: and debits 0 credits, and the next successful call's Credits remaining shows the balance unchanged. The credits docs explain the balance and the errors docs list every code.

What goes wrong, and how do you fix it?

Most problems are the header. The catalogue tools work without a key, so a server that lists its tools and runs search_endpoints but fails on call_endpoint has a key problem. The error code in the tool result tells you which.

Once it works, try a question against another website in the catalogue, such as Zillow listings or Indeed jobs, with no change to the config.

vs codemcpgithub copilotai agentsweb data