Dois protocolos dominam o controle de browser por IA: CDP (Chrome DevTools Protocol) e MCP (Model Context Protocol). Eles resolvem problemas diferentes em camadas diferentes, mas desenvolvedores que constroem agentes de browser frequentemente os confundem ou escolhem o errado para o seu caso de uso. Este guia explica o que cada protocolo faz, quando usar cada um e como eles funcionam juntos em uma stack de agente em produção.
TL;DR: CDP dá ao seu agente controle direto e de baixo nível sobre um browser via conexão WebSocket. MCP dá ao seu LLM ferramentas de browser de alto nível por meio de uma interface padronizada de tool-use. CDP é o motor; MCP é o volante. A maioria dos agentes de IA em produção precisa de ambos: MCP para o LLM decidir as ações, CDP por baixo para o browser funcionar de fato. Clawbrowser suporta os dois nativamente.
Nota: "CDP" neste artigo se refere ao Chrome DevTools Protocol, o padrão de controle de browser.
O que CDP e MCP realmente são
CDP: Chrome DevTools Protocol
CDP é um protocolo baseado em WebSocket para controlar browsers Chromium programaticamente. O Google o criou para o Chrome DevTools (o inspetor que você abre com F12), mas ele se tornou o padrão para automação de browser. Playwright, Puppeteer e todas as principais bibliotecas de automação usam CDP internamente.
Quando você chama page.goto() no Playwright, ele envia um comando CDP via WebSocket para o browser. CDP dá controle granular: navegar páginas, executar JavaScript, interceptar requisições de rede, manipular cookies e capturar screenshots.
# CDP: your code controls the browser directly
from playwright.async_api import async_playwright
async with async_playwright() as p:
browser = await p.chromium.connect_over_cdp("http://127.0.0.1:9222")Para o aprofundamento completo em CDP, veja CDP Browser for AI Agents: A Developer Guide.
MCP: Model Context Protocol
MCP é um protocolo que padroniza como LLMs se conectam a ferramentas externas. Em vez de escrever definições customizadas de function-call para cada ferramenta, o LLM descobre as ferramentas disponíveis através de um servidor MCP e as chama usando uma interface padrão.
Para controle de browser, um servidor MCP expõe ações como navegar, clicar, digitar, capturar screenshot e extrair como ferramentas que o LLM pode invocar. O LLM decide qual ferramenta chamar com base na tarefa. Sem código Playwright, sem seletores CSS, sem definições customizadas de ferramentas no seu agente.
{
"mcpServers": {
"clawbrowser": {
"command": "clawctl",
"args": ["mcp", "serve"]Adicione essa configuração ao Claude Code, Cursor, Gemini CLI ou qualquer agente compatível com MCP. O LLM ganha ferramentas de browser imediatamente.
Por que são confundidos
Os dois protocolos conectam um agente de IA a um browser. Ambos usam a palavra "protocol". Ambos aparecem nas mesmas conversas sobre infraestrutura de agentes de IA. Mas operam em camadas diferentes:
- CDP é um protocolo no nível do browser. Ele fala com o Chromium.
- MCP é um protocolo no nível da aplicação. Ele fala com LLMs.
Um servidor MCP de browser usa CDP internamente para controlar o browser. Eles não são alternativas. São camadas da mesma stack.
Comparação lado a lado
| CDP (Chrome DevTools Protocol) | MCP (Model Context Protocol) | |
|---|---|---|
| Criado por | Google (equipe Chrome) | Anthropic |
| Tipo de protocolo | Controle de browser (WebSocket) | Uso de ferramentas (stdio/SSE) |
| Quem chama | Seu código (Playwright, Puppeteer, WebSocket direto) | Um LLM (Claude, GPT, Gemini) |
| Nível de controle | Baixo nível: DOM, rede, execução JavaScript, cookies | Alto nível: navegar, clicar, digitar, screenshot, extrair |
| Configuração | Conectar à porta de debugging do browser | Configurar um servidor MCP no agente |
| Flexibilidade | Total: tudo que o browser pode fazer | Limitada às ferramentas expostas pelo servidor |
| Velocidade por ação | Milissegundos (sem inferência) | 0,5-3 segundos (LLM decide cada passo) |
| Tratamento de erros | Seu código trata erros | O LLM raciocina sobre erros |
| Anti-detection | Não embutido (depende do browser) | Não embutido (depende do browser) |
| Melhor para | Automação com script, controle granular, desenvolvimento de frameworks | Navegação dirigida por LLM, tarefas abertas, prototipagem rápida |
Nenhum dos protocolos cuida de anti-detection. Esse é um problema no nível do browser, não do protocolo. Uma instância Chrome padrão conectada via CDP ou por um servidor MCP vaza os mesmos sinais de automação. Anti-detection requer uma solução no nível do engine, como o Clawbrowser: fingerprints gerenciados em mais de 20 superfícies, proxy routing embutido e supressão de sinais CDP no nível do código-fonte do Chromium.
Quando usar CDP
Use CDP quando você precisa de controle preciso e programático sobre o browser e sabe os passos exatos com antecedência.
Cenários em que CDP vence:
- Scraping estruturado. Você sabe quais seletores mirar, quais dados extrair e como lidar com paginação. Seu código roda os mesmos passos toda vez.
- Interceptação de rede. Você precisa bloquear recursos, modificar headers de requisição, capturar respostas de API ou injetar JavaScript antes do carregamento da página.
- Condições de espera complexas. Você precisa esperar por elementos DOM específicos, estados de rede idle ou mudanças em variáveis JavaScript antes de agir.
- Automação crítica em performance. Comandos CDP executam em milissegundos. Sem delay de inferência LLM por ação. Um job de scraping com 50 passos que leva segundos via CDP levaria minutos com raciocínio LLM por passo.
- Desenvolvimento de frameworks. Você está construindo um framework de agentes, harness de testes ou biblioteca de automação que outros vão usar.
# CDP: full control, full responsibility
await page.wait_for_selector("#login-form")
await page.fill("#email", "[email protected]")
await page.fill("#password", credentials)
await page.click("#submit")O trade-off: você escreve e mantém todo o código de integração com o browser. Cada seletor, cada condição de espera, cada handler de erro. Quando a estrutura da página alvo muda, seu código quebra.
Quando usar MCP
Use MCP quando o LLM deve decidir o que fazer em seguida com base no que vê na página.
Cenários em que MCP vence:
- Navegação aberta. "Encontre a página de preços e extraia os detalhes dos planos." O agente navega, lê a página e decide onde clicar sem seletores fixos no código.
- Workflows multi-step com julgamento. "Faça login, verifique se há uma nova fatura, baixe-a se o valor for acima de US$ 500." O LLM lida com a lógica condicional lendo o conteúdo da página em cada etapa.
- Prototipagem rápida. Você quer um agente de browser em cinco minutos sem escrever código Playwright. Adicione a config MCP, descreva a tarefa, pronto.
- Usuários não técnicos. O operador do agente descreve tarefas em linguagem natural. Sem código necessário.
- Ambientes nativos de agentes. Claude Code, Cursor e Gemini CLI já falam MCP. Adicionar um browser é um bloco de configuração.
# MCP: the LLM decides what to do
User prompt: "Go to example.com and tell me the page title"
LLM calls: navigate(url="https://example.com")
LLM calls: screenshot()O trade-off: menos precisão. O LLM pode clicar no elemento errado, executar passos extras ou ler mal o conteúdo da página. Cada ação carrega a latência de inferência do LLM. Não dá para interceptar requisições de rede ou injetar JavaScript pelas ferramentas MCP padrão de browser.
Quando usar os dois juntos
É aqui que a maioria dos agentes de IA em produção acaba. MCP cuida da interface LLM-agente. CDP cuida da interface agente-browser. O servidor MCP fica entre eles, traduzindo chamadas de ferramentas de alto nível em comandos de browser de baixo nível.
LLM ← MCP → MCP Server ← CDP → Browser
(clawctl) (Clawbrowser)O LLM envia chamadas de ferramentas MCP ("navegue para esta URL", "clique no botão de login"). O servidor MCP traduz essas chamadas em comandos CDP e os envia ao browser. Os resultados voltam pelo mesmo caminho.
Por que a camada do browser importa
A maioria dos servidores MCP de browser conecta a uma instância Chrome padrão via CDP. O browser não tem gerenciamento de fingerprint, nem proxy routing, nem anti-detection. Seu agente funciona em sites demo, mas é bloqueado em sites de produção protegidos por Cloudflare, DataDome ou Akamai.
O servidor MCP embutido do Clawbrowser conecta ao seu próprio engine Chromium. Quando o LLM chama navigate, o servidor MCP envia um comando CDP para um browser que já tem fingerprints gerenciados, proxy routing geo-alinhado e supressão de sinais CDP no nível do engine. Sem plugins stealth, sem middleware de proxy, sem código de rotação de fingerprint.
Caminho MCP (dirigido por LLM, zero código de integração):
{
"mcpServers": {
"clawbrowser": {
"command": "clawctl",
"args": ["mcp", "serve"]Caminho CDP (com script, controle total):
browser = await playwright.chromium.connect_over_cdp(
"http://127.0.0.1:9222"
)Os dois caminhos conectam à mesma instância Clawbrowser com os mesmos fingerprints, proxy routing e anti-detection. Escolha a interface que se encaixa no seu caso de uso. Use ambos no mesmo projeto quando partes diferentes do workflow precisam de níveis diferentes de controle.
Para um tutorial passo a passo construindo um agente com os dois protocolos, veja How to Build an AI Agent That Browses the Web.
Framework de decisão
| Pergunta | CDP | MCP |
|---|---|---|
| Você sabe os passos exatos com antecedência? | Sim | Use CDP |
| O LLM deve decidir onde clicar? | Use MCP | Sim |
| Você precisa de interceptação de rede? | Sim | Não disponível |
| Você precisa de velocidade abaixo de um segundo por ação? | Sim | Não (latência LLM) |
| Você está construindo para usuários não técnicos? | Não | Sim |
| Você usa Claude Code ou Cursor? | Disponível | Integração nativa |
| Você quer zero código de browser? | Não | Sim |
Se você respondeu "sim" em perguntas dos dois lados, use ambos: MCP para as partes dirigidas pelo LLM, CDP para as partes de precisão. Clawbrowser cuida da camada de browser para qualquer protocolo.
FAQ
Posso alternar entre CDP e MCP sem trocar de browser?
Sim, se o seu browser suporta ambos. Clawbrowser expõe um endpoint CDP em cada perfil e tem um servidor MCP embutido. Conecte Playwright ao endpoint CDP para automação com script e use o servidor MCP para navegação dirigida por LLM, ambos nos mesmos perfis de browser com os mesmos fingerprints e sessões. Veja How to Connect Cursor to a Real Browser via CDP para um passo a passo dos dois métodos de conexão.
Qual protocolo é mais rápido?
CDP. Comandos executam em milissegundos porque não há inferência LLM envolvida. MCP adiciona 0,5-3 segundos por ação porque o LLM precisa decidir qual ferramenta chamar e interpretar o resultado. Para um job de scraping com 50 passos, CDP termina em segundos. O mesmo job via MCP leva minutos. Use CDP para automação em massa quando você sabe os passos. Use MCP para tarefas que requerem julgamento em cada etapa.
E o WebDriver BiDi?
WebDriver BiDi é um padrão W3C que visa substituir tanto o WebDriver (usado pelo Selenium) quanto partes do CDP por um protocolo agnóstico de browser. Ainda está amadurecendo. Playwright e Puppeteer ainda usam CDP internamente. Quando o WebDriver BiDi atingir adoção plena, ele vai competir com CDP na camada de controle de browser, não com MCP na camada de tool-use. O framework de decisão CDP-vs-MCP deste artigo se aplica independentemente de qual protocolo de baixo nível vença.
Preciso de um browser anti-detect para algum dos protocolos?
Sim, se seu agente automatiza em sites com proteção anti-bot. Nem CDP nem MCP incluem anti-detection. São protocolos para enviar comandos a um browser. Se o browser vaza sinais de automação (navigator.webdriver, headless User-Agent, canvas hash genérico), o site bloqueia independentemente do protocolo usado. Veja Browser Automation Without Getting Blocked para o modelo completo de detecção.
Comece a construir
Instale o Clawbrowser em clawbrowser.ai colando o prompt de instalação no seu agente de IA.
Caminho MCP (dirigido por LLM): adicione a config do servidor MCP do Clawbrowser ao seu agente e comece a navegar em linguagem natural.
Caminho CDP (com script): conecte Playwright ou Puppeteer ao endpoint CDP e escreva seu código de automação.
Ambos: use MCP para as partes em que o LLM raciocina sobre o que fazer. Use CDP para as partes em que você precisa de controle preciso, rápido e determinístico. Mesmo browser, mesmos fingerprints, mesmas sessões.
Para o aprofundamento em CDP, leia CDP Browser for AI Agents: A Developer Guide. Para um tutorial completo, leia How to Build an AI Agent That Browses the Web.
Continue exploring
Ask AI how Clawbrowser helps
Continue lendo
Artigos relacionados
Como conectar o Cursor a um browser real via CDP
O browser integrado do Cursor é uma webview isolada. Conecte o Cursor ao Clawbrowser via CDP para sessões persistentes, fingerprints gerenciados e proxy routing.
Ler artigo →
Navegador CDP para agentes de IA: Um Guia de Desenvolvedor
Chrome DevTools Protocol é a forma padrão como agentes de IA controlam navegadores. Chrome padrão é detectado. Aqui está como conectar seu agente a um navegador CDP que não fica bloqueado.
Ler artigo →