UStackUStack
Open Claude in Chrome icon

Open Claude in Chrome

Open Claude in Chrome é uma reimplementação open source que conecta o Claude Code a um navegador Chromium com as mesmas 18 ferramentas MCP.

Open Claude in Chrome

O que é Open Claude in Chrome?

Open Claude in Chrome é uma reimplementação completamente open source, de clean-room, de uma extensão de navegador “Claude in Chrome”. Ela conecta o Claude Code a um navegador baseado em Chromium por meio de automação de navegador e o mesmo conjunto de ferramentas MCP (Model Context Protocol).

Seu propósito principal é fornecer navegação no navegador e ações na página sem o comportamento de restrição de domínio descrito para a extensão oficial, mantendo paridade de recursos e desempenho conforme alegado pelo projeto.

Principais Recursos

  • Sem blocklist de domínios: Diferente da extensão oficial (que lista 58 domínios bloqueados em várias categorias), o Open Claude in Chrome é projetado para navegar em qualquer lugar.
  • Reimplementação de clean-room (open source, licença MIT): O código-fonte está disponível sob a licença MIT.
  • Funciona com qualquer navegador Chromium: Navegadores suportados incluem Chrome e Edge por padrão, com navegadores Chromium adicionais mencionados, como Brave, Arc, Opera, Vivaldi etc.
  • Mesmas 18 ferramentas MCP do Claude in Chrome: O projeto lista 18 endpoints de ferramentas e as posiciona como idênticas à extensão oficial.
  • Arquitetura de automação de navegador com três componentes: Uma extensão (Manifest V3 com automação baseada em CDP), um servidor MCP (processo Node.js iniciado pelo Claude Code) e uma ponte de host de mensagens nativas para conectar o servidor MCP à extensão.

Como Usar o Open Claude in Chrome

  1. Prepare os pré-requisitos: Instale Node.js v18+ e tenha um navegador Chromium suportado instalado. Use também Claude Code v2.0.73+.
  2. Instale as dependências da extensão:
    • cd host
    • npm install
    • cd ..
  3. Carregue a extensão:
    • Abra a página de extensões do seu navegador (ex.: chrome://extensions, brave://extensions, edge://extensions).
    • Ative o Modo de desenvolvedor.
    • Clique em Carregar sem compactação e selecione o diretório extension/.
    • Copie o ID da extensão exibido sob o nome da extensão.
  4. Registre o host de mensagens nativas:
    • Execute ./install.sh <seu-id-da-extensão>.
    • Se usar vários navegadores, passe vários IDs (o formato de exemplo está no repositório).
  5. Reinicie o navegador: O navegador lê as configurações de host de mensagens nativas na inicialização.
  6. Adicione MCP ao Claude Code:
    • Execute: claude mcp add open-claude-in-chrome -- node /caminho/absoluto/para/host/mcp-server.js
    • O repositório sugere determinar o caminho absoluto com: echo "node $(pwd)/host/mcp-server.js"
  7. Verifique: Inicie uma nova sessão do Claude Code e teste a navegação para um site como reddit.com; o repositório inclui uma etapa de verificação baseada em screenshot.

Casos de Uso

  • Navegar em sites bloqueados na extensão oficial: Se a extensão oficial bloqueia domínios específicos (o repositório enumera categorias como banking, investing, payments/transfers, gambling, dating e mais), o Open Claude in Chrome é projetado para permitir navegação nesses domínios.
  • Ler e extrair conteúdo da página: Use as ferramentas fornecidas, como get_page_text, para extrair texto principal de artigos ou páginas, suportando fluxos como revisão rápida ou sumarização.
  • Interagir com formulários web: Use form_input para definir valores de formulários por referência de elemento, útil para tarefas de entrada de dados estruturados.
  • Automação client-side dentro de uma sessão de navegação: Use ações como read_page (árvore de acessibilidade), find (localizar elementos por texto/atributos) e navigate/back/forward para progredir em páginas multistep.
  • Debugging ou inspeção durante navegação automatizada: Ferramentas como read_console_messages e read_network_requests ajudam os usuários a verem saída do console e atividade de rede encontrada pela automação.

FAQ

P: Quais navegadores são suportados?
R: O projeto afirma apenas Chrome e Edge por categoria, mas também suporta “qualquer navegador Chromium”, listando exemplos como Brave, Arc, Opera e Vivaldi.

P: Como instalo o host de mensagens nativas corretamente?
R: Execute ./install.sh com o ID da extensão exibido na página de extensões do seu navegador. Se usar vários navegadores, passe todos os IDs relevantes da extensão. Depois, reinicie o navegador antes de usar o Claude Code.

P: Como conecto o Open Claude in Chrome ao Claude Code?
R: Adicione como MCP no Claude Code usando claude mcp add open-claude-in-chrome -- node /caminho/absoluto/para/host/mcp-server.js, com o caminho absoluto para host/mcp-server.js.

P: O que faço se a extensão não conectar?
R: O repositório sugere verificar se a extensão está carregada e ativada, confirmar que ./install.sh foi executado com o ID correto da extensão, reiniciar o navegador completamente e verificar se o manifesto do host de mensagens nativas existe no diretório NativeMessagingHosts do navegador. Também menciona usar um caminho absoluto ao adicionar o servidor MCP.

P: O Open Claude in Chrome inclui as mesmas ferramentas de navegador da extensão oficial?
R: O repositório lista 18 ferramentas MCP e as apresenta como as “mesmas 18 ferramentas MCP” do Claude in Chrome.

Alternativas

  • Use a extensão oficial “Claude in Chrome”: Isso seguiria o mesmo fluxo geral de Claude no navegador, mas o repositório enfatiza que a extensão oficial inclui uma lista de bloqueio de domínios.
  • Outras abordagens de automação de navegador com IA: Procure ferramentas que integram um LLM com automação de navegador via protocolos ou frameworks de agentes (a diferença chave é se usam exposição de ferramentas no estilo MCP e como lidam com restrições do navegador).
  • Automação de navegador genérica (sem LLM): Frameworks de automação podem navegar e interagir com páginas sem uma camada de ferramentas LLM, mas não fornecerão o mesmo conjunto de ferramentas voltado para LLM descrito na integração MCP.