Hubcap Bridge: Comunicação Bidirecional Persistente entre CLI e JavaScript do Navegador via CDP

O que o Hubcap Bridge faz

O Hubcap Bridge estabelece um canal de mensagens bidirecional persistente entre um processo local e JavaScript em execução em uma página do navegador usando o Chrome DevTools Protocol. Isso resolve a lacuna onde aplicativos web não possuem APIs públicas ou desenvolvedores não têm acesso a elas, mas os aplicativos têm APIs JavaScript ricas no lado do cliente que alimentam sua interface.

Recursos e uso principais

A sintaxe do comando bridge é:

hubcap bridge --target "$TAB" ' for await (const msg of messages) { const result = await window.appAPI.query(msg.sql); send({rows: result}); } '

A comunicação ocorre via stdin/stdout transportando formato LDJSON. Heartbeats detectam desconexão, e múltiplas bridges podem ser executadas na mesma aba.

Aplicações práticas

Isso permite construir habilidades do Claude Code que incluem um servidor local mantido em sincronia com uma página web através de suas APIs internas. O servidor usa bridge para enviar e receber dados através da camada JavaScript da página, com o Claude se comunicando com o servidor. Essa abordagem evita scraping de HTML e não requer esperar que alguém construa um servidor MCP.

Como o código injetado via CDP é executado no próprio contexto da página, não há problemas de CORS, CSP ou conteúdo misto para contornar. O autor observa: "Se você pode chamá-lo do console do navegador, pode canalizá-lo através do bridge."

Notas de lançamento adicionais

Também nesta versão: eval agora suporta await de nível superior.

Consideração importante

A fonte inclui esta nota: "(Certifique-se de estar dentro dos termos de serviço de qualquer coisa com a qual você está integrando.)"

Recursos

• Postagem no blog: https://tomyandell.dev/blog/hubcap-bridge
• Plugin Hubcap: https://github.com/tomyan/claude-skill-hubcap
• Documentação: https://hubcap.tomyandell.dev
• Source: https://github.com/tomyan/hubcap