Servidor MCP · Edita tu tienda con IA

MCP (Model Context Protocol) es el estándar abierto con el que un asistente IA se conecta a herramientas externas. El servidor MCP de Reciba expone tu tienda como un conjunto de herramientas que el asistente puede llamar: leer páginas, agregar y editar bloques, gestionar productos y configurar el menú.

En la práctica: el asistente hace lo mismo que harías tú en el builder visual, pero por conversación. Todo lo que escribe queda guardado en la tienda y visible en el editor.

Esta es la única URL que necesitas:

http://app.y7qpdqpplczvfk4rnkgpnvgw.157.230.146.182.sslip.io/api/mcp

Claude Code — en la terminal:

claude mcp add --transport http reciba http://app.y7qpdqpplczvfk4rnkgpnvgw.157.230.146.182.sslip.io/api/mcp

Se abre el navegador para iniciar sesión en Reciba y autorizar. Para quitarlo: claude mcp remove reciba.

Claude.ai / Cowork — Ajustes → Conectores → “Añadir conector personalizado” → pega la URL de arriba e inicia sesión.

Cursor — en ~/.cursor/mcp.json:

{
  "mcpServers": {
    "reciba": { "url": "http://app.y7qpdqpplczvfk4rnkgpnvgw.157.230.146.182.sslip.io/api/mcp" }
  }
}

Otros clientes — VS Code, Windsurf, Zed y cualquier cliente compatible con MCP over HTTP + OAuth usan la misma URL con su propia sintaxis de configuración. No hace falta declarar nada más: el servidor publica su metadata OAuth en /.well-known/oauth-authorization-server y /.well-known/oauth-protected-resource, y el cliente se registra solo.

Al conectar por primera vez verás una pantalla de autorización con la lista de tus tiendas y un check por cada una. Solo las que marques quedan visibles para esa conexión: el resto no aparece siquiera en list_projects.

• Por usuario. El token OAuth te identifica a ti. El asistente solo alcanza tiendas donde eres miembro.
• Por tienda. Lo que marcaste en la pantalla de autorización. Para cambiarlo, vuelve a conectar el cliente y elige otra selección.
• Por área. Cada llamada se revalida contra tu rol: las herramientas de catálogo piden el área productos y las demás el área páginas. Si te quitan el permiso, el asistente deja de poder al instante.
• Sin tokens estáticos. No hay nada que copiar, filtrar ni rotar. Para cortar el acceso, elimina el conector en tu cliente MCP.

1. 1

   Elige la tienda. El asistente llama a list_projects y de ahí sale el projectId de cada una. Todas las demás herramientas lo reciben, y también aceptan subdomain (automotora, automotora.reciba.me o tu dominio propio). Si tienes varias tiendas parecidas, el servidor le pide al asistente que te pregunte cuál en vez de elegir por parecido de nombre.

2. 2

   Mira qué hay. manage_pages con action: "list" para las páginas, manage_products con list para el catálogo.

3. 3

   Lee antes de escribir. manage_page_blocks con get devuelve los bloques, las filas y el updatedAt de la página.

4. 4

   Edita. Agrega una franja diseñada (add_strip), un bloque suelto (add) o cambia textos y estilos (update), reenviando ese updatedAt como expectedUpdatedAt.

5. 5

   Revisa en el builder. Abre la tienda en el editor: lo que hizo el asistente está ahí, editable a mano como cualquier otro bloque.

Cómo pedirlo (ejemplos que funcionan bien)

Conéctate a mi tienda "Café Aurora" y muéstrame qué páginas tiene.

En la portada, agrega debajo del hero una franja con texto e imagen
que explique el tostado propio. Antes de guardar, muéstrame cómo queda.

Crea una página "Contacto" con la plantilla corporate y agrégala al menú.

Sube un 10% el precio de todos los productos con el tag "especialidad".

Entender esto es la diferencia entre un asistente que compone bien y uno que deja bloques flotando. Una página es una pila vertical de filas, y hay dos tipos:

manage_page_blocks → get devuelve esa estructura en rows, con el índice de cada fila, su tipo, sus elementIds, el bandHeightPx de las franjas y el contentFloorPx (el mínimo que necesita el contenido).

Coordenadas

Las posiciones de los bloques (x, y, w, h) no son píxeles del navegador:

En el sitio publicado la franja se escala completa (texto incluido) hasta el ancho real, así que el diseño se mantiene proporcional: no hay que recalcular nada por viewport. get devuelve el espacio exacto en coordinateSystem.

Reglas prácticas

• Para una sección nueva bien compuesta, usa add_strip con una plantilla de list_templates antes que colocar piezas una por una.
• Para separar dos secciones, usa add_spacer. No existen bloques “espaciador” ni márgenes falsos: el aire es una franja vacía.
• Un bloque de ancho completo va solo en su fila. intoRowIndex solo funciona sobre franjas libres.
• Los bloques disponibles dependen del tipo de página (portada, header, footer, catálogo): consulta list_block_types con el pageType correcto. Los que requieren un plugin no instalado se rechazan al agregarlos, con un error que lo dice.

Siete herramientas, agrupadas por lo que hacen. Las que empiezan con manage_ o configure_ reciben un parámetro action que elige la operación. Los parámetros marcados con * son obligatorios.

El catálogo se maneja entero con manage_products. Tres detalles que evitan la mayoría de los errores:

• Escrituras concurrentes. Envía en expectedUpdatedAt el updatedAt que devolvió get. Si la página cambió mientras tanto (por ejemplo, tú editando en el builder), el cambio se rechaza en vez de pisar tu trabajo.
• Ensayo sin guardar. dryRun: true devuelve cómo quedaría el layout sin escribir nada. Sirve para verificar una posición antes de aplicarla.
• Validación como el builder. El servidor rechaza bloques que esa página o esa tienda no admiten, y diseños que el editor ya no ofrece: nada queda en un estado que no puedas reproducir a mano.
• Secretos censurados. Cualquier campo que parezca clave, token, contraseña o credencial se devuelve como [REDACTED]: el modelo nunca los ve.
• Imágenes externas. Toda URL de imagen que llegue desde el asistente se re-sube al almacenamiento de la tienda.
• Límites. Máximo 200 bloques por página y 512 KB por petición.
• Alturas recalculadas. El servidor recalcula las alturas del lienzo desde los bloques y las filas; lo que mande el agente en canvasHeights se ignora.

Si estás construyendo tu propio cliente: el servidor habla JSON-RPC 2.0 sobre HTTP POST, con protocolo MCP 2024-11-05. El access token OAuth va como Authorization: Bearer …. Métodos soportados: initialize, ping, tools/list, tools/call y las notificaciones notifications/*.

POST http://app.y7qpdqpplczvfk4rnkgpnvgw.157.230.146.182.sslip.io/api/mcp
Authorization: Bearer <access_token>
Content-Type: application/json

{
  "jsonrpc": "2.0",
  "id": 1,
  "method": "tools/call",
  "params": {
    "name": "manage_page_blocks",
    "arguments": {
      "action": "get",
      "projectId": "…",
      "pageId": "…"
    }
  }
}

Los resultados vienen como texto JSON dentro de result.content[0].text. Los errores de herramienta llegan con isError: true y un { "error": "…" } legible, no como error JSON-RPC.

Si tu asistente necesita contexto para operar la tienda, pásale este archivo: trae la conexión, el flujo recomendado y las herramientas en formato listo para pegar en un prompt de sistema.

y7qpdqpplczvfk4rnkgpnvgw.157.230.146.182.sslip.io/agente.md