Browser MCP: automação do navegador com Cursor, Claude e VS Code

 (browsermcp.io)
2 pontos por GN⁺ 2025-04-08 | 1 comentários | Compartilhar no WhatsApp
  • O Browser MCP conecta apps de IA ao navegador do usuário, permitindo automatizar preenchimento de formulários, testes e tarefas repetitivas na web
  • A automação é executada na máquina local, reduzindo a latência de rede, e a atividade do navegador não é enviada a servidores remotos
  • Ele usa o perfil existente do navegador para manter o estado de login e pode evitar detecção básica de bots e CAPTCHAs usando uma impressão digital real do navegador
  • O processo inicial tem 3 etapas: instalar a extensão do navegador, adicionar o servidor MCP ao aplicativo de IA e criar um fluxo de automação
  • Fornece ferramentas necessárias para controlar o navegador, como navegação por URL, clique, arrastar e soltar, snapshot, captura de tela e consulta de logs do console

Automação de tarefas no navegador que só apps de IA não conseguem fazer facilmente

  • Automações que exigem controle do navegador, como preencher formulários repetidamente em sites, são difíceis de realizar apenas com apps de IA como Cursor ou Claude
  • O Browser MCP conecta apps de IA ao navegador do usuário para que possam executar tarefas web no lugar dele
  • Há dois principais casos de uso
    • Testes automatizados: o editor de IA testa o código de ponta a ponta, valida fluxos de usuário e elementos de UI, e verifica o comportamento da aplicação em vários cenários
    • Automação de tarefas: lida com tarefas repetitivas baseadas na web, como coleta de dados, preenchimento de formulários e automação de fluxos de trabalho

Fluxo de instalação e modo de execução local

  • O início é composto por três etapas
    • Instalar a extensão do Browser MCP no navegador
    • Adicionar o servidor MCP do Browser MCP ao aplicativo de IA para conectá-lo à extensão do navegador
    • Começar a criar fluxos de automação para que o assistente de IA execute tarefas repetitivas dentro do navegador
  • A automação é executada na máquina local do usuário
    • Busca melhor desempenho e menor latência de rede
    • A atividade do navegador não é enviada a servidores remotos e permanece no dispositivo
    • Usa o perfil existente do navegador para manter o estado de login nos serviços
    • Usa uma impressão digital real do navegador para evitar detecção básica de bots e CAPTCHAs

Ferramentas oferecidas e plataformas compatíveis

  • Fornece ferramentas necessárias para controlar o navegador
    • Navigate, Go Back, Go Forward, Wait
    • Press Key, Click, Drag & Drop, Hover, Type Text
    • Snapshot, Screenshot, Get Console Logs
  • Entre os compatíveis estão Cursor, Claude, Windsurf e VSCode
  • A documentação está disponível em Documentation

Leituras relacionadas

1 comentários

 
GN⁺ 2025-04-08
Opiniões no Hacker News

  • [!warning!] A extensão para Chrome deste projeto envia dados detalhados de telemetria remota para PostHog e Amplitude: https://storage.googleapis.com/cobrowser-images/telemetry.pn..., https://storage.googleapis.com/cobrowser-images/pings.png
    Além disso, embora o código-fonte do servidor MCP local esteja incluído, não há o código-fonte da extensão do Chrome, e ela parece empacotar https://github.com/ruifigueira/playwright-crx sem atribuição, o que é muito suspeito

    • Sou o criador do Browser MCP. A extensão usa um ID de dispositivo anônimo e envia eventos de análise quando chamadas de ferramentas são usadas
      Observando o tráfego de rede, dá para confirmar que nenhuma informação personalizada ou identificável é enviada. O objetivo é coletar dados de uso anonimizados para entender quanto a extensão é usada, como um site conta visitantes. Como divido meu tempo entre vários projetos, saber o número de usuários ativos ajuda a decidir onde concentrar esforços
      Escrevi toda a extensão eu mesmo, e expliquei nesta issue do GitHub por que o repositório atual contém apenas o servidor MCP: https://github.com/BrowserMCP/mcp/issues/1#issuecomment-2784...
      Em resumo, uso um monorepo que contém o código compartilhado por todas as extensões, então separar só esta extensão e manter vários monorepos sincronizados exigiria bastante trabalho. Você pode não gostar da forma como o projeto está organizado, mas não há nada malicioso
    • Se “detalhado” aqui significa um deviceId anônimo e um contador do número de chamadas de ferramentas, então vocês também estão problematizando um app tentar obter insights básicos de uso
    • As únicas extensões do Chrome que podem ser instaladas com segurança são aquelas que você consegue compilar diretamente a partir do código-fonte

  • O site afirma que “usa a impressão digital real do navegador para evitar detecção de bots e CAPTCHA”, mas, na prática, não foi bem assim
    Algumas semanas atrás, fiz um sistema parecido para permitir que uma IA controlasse o navegador em uma sessão logada e, mesmo em uma sessão usada manualmente por uma pessoa, CAPTCHAs começaram a aparecer e, no fim, fui bloqueado em vários sites. Quando parei de usar a sessão do navegador dessa forma, os bloqueios desapareceram com o tempo, mas essa abordagem não é uma solução mágica e você também pode perder seu próprio acesso

    • A premissa para esse tipo de coisa costuma ser “ao usar proxies de alta qualidade”
      Além disso, esta extensão parece bastante perceptível, então acho que a detecção de bots da Cloudflare não vai demorar para identificá-la, assim como faz com Playwright e similares
    • Esta extensão ativa a depuração no navegador, e aparece um banner dizendo que ele está sendo automatizado. Isso pode ser detectado via JavaScript
      Por isso existe este projeto: https://github.com/Kaliiiiiiiiii-Vinyzu/patchright. Ele oculta a parte de depuração do JavaScript
    • Também pode depender da velocidade com que os elementos do site são clicados
    • Fico curioso sobre o que permitiria detectar isso rapidamente. Por exemplo, dá para rastrear os movimentos do mouse e calcular se estão limpos demais; adicionar ruído mais humano ao movimento do mouse talvez ajude a contornar melhor
      Fazer ações demais rápido demais também é um problema, mas o intervalo entre as ações também pode ser um sinal. Mesmo que cada clique individual não seja rápido, atrasos excessivamente constantes viram outro sinal não humano
    • A própria razão para existirem CAPTCHAs também é que não dá para confiar que as pessoas vão usar ferramentas de automação de forma adequada
      “Evitar detecção de bots e CAPTCHA” significa, no fim, que esses mecanismos existem por causa de pessoas como você. Se você realmente precisa de acesso, deve pedir uma API, que pode ou não ter custo. Você pode recebê-la ou o dono do site pode recusar; nesse caso, deve aceitar que sua ação ou caso de uso não é desejado

  • Parece que dormi por um dia e agora vejo MCP em todo lugar. Não sei o que é MCP e, a esta altura, tenho até medo de perguntar

    • MCP é uma forma de oferecer uma biblioteca de métodos/API que modelos de LLM podem “chamar”
      Você informa ao modelo o nome do método, parâmetros, tipo de saída e finalidade, então a LLM pede ao servidor MCP para chamar uma função, verifica o resultado e, se necessário, chama a próxima função. Hoje é difícil pedir ao ChatGPT “abra o Google Maps com a minha conta, pesquise lojas de bicicletas perto de Nova York e pegue os telefones”, mas, com um Browser MCP, o ChatGPT pode enviar instruções ao navegador como “abrir Google Maps”, “mostrar captura de tela” e “clicar naquele local”
    • O pior é que isso abre uma caixa de Pandora de vulnerabilidades potenciais: https://elenacross7.medium.com/%EF%B8%8F-the-s-in-mcp-stands...
    • MCP é um padrão para conectar ferramentas úteis a modelos de IA e permitir que o modelo as use
      Para o público geral, o conceito é meio invertido e pouco intuitivo, mas, para desenvolvedores, parece com as ferramentas que eles já usam, então eles não percebem tanto a confusão
    • MCP está sendo amplamente adotado, mas não é um movimento de base. Parece mais que empresas de IA já estabelecidas entraram rapidamente para conquistar reconhecimento entre desenvolvedores e participação de mercado antes que surgisse um consenso
    • É uma chamada de procedimento remoto (RPC) específica para LLMs. E também é a nova moda do dia que está varrendo o mundo

  • Seria ótimo poder dizer ao navegador, em um site de compras: “dê uma olhada em todos os aparadores desta lista e filtre só os que têm mais de 155 cm e menos de 100 cm. Priorize os de madeira escura e com espaço para colocar discos de vinil de 31,43 cm de altura”
    Se der para extrair os detalhes da página, parece que seria muito útil; fico curioso se já existe algum navegador capaz de fazer algo assim

    • Estou criando algo parecido chamado MatterRank, que atualmente funciona na busca na web
      Por exemplo, algo como “priorize resultados que tratem de X e tenham uma inclinação Y, e rebaixe resultados que estejam tentando vender alguma coisa”. Dá para testar em https://matterrank.ai
      Também gostaria de ouvir mais sobre os casos de uso que você imagina. Fico curioso se seria uma extensão de navegador que funciona no site que você já está vendo, um serviço agregador de compras que oferece esse recurso, ou algo totalmente diferente
    • Dá para fazer com browser-use: https://browser-use.com/
    • Ao decorar a casa, definitivamente tenho interesse em encontrar itens que correspondam a prompts muito específicos

  • Muito bem feito. Testei no Claude Desktop e funcionou de forma fluida, bem menos incômodo que o Playwright. Está indo na direção certa
    Não sei se vocês já fizeram isso, mas seria bom detectar CAPTCHA na página, pausar a automação e avisar ao usuário que é necessária uma intervenção. O Playwright tenta seguir em frente mesmo com CAPTCHA

  • Uma tarefa de buscar informações na web e colocar os resultados em uma planilha do Google Sheets funcionou quase perfeitamente na primeira vez, mas falhou completamente nas 8 a 10 tentativas seguintes
    Fico me perguntando se há um problema de latência entre o que acontece no navegador e o app MCP — neste caso, o Claude Desktop. Na primeira tentativa, cliquei rápido o bastante na permissão “Allow for this chat”; nas seguintes, quando eu clicava na permissão, parecia que o LLM já relatava “Parece que houve um problema com o clique. Vou tentar de novo com outra referência”
    Ações como clicar no título da planilha do Google e digitar o nome, que funcionaram perfeitamente da primeira vez, falharam 100% nas tentativas posteriores. O mesmo vale para identificar células como A1 e B1 e preencher linhas. A experiência em si é muito fluida, e a configuração e a execução são excelentes, mas, por causa da latência e da velocidade necessária para clicar no botão de autorização, parece praticamente difícil de usar no Claude Desktop

    • Uma UI rica como a do Google Sheets parece um mau caso de uso para um servidor MCP de automação de navegador genérico
      Seria bom ter esse servidor MCP, mas também fornecer ferramentas específicas que permitam ao LLM ler e escrever células do Google Sheets. Em vez de interagir genericamente com uma página web, dar uma abstração mais específica faria esse tipo de tarefa funcionar muito melhor
    • Trabalhei em um MCP para Google Sheets e, usando a busca integrada do Claude para scraping de dados, funcionou bastante bem
      Exemplo: https://x.com/xing101/status/1903391600040083488
      Configuração: https://github.com/xing5/mcp-google-sheets
    • O que você vivenciou é o que normalmente chamamos de sorte
      É o mesmo motivo pelo qual as pessoas vivem achando que uma nova versão do ChatGPT foi nerfada. Na prática, você teve sorte no começo e criou expectativas irreais com base naquele primeiro resultado positivo. Não é um bug nem uma falha; é mais como tirar um bom número nos dados na primeira rodada, apesar de a probabilidade estatística de executar o comportamento desejado ser baixa
    • No meu caso, no Google Sheets, ele não consegue clicar em lugar nenhum. Recebo o seguinte erro
      --Error: Cannot access a chrome-extension:// URL of different extension

  • Estou muito animado com isso para tarefas manuais como reembolso de despesas. Todo mês preciso entrar nos sites dos prestadores de serviço, fazer login, encontrar e baixar os extratos, criar um documento do Google com os detalhes preenchidos, baixar, redigir um novo e-mail e anexar todos os arquivos
    Às vezes, para conferir se o anexo está correto, não dá para ver direto no e-mail, então tenho que baixar de novo. A automação em si já é possível, e um bom app de controle de despesas eliminaria metade desse trabalho, mas ferramentas de IA têm potencial para reduzir bastante o fardo das pequenas descrições detalhadas. Esse tipo de workflow é especialmente importante porque pequenas mudanças acontecem com frequência

  • Talvez seja óbvio para a maioria aqui, mas para executar o servidor MCP é preciso ter o Node.js instalado. Esse detalhe importante não está nas instruções de configuração

  • Criei algo parecido, mas para controlar sintetizadores de hardware e permitir fazer sound design sem mexer nos knobs físicos: https://github.com/zerubeus/elektron-mcp

    • Boa ideia
      Dá para imaginar controlar plugins remotamente e fazer um LLM realizar masterização e ajuste de timbre com ferramentas existentes. A UI complexa e excessivamente gráfica dos VSTs pode ser uma barreira de desempenho, mas daria para conectá-la a uma interface de mapeamento MIDI com rótulos para controlar knobs e níveis

  • Seria bom poder navegar pela página usando a árvore de acessibilidade das ferramentas de desenvolvedor do Chrome, em vez de depender de screenshots: https://developer.chrome.com/blog/full-accessibility-tree

    • Na verdade, você entendeu ao contrário. Atualmente não há screenshots, apenas a árvore de acessibilidade