WebMCP: habilita soporte MCP en sitios web para que los asistentes de IA interactúen con aplicaciones web 196

小编 · 2025-07-18

WebMCP es una implementación de MCP basada en navegador que permite a los asistentes de IA interactuar con aplicaciones web mediante herramientas estandarizadas. Integra un servidor MCP en la página —sin claves API ni OAuth—, se sincroniza en tiempo real a través del navegador, se integra con el estado de la app y habilita flujos entre múltiples apps. Resuelve la limitación de las soluciones MCP actuales que sortean el navegador, aprovechando su modelo de autenticación y seguridad.

WebMCP: habilita soporte MCP en sitios web para que los asistentes de IA interactúen con aplicaciones web

WebMCP es una solución de implementación de MCP basada en el navegador que permite a los asistentes de ia interactuar con aplicaciones Web mediante herramientas estandarizadas. Integra el servidor MCP en la página web, se integra directamente con la aplicación Web, sin necesidad de claves API ni configuración de OAuth, se sincroniza en tiempo real mediante acceso directo desde el navegador, se integra directamente con el estado de la aplicación Web, admite flujos de trabajo entre aplicaciones y permite que el asistente de IA complete tareas automáticamente entre múltiples aplicaciones web diferentes, resolviendo el problema de las soluciones MCP existentes que evitan el navegador, al mismo tiempo que aprovecha la autenticación y el modelo de seguridad del navegador.

WebMCP: permite que los sitios web sean compatibles con MCP, permitiendo que los asistentes de IA interactúen con aplicaciones Web

Características principales:

✅ Autenticación mediante sesiones y cookies del navegador.

✅ Operaciones a través de la interfaz JSON-RPC, evitando la manipulación del DOM.

✅ Sincronización en tiempo real con el estado de la aplicación Web.

✅ Compatible con cualquier framework de JavaScript o JavaScript puro.

✅ El código de implementación suele tener menos de 50 líneas.

✅ Cumple con la política de mismo origen y los permisos del navegador.

Características del proyecto:

✅ Aprovecha el mecanismo de autenticación del navegador, sin necesidad de configuraciones complejas ni gestión de claves API.

✅ Los asistentes de IA acceden directamente a datos estructurados, mejorando la eficiencia de la interacción.

✅ Admite flujos de trabajo entre aplicaciones, manteniendo la autenticación y el control de acceso independientes de cada aplicación.

✅ Se ejecuta dentro del modelo de seguridad del navegador, garantizando la seguridad de los datos.

Arquitectura del proyecto:

Tab MCP Servers: se ejecuta dentro de la página web e interactúa con la API de autenticación.
MCP-B Extension: conecta los servidores de pestañas con el asistente de IA, agrega herramientas y enruta las solicitudes.
Transport Layers: permite la comunicación segura mediante la API de mensajería del navegador.

Stack tecnológico:

Frontend: React + TanStack Query + Shadcn UI.
Backend: Cloudflare Workers + Hono.js + PostgreSQL + Drizzle ORM.
Sincronización de datos: sincronización en tiempo real mediante ElectricSQL.

Cómo usar WebMCP

Instrucciones de uso:

✅ Usuarios avanzados:

Instalar dependencias: pnpm install
Iniciar el servidor de desarrollo: pnpm dev
Compilar el proyecto: pnpm build

✅ Usuarios normales:

Instala la extensión del navegador desde la Chrome Web Store, no es necesario configurar claves API, el asistente de IA podrá interactuar con el sitio web mediante la sesión existente.

Dirección del proyecto:https://github.com/MiguelsPizza/WebMCP

Sitio web oficial:https://mcp-b.ai/