EdgeOne Pages MCP

Una implementación de servidor y cliente MCP para EdgeOne Pages Functions, que admite solicitudes con formato OpenAI.

Documentación

EdgeOne Pages: Implementación de Cliente y Servidor MCP con Funciones

Resumen del Proyecto

Este proyecto muestra una aplicación de chat inteligente construida con la tecnología EdgeOne Pages Functions. Interactúa con funciones de backend a través de una interfaz web, implementando un flujo de trabajo completo del Protocolo de Contexto de Modelo (MCP).

La arquitectura del sistema consta de los siguientes componentes principales:

  • Servidor MCP Streamable HTTP (functions/mcp-server/index.ts)
  • Cliente MCP (functions/mcp-client/index.ts)
  • API de Backend (functions/v1/chat/completions/index.ts) como HOST de MCP, responsable de coordinar todo el flujo de trabajo de MCP

A través de esta arquitectura, los usuarios pueden acceder a potentes capacidades de herramientas MCP en el navegador, permitiendo interacciones inteligentes como "generar páginas web en línea con un solo mensaje."

Características Principales

  • Interfaz de Chat Interactiva: Interfaz web moderna y receptiva construida con Next.js y React
  • Funciones Edge de Alto Rendimiento: Lógica de negocio crítica desplegada en EdgeOne Pages Functions altamente escalables
  • Implementación Completa de MCP: Implementación del Protocolo de Contexto de Modelo basada en las últimas especificaciones, que proporciona potentes capacidades de gestión de contexto y enrutamiento de solicitudes
  • Compatible con Formato OpenAI: La API de backend es totalmente compatible con el manejo de solicitudes y respuestas en formato OpenAI

Servidor MCP Streamable HTTP

Configure servicios MCP remotos en aplicaciones que admitan Streamable HTTP MCP Server.

{
  "mcpServers": {
    "edgeone-pages-mcp-server": {
      "url": "https://mcp-on-edge.edgeone.site/mcp-server"
    }
  }
}

Despliegue

Deploy with EdgeOne Pages

Más Plantillas: EdgeOne Pages

Desarrollo Local

Configuración del Entorno

Primero, instale las dependencias e inicie el servidor de desarrollo:

# Install dependencies
npm install
# Or use other package managers
# yarn install / pnpm install / bun install

# Start development server
npm run dev
# Or use other package managers
# yarn dev / pnpm dev / bun dev

Configure las variables de entorno: Copie el archivo .env.example y renómbrelo a .env, luego complete la información de configuración de su interfaz de servicio de IA.

Después de iniciar, visite http://localhost:3000 en su navegador para ver la aplicación.

Estructura del Proyecto

  • Interfaz Frontend: app/page.tsx contiene la lógica principal de la página y los componentes de UI
  • Funciones de Backend: Todas las funciones edge están en el directorio functions
    • API de Chat: functions/v1/chat/completions
    • Servidor MCP: functions/mcp-server
    • Cliente MCP: functions/mcp-client

Documentación Técnica

Aprenda más sobre tecnologías relacionadas: