Partilhar via


Compatibilidade de aplicações MCP com AG-UI

Observação

A documentação de compatibilidade MCP Apps para a integração .NET AG-UI será disponibilizada em breve.

Os endpoints do Agent Framework Python AG-UI são compatíveis com a funcionalidade MCP Apps do ecossistema AG-UI. O MCP Apps permite que aplicações frontend integrem ferramentas e recursos baseados em MCP juntamente com o seu agente AG-UI — sem necessidade de alterações do lado Python.

Arquitetura

O suporte para MCP Apps é fornecido pelo TypeScript MCPAppsMiddleware (), do CopilotKit (@ag-ui/mcp-apps-middleware), que se situa entre o frontend e o backend do seu Agent Framework:

┌─────────────────────────┐
│  Frontend               │
│  (CopilotKit / AG-UI)   │
└────────┬────────────────┘
         │
         ▼
┌─────────────────────────┐
│  CopilotKit Runtime /   │
│  Node.js Proxy          │
│  + MCPAppsMiddleware    │
└────────┬────────────────┘
         │ AG-UI protocol
         ▼
┌─────────────────────────┐
│  Agent Framework        │
│  FastAPI AG-UI Endpoint │
└─────────────────────────┘

A camada middleware trata da descoberta de ferramentas MCP, pedidos de recursos com proxy iframe e ui/resourceUri resolução. O seu endpoint Python AG-UI recebe pedidos de AG-UI padrão e desconhece a camada MCP Apps.

Não são necessárias alterações no lado Python

A integração do MCP Apps é totalmente gerida pelo middleware TypeScript. A sua configuração atual add_agent_framework_fastapi_endpoint() funciona como está:

from agent_framework import Agent
from agent_framework.ag_ui import add_agent_framework_fastapi_endpoint
from fastapi import FastAPI

app = FastAPI()
agent = Agent(name="my-agent", instructions="...", client=chat_client)

# This endpoint is MCP Apps-compatible with no additional configuration
add_agent_framework_fastapi_endpoint(app, agent, "/")

Esta abordagem é consistente com o funcionamento das MCP Apps com todas as outras integrações AG-UI Python — a camada MCP Apps está sempre no middleware TypeScript, não no backend Python.

Configuração do Middleware

Para usar as Apps MCP com o backend do seu Agent Framework, configure um Runtime do CopilotKit ou um proxy Node.js que inclua MCPAppsMiddleware e aponte para o seu endpoint em Python:

// Example Node.js proxy configuration (TypeScript)
import { MCPAppsMiddleware } from "@ag-ui/mcp-apps-middleware";

const middleware = new MCPAppsMiddleware({
  agents: [
    {
      name: "my-agent",
      url: "http://localhost:8888/",  // Your MAF AG-UI endpoint
    },
  ],
  mcpApps: [
    // MCP app configurations
  ],
});

Para instruções completas de configuração, consulte a documentação do CopilotKit MCP Apps e a documentação doAG-UI MCP Apps.

O que não está no âmbito

Os seguintes são explicitamente não fazem parte da integração Python AG-UI:

  • No Python MCPAppsMiddleware: O middleware MCP Apps corre apenas na camada TypeScript.
  • O FastAPI não trata pedidos MCP com proxy em iframes: O proxy de recursos é gerido pelo middleware Node.js.
  • Do lado do Python não há ui/resourceUri descoberta: A resolução de URIs de recursos é uma preocupação de middleware.

Se a tua aplicação não precisar da camada middleware MCP Apps, o endpoint do teu Agent Framework AG-UI funciona diretamente com qualquer cliente compatível com AG-UI.

Passos seguintes

Recursos adicionais