MCP Messenger

Como n8n para desarrolladores

Documentación

SlashMCP

License: MIT TypeScript React Vite

Espacio de trabajo de IA impulsado por MCP para inteligencia documental, orquestación multiagente y gestión dinámica de servidores MCP.

Demo en vivo: slashmcp.vercel.app | Repositorio: github.com/mcpmessenger/slashmcp

  • 🚀 Registro dinámico de servidores MCP - Gestiona e invoca servidores de Model Context Protocol desde la interfaz de chat
  • 📄 Inteligencia documental - Cargas mediante arrastrar y soltar con OCR a través de AWS Textract y análisis de visión mediante GPT‑4o
  • 📊 Datos financieros - Cotizaciones de acciones, gráficos y datos de mercados de predicción a través de servidores MCP integrados
  • 🤖 Marco multiagente - Orquesta múltiples agentes de IA con acceso estandarizado a herramientas MCP
  • 🔄 Cambio de LLM - Cambia sin problemas entre proveedores OpenAI, Anthropic y Gemini en tiempo de ejecución

Repositorio del proyecto: https://github.com/mcpmessenger/slashmcp


De un vistazo

  • Frontend: Vite + React + TypeScript + Tailwind + shadcn/ui
  • Estado y datos: TanStack Query, cliente Supabase
  • Workers / Integraciones: Supabase Edge Functions (uploads, vision-worker, textract-worker, chat, job-status)
  • Servicios en la nube: AWS S3 + Textract, OpenAI GPT‑4o, Google Gemini (respaldo), Supabase Postgres
  • Almacenamiento: Bucket S3 arn:aws:s3:::tubbyai-products-catalog
  • Gestión de entorno: .env para Vite, secretos de funciones de Supabase para claves de servicio

Primeros pasos

Requisitos previos

  • Node.js ≥ 18.18 (se recomienda usar nvm)
  • npm ≥ 9 o pnpm/bun si lo prefieres (el proyecto está actualmente bloqueado a npm)
  • CLI de Supabase (npm install -g supabase o npx supabase)
  • Credenciales de AWS con acceso a Textract y al bucket S3 mencionado
  • Clave de API de OpenAI (visión GPT‑4o)
  • Opcional: clave de Google Generative AI (para el respaldo de Gemini), claves de Whisper / Google Cloud TTS para próximas funciones

Configuración

git clone https://github.com/mcpmessenger/slashmcp.git
cd slashmcp
npm install

Crea .env.local (Vite carga automáticamente las variables VITE_*):

Configuración rápida: Copia .env.local.example a .env.local y completa tus valores.

Configuración manual: Crea .env.local con:

VITE_SUPABASE_URL=https://<your-supabase-ref>.supabase.co
VITE_SUPABASE_FUNCTIONS_URL=https://<your-supabase-ref>.supabase.co/functions/v1
VITE_SUPABASE_PUBLISHABLE_KEY=<supabase-anon-key>
VITE_ALPHA_VANTAGE_API_KEY=<alpha-vantage-key>
VITE_MCP_GATEWAY_URL=http://localhost:8989/invoke # MCP gateway proxy endpoint
VITE_SUPABASE_REDIRECT_URL=http://localhost:8080          # OAuth redirect URL (local dev)
# For production: Set VITE_SUPABASE_REDIRECT_URL to your production domain in Vercel env vars
TWELVEDATA_API_KEY=<twelve-data-key>                # optional fallback provider
ALPHAVANTAGE_CACHE_TTL_MS=300000 # optional Supabase function cache TTL (5 min)
POLYMARKET_CACHE_TTL_MS=120000   # optional cache window for Polymarket lookups

Nota: Consulta LOCAL_SETUP.md para la configuración detallada de desarrollo local, incluida la configuración de CORS de S3 para cargas de archivos.

Configura los secretos de las funciones de Supabase Edge (una vez por proyecto):

npx supabase secrets set \
  --project-ref <supabase-ref> \
  PROJECT_URL=https://<your-supabase-ref>.supabase.co \
  SERVICE_ROLE_KEY=<supabase-service-role-key> \
  OPENAI_API_KEY=<openai-key> \
  GEMINI_API_KEY=<optional-gemini-key> \
  GEMINI_IMAGE_MODEL=gemini-2.5-flash-image \
  ALPHAVANTAGE_API_KEY=<alpha-vantage-key> \
  TWELVEDATA_API_KEY=<twelve-data-key> \
  ALPHAVANTAGE_CACHE_TTL_MS=300000 \
  POLYMARKET_CACHE_TTL_MS=120000 \
  GOOGLE_CLIENT_ID=<google-oauth-client-id> \
  GOOGLE_CLIENT_SECRET=<google-oauth-client-secret> \
  AWS_REGION=<aws-region> \
  AWS_ACCESS_KEY_ID=<aws-access-key> \
  AWS_SECRET_ACCESS_KEY=<aws-secret> \
  AWS_SESSION_TOKEN=<optional-session-token> \
  AWS_S3_BUCKET=tubbyai-products-catalog

Sirve la aplicación de desarrollo junto con las funciones de Supabase:

npm run dev             # Vite dev server
npx supabase functions serve --env-file supabase/.env # optional local function emulation

Características principales y flujo

  1. Carga y seguimiento de trabajos

    • src/components/ui/chat-input.tsx impulsa las acciones del menú (Subir archivos, Análisis de documentos, OCR de imágenes, Asistente de voz).
    • El frontend llama a supabase/functions/uploads para crear una fila en processing_jobs y recibir una URL PUT prefirmada de S3.
    • El progreso de la carga se muestra en la interfaz; las transiciones de estado de processing_jobs se consultan mediante la función job-status.
  2. Análisis de visión

    • vision-worker obtiene el recurso subido desde S3 mediante GET prefirmado, lo envía a GPT‑4o (con un prompt estructurado en JSON) y persiste los resultados en analysis_results.
    • Existen ayudas de respaldo de Gemini y se pueden reactivar si se desea.
  3. OCR de Textract

    • textract-worker utiliza AWS Textract (síncrono para imágenes, asíncrono para PDFs) y almacena el texto OCR y la respuesta cruda.
    • El frontend maneja los errores de Textract con elegancia (por ejemplo, "No se detectó texto") y recurre al resumen de visión.
  4. Esquema de Supabase

    • La migración supabase/migrations/20250108120000_create_processing_jobs.sql aprovisiona:
      • processing_jobs: metadatos para cada carga
      • analysis_results: salidas de OCR y visión (asegúrate de ejecutar la migración en el proyecto de Supabase)
      • El índice único analysis_results_job_id_unique es necesario para los upserts de onConflict: "job_id"
  5. Andamiaje futuro

    • Existen hooks y opciones de menú para los pipelines de Whisper ASR y Google TTS.
    • Los prompts en lenguaje natural (o /imagine <prompt>) pasan por supabase/functions/image-generator, que ahora apunta al modelo Gemini 2.5 Flash Image ("Nano Banana") para la generación.
  6. Cotizaciones y gráficos de acciones

    • Escribe /quote AAPL, /stock MSFT 3m o /ticker NVDA 1y en la entrada de chat para obtener datos de Alpha Vantage.
    • El asistente muestra una tarjeta de precio con gráfico de tendencia diaria, métricas de cambio y estadísticas clave.
    • El soporte de endpoints MCP está preparado para que /alphavantage-mcp get_stock_chart symbol=NVDA use el mismo pipeline de renderizado (función de Supabase Edge mcp).
    • Las cotizaciones se almacenan en caché durante 5 minutos y automáticamente recurren a Twelve Data (si TWELVEDATA_API_KEY está configurado) cuando Alpha Vantage alcanza límites premium o de tasa.
  7. Mercados de predicción

    • Usa /polymarket-mcp get_market_price market_id=us_election_2024 para obtener probabilidades en vivo de Polymarket mediante la función mcp de Supabase.
    • Las respuestas incluyen mejor oferta/demanda, probabilidad implícita, liquidez y se almacenan en caché durante 2 minutos (configurable mediante POLYMARKET_CACHE_TTL_MS).
  8. Cambio de proveedor

    • Usa /model openai, /model anthropic o /model gemini para cambiar el LLM subyacente en tiempo de ejecución (por defecto OpenAI).
    • Las variables de entorno y los secretos de funciones de Supabase (OPENAI_API_KEY, ANTHROPIC_API_KEY, GEMINI_API_KEY) deben configurarse para cada proveedor que planees usar.
  9. Comandos de barra MCP y registro

    • Autentícate mediante el botón de inicio de sesión en el encabezado (Google OAuth) o el comando de chat de respaldo /slashmcp login email=user@example.com password=secret.
    • Una vez iniciada la sesión, gestiona servidores con /slashmcp list, /slashmcp add <name> <https://gateway> (más los parámetros opcionales auth=/key=) y /slashmcp remove <name|serverId>.
    • Los atajos de proveedor como /gemini o /playwright se asignan a ajustes predefinidos y solicitan los secretos necesarios.
    • Los detectores de lenguaje natural enrutan preguntas comunes sobre acciones y Polymarket al servidor MCP adecuado automáticamente cuando está disponible.
    • Los registros dinámicos se almacenan por usuario en Supabase (tabla mcp_servers) y se proxean a través de nuevas funciones de Edge (mcp-register, mcp-get-registry, mcp-remove, mcp-proxy).

Scripts disponibles

ComandoDescripción
npm run devIniciar servidor de desarrollo de Vite
npm run buildCompilación de producción
npm run build:devCompilación en modo desarrollo (útil para staging)
npm run previewVista previa de los activos compilados
npm run lintESLint en todo el proyecto

Las funciones de Supabase Edge se pueden desplegar con:

npx supabase functions deploy <function-name> --project-ref <ref>

Aspectos destacados del directorio

  • src/components — Página de aterrizaje y componentes de interfaz (Hero, Features, Architecture, CTA).
  • src/components/ui — Envoltorios de shadcn/ui.
  • src/lib/api.ts — Cliente API del frontend (cargas, Textract, visión).
  • supabase/functions/* — Funciones de Edge para cargas, estado de trabajos, Textract, visión GPT y chat.
  • supabase/functions/_shared/database.types.ts — Tipos generados de Supabase compartidos entre funciones.
  • supabase/migrations — Esquema de base de datos para seguimiento de trabajos y resultados de análisis.

Notas de despliegue

  • Asegúrate de que las migraciones de Supabase se hayan aplicado (columnas de visión analysis_results e índice único).
  • Configura CORS de S3 para permitir tus orígenes y métodos de desarrollo/producción (GET,PUT,POST,HEAD).
  • Al desplegar en nuevos entornos, rota y completa los secretos de funciones de Supabase antes de invocar los workers de carga/visión.
  • La síntesis de voz (Whisper, Google TTS) aún requiere secretos adicionales; la generación de imágenes de Gemini espera GEMINI_API_KEY (y opcionalmente GEMINI_IMAGE_MODEL si anulas el gemini-2.5-flash-image predeterminado). Los recursos de favicon y logo ahora viven en public/Untitled design.svg y public/Untitled design (12/14).png.
  • La puerta de enlace MCP debe exponer un único endpoint /invoke compatible con el payload JSON emitido por src/lib/mcp/client.ts.

Seguridad y mantenimiento

  • Ejecuta npm audit (o npm audit --omit=dev) regularmente; consulta la sección "Security Scan" a continuación.
  • Restringe el uso de la clave de rol de servicio de Supabase solo a contextos de servidor; nunca la expongas al navegador.
  • Usa roles de IAM de AWS con acceso de privilegio mínimo a Textract y al bucket S3 específico.
  • Considera configurar políticas de Row Level Security de Supabase si se requiere soporte multiinquilino.

Hoja de ruta / Pendientes

  • Conectar el pipeline de transcripción de Whisper con el worker de Supabase Edge y actualizaciones de estado de cola.
  • Integrar Google Cloud Text-to-Speech para respuestas de voz.
  • Rehabilitar el respaldo de Gemini con selección de proveedor configurable y seguimiento de costos.
  • Agregar pruebas automatizadas (Cypress/Playwright) para el flujo de carga y análisis.
  • Reforzar RLS de Supabase y agregar autenticación una vez que se introduzcan cuentas de usuario.

Contribuciones

¡Las contribuciones son bienvenidas! No dudes en enviar un Pull Request. Para cambios importantes, abre primero un issue para discutir lo que te gustaría modificar.

  1. Haz un fork del repositorio
  2. Crea tu rama de características (git checkout -b feature/AmazingFeature)
  3. Haz commit de tus cambios (git commit -m 'Add some AmazingFeature')
  4. Sube la rama (git push origin feature/AmazingFeature)
  5. Abre un Pull Request

Licencia

Este proyecto está licenciado bajo la Licencia MIT; consulta el archivo LICENSE para más detalles.


Hecho con ❤️ por el equipo de SlashMCP