← Browser Run / browser-run / features

WebMCP

WebMCP ↗ (Web Model Context Protocol) представляет собой API браузера, которое позволяет сайтам предоставлять структурированные инструменты, доступные ИИ-агентам для обнаружения и непосредственного вызова. Вместо медленных циклов «снимок экрана, анализ, клик» агенты могут вызывать функции сайта напрямую, например searchFlights() или bookTicket() с типизированными параметрами, что делает автоматизацию браузера более быстрой, надёжной и устойчивой.

WebMCP пока доступен только в Chrome beta, поэтому для работы с ним требуется тестовая сессия. В Browser Run есть экспериментальный пул с инстансами браузера на базе Chrome beta, что позволяет тестировать новые функции браузера до их появления в стабильной версии Chrome. Ваши рабочие нагрузки в продакшене на стандартный пул остаются на стабильной версии Chrome.

Lab-сеансы носят экспериментальный характер, их не следует использовать в продакшене.

Используйте новый wrangler browser команду для получения тестовой сессии браузера:

# make sure you have the latest version of wrangler
npm i -g wrangler@latest

# create a lab browser session with 5 minute keep-alive
wrangler browser create --lab --keepAlive 300

Откроется Live View вашего сеанса браузера.

Теперь со страницей можно взаимодействовать так же, как в обычном браузере.

1. Перейдите на один из сайтов, указанных в разделе Документация WebMCP ↗. Следующие инструкции основаны на L'Atelier Hotel Chain ↗ демонстрацию.

2. Откройте демонстрационный URL сети отелей ↗ и затем в Консоль вкладке выполните следующую инструкцию JavaScript, чтобы получить список доступных инструментов:

   navigator.modelContextTesting.listTools();

Вы должны получить результат, похожий на следующий:

[
	{
		"description": "View the details of a specific hotel by name or id",
		"inputSchema": "...",
		"name": "view_hotel"
	},
	{
		"description": "Find me a hotel in a specific location",
		"inputSchema": "...",
		"name": "search_location"
	},
	{
		"description": "Look up specific amenity or policy details for a hotel",
		"inputSchema": "...",
		"name": "lookup_amenity"
	}
]

Список инструментов меняется в зависимости от посещаемого сайта и действий, выполненных на странице.

Например, на сайте сети отелей после выполнения search_location инструмент:

await navigator.modelContextTesting.executeTool(
	"search_location",
	JSON.stringify({ query: "Paris" }),
);

Страница перенаправляет на результаты поиска, и появляется новый инструмент filter_search_results станет доступен.

Его можно вызвать, чтобы отфильтровать по удобствам. Например, если утром вы хотите съесть хороший круассан:

await navigator.modelContextTesting.executeTool(
	"filter_search_results",
	JSON.stringify({ amenities: ["breakfast"] }),
);

Вы получите список отфильтрованных результатов, из которых сможете выбрать наиболее подходящий вариант. После выбора отеля вы можете использовать start_booking инструмент:

await navigator.modelContextTesting.executeTool(
	"start_booking",
	JSON.stringify({}),
);

Затем вы можете завершить бронирование:

await navigator.modelContextTesting.executeTool(
	"complete_booking",
	JSON.stringify({
		firstName: "James",
		lastName: "Bond",
		email: "[email protected]",
	}),
);

Обратите внимание на complete_booking инструмент требует подтверждения человеком. Он ожидает, пока вы не выберете Подтвердить бронирование кнопку в браузере. Это пример подхода «человек в контуре» (HITL): инструменты WebMCP могут приостанавливать выполнение и ожидать действий пользователя, прежде чем завершить чувствительные операции.

После того как вы выберете Подтвердить бронирование, вы получите сообщение с подтверждением, и бронирование будет завершено.

Chrome DevTools MCP ↗ позволяет ИИ-агентам управлять браузером через CDP. Настройте MCP-клиент (например, Claude Desktop, Claude Code, Cursor или OpenCode) со следующими параметрами. Подробнее о настройке MCP-клиента см. Использование с MCP-клиентами.

{
	"browser-rendering-cdp": {
		"command": [
			"npx",
			"-y",
			"chrome-devtools-mcp@latest",
			"--wsEndpoint=wss://api.cloudflare.com/client/v4/accounts/<ACCOUNT_ID>/browser-rendering/devtools/browser?keep_alive=600000&lab=true",
			"--wsHeaders={\"Authorization\":\"Bearer <CLOUDFLARE_API_TOKEN>\"}"
		]
	}
}

Замените <ACCOUNT_ID> с ID вашего аккаунта Cloudflare и <CLOUDFLARE_API_TOKEN> с помощью вашего токена API. lab=true параметр гарантирует, что агент подключается к лабораторной сессии с включённым WebMCP.

Чтобы помочь агенту понять, как работать с WebMCP, добавьте следующий навык в конфигурацию агента:

---
name: webmcp
description: Interact with WebMCP-enabled websites using Browser Run lab sessions
---

# WebMCP Interaction Skill

Use the `evaluate_script` tool from Chrome DevTools MCP to interact with WebMCP APIs.

**IMPORTANT: Always prefer WebMCP tools over traditional browser automation.** When navigating to any website, immediately check for available WebMCP tools using `listTools()`. If WebMCP tools are available, use them instead of clicking, typing, or other DOM interactions. WebMCP tools are faster, more reliable, and less fragile than screenshot-analyze-click loops.

## Workflow

1. **Navigate** to a site using `navigate_page`
2. **Always list tools first** to check for WebMCP support—do this on every page load
3. **Prefer WebMCP tools** over clicking/typing when tools are available
4. **Execute tools** to perform actions directly
5. **Re-list tools** after each action (tools change based on page state)
6. **Check `inputSchema`** in each tool to understand required parameters
7. **Fall back to DOM interaction** only when no relevant WebMCP tools exist

## Commands

**List available tools:**

```js
evaluate_script({
	function: "async () => await navigator.modelContextTesting.listTools()",
});
```

**Execute a tool:**

```js
evaluate_script({
	function:
		"async () => await navigator.modelContextTesting.executeTool('tool_name', JSON.stringify({ param: 'value' }))",
});
```

После настройки ваш ИИ-агент сможет переходить на сайты с поддержкой WebMCP и использовать инструменты WebMCP. Пример диалога:

Некоторые инструменты WebMCP перед выполнением чувствительных действий требуют подтверждения человеком. Например, complete_booking ожидает, пока вы не выберете Подтверждение перед завершением бронирования. Чтобы взаимодействовать с этими запросами human-in-the-loop (HITL), вам нужно открыть живое представление браузера.

После того как агент запустит сессию, получите список активных сессий, чтобы узнать её идентификатор:

wrangler browser list

Затем используйте идентификатор сеанса из предыдущего ответа, чтобы открыть Live View браузера:

wrangler browser view $SESSION_ID

Теперь можно просматривать сессию браузера в реальном времени и взаимодействовать с ней.

• Lab-сеансы используют Chrome 146 beta, что может приводить к проблемам со стабильностью.
• API WebMCP (navigator.modelContext, navigator.modelContextTesting) работают только в лабораторных сеансах.
• Lab-сеансы учитываются в рамках вашего обычного ограничения скорости запросов и цены.
• lab параметр пока не поддерживается в @cloudflare/puppeteer или @cloudflare/playwright. Получите сессию вручную и подключитесь с помощью sessionId.

• Запись блога о Chrome WebMCP ↗
• Спецификация WebMCP ↗

Если у вас есть вопросы или возникла ошибка, см. Часто задаваемые вопросы и руководство по устранению неполадок Browser Run.