Condividi tramite


Compatibilità delle app MCP con AG-UI

Annotazioni

La documentazione sulla compatibilità delle app MCP per l'integrazione .NET AG-UI sarà presto disponibile.

Gli endpoint Python AG-UI di Agent Framework sono compatibili con la funzionalità MCP Apps dell'ecosistema di AG-UI. Le app MCP consentono alle applicazioni front-end di incorporare risorse e strumenti basati su MCP insieme all'agente AG-UI, senza alcuna modifica sul lato Python.

Architettura

Il supporto delle app MCP è fornito da TypeScript MCPAppsMiddleware di CopilotKit (@ag-ui/mcp-apps-middleware), che si trova tra il front-end e il back-end di Agent Framework:

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

Il livello middleware gestisce l'individuazione degli strumenti MCP, le richieste di risorse proxy iframe e ui/resourceUri la risoluzione. L'endpoint Python AG-UI riceve richieste di AG-UI standard e non è a conoscenza del livello app MCP.

Non sono necessarie modifiche sul lato del Python

L'integrazione delle app MCP è interamente gestita dal middleware TypeScript. La configurazione esistente add_agent_framework_fastapi_endpoint() funziona così com'è.

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, "/")

Questo approccio è coerente con il funzionamento delle app MCP con tutte le altre integrazioni AG-UI Python: il livello MCP Apps è sempre nel middleware TypeScript, non nel back-end Python.

Configurazione del middleware

Per utilizzare le app MCP con il back-end di Agent Framework, configura un runtime CopilotKit o un proxy Node.js che includa MCPAppsMiddleware e indirizzi verso l'endpoint 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
  ],
});

Per istruzioni complete sulla configurazione, vedere la documentazione di CopilotKit MCP Apps e la documentazione diAG-UI MCP Apps.

Che cos'è non incluso nell'ambito

Di seguito sono esplicitamente non parte dell'integrazione Python AG-UI:

  • No Python MCPAppsMiddleware: il middleware delle app MCP viene eseguito solo nel livello TypeScript.
  • Nessuna gestione FastAPI delle richieste MCP tramite proxy iframe: il proxy delle risorse viene gestito dal middleware Node.js.
  • Nessuna scoperta lato Python: la risoluzione dell'URI delle risorse è un aspetto del middleware.

Se l'applicazione non richiede il livello middleware di MCP Apps, l'endpoint AG-UI dell'Agent Framework funziona direttamente con qualsiasi client compatibile con AG-UI.

Passaggi successivi

Risorse aggiuntive