WebMCP mit Django und FastAPI: KI-Agenten-Tools für Python-Web-Apps

Python-Web-Apps brauchen sehr wenig, um WebMCP zu unterstützen. Das Tool läuft als paar Zeilen JavaScript im Browser, und Ihre Django- oder FastAPI-App erledigt dahinter die eigentliche Arbeit. Ist das Thema neu für Sie? Lesen Sie zuerst, was WebMCP ist.

Ein FastAPI-Endpunkt

Die Query-Validierung stoppt ungültige Eingaben, bevor Ihr Code läuft, und ein Response Model begrenzt, was den Server verlässt:

from fastapi import APIRouter, Query
from pydantic import BaseModel

router = APIRouter()

class ProductOut(BaseModel):
    name: str
    price: float
    url: str

@router.get('/agent/products', response_model=list[ProductOut])
async def search_products(q: str = Query(min_length=1, max_length=80)):
    return await search_catalog(q, limit=5)  # your own function

Eine Django-View

from django.http import JsonResponse
from django.views.decorators.http import require_GET

from .models import Product

@require_GET
def agent_products(request):
    q = request.GET.get('q', '').strip()[:80]
    if not q:
        return JsonResponse({'error': 'missing_query'}, status=400)
    items = Product.objects.filter(published=True, name__icontains=q)[:5]
    return JsonResponse(list(items.values('name', 'price', 'slug')), safe=False)

Ergänzen Sie auch ein Rate Limit, zum Beispiel am Proxy oder mit den Throttling-Tools Ihres Frameworks.

Das Browser-Skript

Laden Sie es aus Ihrem Basis-Template oder Frontend:

const mc = document.modelContext || navigator.modelContext;
if (mc && mc.registerTool) {
  mc.registerTool({
    name: 'search_products',
    description: 'Search published products. Returns name, price and link.',
    inputSchema: {
      type: 'object',
      properties: { q: { type: 'string', description: 'Keywords' } },
      required: ['q'],
    },
    annotations: { readOnlyHint: true },
    execute: async ({ q }) => {
      const res = await fetch('/agent/products?q=' + encodeURIComponent(q));
      return await res.text();
    },
  });
}

Sitzungen, CSRF und Berechtigungen

Tools laufen in der Seite. Same-Origin-Anfragen senden deshalb die Cookies des Besuchers mit, und login_required oder Ihre FastAPI-Dependencies funktionieren wie gewohnt. Senden Sie bei POST-Tools in Django das Cookie csrftoken im Header X-CSRFToken und kennzeichnen Sie das Tool mit consequentialHint: true.

Sicherheitsregeln

• Starten Sie mit reinem Lesezugriff. Zuerst Suche und Details; kennzeichnen Sie diese mit readOnlyHint.
• Fragen Sie vor dem Handeln. Kennzeichnen Sie Warenkorb-, Buchungs- und Formularaktionen mit consequentialHint, damit der Besucher bestätigt.
• Prüfen Sie auf dem Server. Der Browser ist keine Sicherheitsgrenze. Prüfen Sie deshalb jede Eingabe und jede Berechtigung in Ihrem Backend.
• Geben Sie wenig zurück. Senden Sie nur, was ein Kunde sehen darf, niemals Admin-Daten oder Datensätze anderer Kunden.

Testen

1. Nutzen Sie ein aktuelles Chrome mit aktiviertem WebMCP, über den Origin Trial oder das Test-Flag.
2. Rufen Sie jedes Tool mit gültigen und ungültigen Eingaben auf.
3. Prüfen Sie, dass normale Besucher keine Änderung bemerken.
4. Prüfen Sie genau die Seite, auf der Ihre Tools liegen, mit dem kostenlosen WebMCP-Checker.

Wann ein MCP-Server besser passt

Wenn KI-Apps Ihre Daten nutzen sollen, ohne Ihre Website zu öffnen, bauen Sie stattdessen einen MCP-Server. Lesen Sie dazu WebMCP vs. MCP und sehen Sie sich unseren Service MCP-Server-Entwicklung an. Für die Browser-Seite gibt es unsere WebMCP-Integrationsservices.