Claude Code supports MCP servers via config files. browser.city runs a hosted MCP server, so you can connect Claude Code to real remote browsers with one JSON entry.
1) Set your API key
Set BROWSERCITY_API_KEY in your environment (shell profile, .env, CI secret, etc.).
2) Add a server in ~/.claude.json (user) or .mcp.json (project)
Add this to your MCP config:
.claude.json
{ "mcpServers": { "browsercity": { "url": "https://mcp.browser.city/mcp", "headers": { "Authorization": "Bearer ${BROWSERCITY_API_KEY}" } } }}{ "mcpServers": { "browsercity": { "url": "https://mcp.browser.city/mcp", "headers": { "Authorization": "Bearer ${BROWSERCITY_API_KEY}" } } }}{ "mcpServers": { "browsercity": { "url": "https://mcp.browser.city/mcp", "headers": { "Authorization": "Bearer ${BROWSERCITY_API_KEY}" } } }}{ "mcpServers": { "browsercity": { "url": "https://mcp.browser.city/mcp", "headers": { "Authorization": "Bearer ${BROWSERCITY_API_KEY}" } } }}Notes:
- Some Claude Code versions require specifying a transport type for remote servers. If so, add
"type": "http"next to theurl. - Prefer env var expansion (
${…}) so you don’t commit secrets into a repo config.
3) Try it
In Claude Code, ask:
Use browsercity tools to open a session, navigate to
https://example.com, and return the page markdown.
You should see tools like browser_open, browser_navigate, browser_snapshot, browser_click, and browser_markdown available.
4) When to use MCP vs direct REST
- Use MCP when you want Claude Code to drive multi-step browsing as tools.
- Use the Request API when you just want markdown/text for URLs and don’t need interaction:
request.ts
const apiKey = process.env.BROWSERCITY_API_KEY!;const opts = { method: "POST", headers: { Authorization: `Bearer ${apiKey}` } };const res = await fetch("https://api.browser.city/v1/requests", { ...opts, body: JSON.stringify({ url: "https://example.com", markdown: true }),}).then((r) => r.json());console.log(res.content);import osimport requestsapi_key = os.environ["BROWSERCITY_API_KEY"]res = requests.post( "https://api.browser.city/v1/requests", headers={"Authorization": f"Bearer {api_key}"}, json={"url": "https://example.com", "markdown": True},).json()print(res["content"])using System.Net.Http.Headers;using System.Net.Http.Json;var apiKey = Environment.GetEnvironmentVariable("BROWSERCITY_API_KEY")!;var http = new HttpClient();http.DefaultRequestHeaders.Authorization = new AuthenticationHeaderValue("Bearer", apiKey);var res = await http.PostAsJsonAsync( "https://api.browser.city/v1/requests", new { url = "https://example.com", markdown = true });Console.WriteLine(await res.Content.ReadAsStringAsync());import java.net.URI;import java.net.http.*;var apiKey = System.getenv("BROWSERCITY_API_KEY");var http = HttpClient.newHttpClient();var body = "{\"url\":\"https://example.com\",\"markdown\":true}";var req = HttpRequest.newBuilder() .uri(URI.create("https://api.browser.city/v1/requests")) .header("Authorization", "Bearer " + apiKey) .POST(HttpRequest.BodyPublishers.ofString(body)) .build();var res = http.send(req, HttpResponse.BodyHandlers.ofString());System.out.println(res.body());