Am Ende dieses Moduls wirst du in der Lage sein:
- ✅ Die Architektur und Vorteile des Model Context Protocol (MCP) zu verstehen
- ✅ Das MCP-Server-Ökosystem von Microsoft zu erkunden
- ✅ MCP-Server mit dem AI Toolkit Agent Builder zu integrieren
- ✅ Einen funktionalen Browser-Automatisierungsagenten mit Playwright MCP zu erstellen
- ✅ MCP-Tools innerhalb deiner Agenten zu konfigurieren und zu testen
- ✅ MCP-basierte Agenten für den Produktionseinsatz zu exportieren und bereitzustellen
In Modul 1 haben wir die Grundlagen des AI Toolkits gemeistert und unseren ersten Python-Agenten erstellt. Jetzt werden wir deine Agenten auf das nächste Level bringen, indem wir sie über das revolutionäre Model Context Protocol (MCP) mit externen Tools und Diensten verbinden.
Stell dir das vor wie den Wechsel von einem einfachen Taschenrechner zu einem vollwertigen Computer – deine KI-Agenten erhalten die Fähigkeit:
- 🌐 Websites zu durchsuchen und mit ihnen zu interagieren
- 📁 Dateien zu öffnen und zu bearbeiten
- 🔧 Sich mit Unternehmenssystemen zu integrieren
- 📊 Echtzeitdaten von APIs zu verarbeiten
Model Context Protocol (MCP) ist der „USB-C für KI-Anwendungen“ – ein revolutionärer offener Standard, der Large Language Models (LLMs) mit externen Tools, Datenquellen und Diensten verbindet. So wie USB-C das Kabelchaos durch einen universellen Anschluss beseitigt hat, vereinfacht MCP die KI-Integration durch ein einheitliches Protokoll.
Vor MCP:
- 🔧 Individuelle Integrationen für jedes Tool
- 🔄 Vendor-Lock-in durch proprietäre Lösungen
- 🔒 Sicherheitslücken durch ad-hoc Verbindungen
- ⏱️ Monate Entwicklungszeit für einfache Integrationen
Mit MCP:
- ⚡ Plug-and-Play Tool-Integration
- 🔄 Anbieterunabhängige Architektur
- 🛡️ Eingebaute Sicherheitsstandards
- 🚀 Neue Funktionen in Minuten hinzufügen
MCP folgt einer Client-Server-Architektur, die ein sicheres und skalierbares Ökosystem schafft:
graph TB
A[AI Application/Agent] --> B[MCP Client]
B --> C[MCP Server 1: Files]
B --> D[MCP Server 2: Web APIs]
B --> E[MCP Server 3: Database]
B --> F[MCP Server N: Custom Tools]
C --> G[Local File System]
D --> H[External APIs]
E --> I[Database Systems]
F --> J[Enterprise Systems]
🔧 Kernkomponenten:
| Komponente | Rolle | Beispiele |
|---|---|---|
| MCP Hosts | Anwendungen, die MCP-Dienste nutzen | Claude Desktop, VS Code, AI Toolkit |
| MCP Clients | Protokoll-Handler (1:1 mit Servern) | In Host-Anwendungen integriert |
| MCP Server | Stellen Funktionen über Standardprotokoll bereit | Playwright, Files, Azure, GitHub |
| Transportschicht | Kommunikationsmethoden | stdio, HTTP, WebSockets |
Microsoft führt das MCP-Ökosystem mit einer umfassenden Suite an Enterprise-Servern, die reale Geschäftsanforderungen abdecken.
🔗 Repository: azure/azure-mcp
🎯 Zweck: Umfassendes Azure-Ressourcenmanagement mit KI-Integration
✨ Hauptfunktionen:
- Deklarative Infrastruktur-Bereitstellung
- Echtzeit-Überwachung von Ressourcen
- Empfehlungen zur Kostenoptimierung
- Sicherheits-Compliance-Prüfung
🚀 Anwendungsfälle:
- Infrastructure-as-Code mit KI-Unterstützung
- Automatisches Skalieren von Ressourcen
- Cloud-Kostenoptimierung
- Automatisierung von DevOps-Workflows
📚 Dokumentation: Microsoft Dataverse Integration
🎯 Zweck: Natürliche Sprachschnittstelle für Geschäftsdaten
✨ Hauptfunktionen:
- Datenbankabfragen in natürlicher Sprache
- Verständnis des Geschäftskontexts
- Benutzerdefinierte Prompt-Vorlagen
- Unternehmensweite Datenverwaltung
🚀 Anwendungsfälle:
- Business-Intelligence-Berichte
- Analyse von Kundendaten
- Einblicke in Vertriebspipelines
- Compliance-Datenabfragen
🔗 Repository: microsoft/playwright-mcp
🎯 Zweck: Browser-Automatisierung und Web-Interaktion
✨ Hauptfunktionen:
- Browserübergreifende Automatisierung (Chrome, Firefox, Safari)
- Intelligente Elementerkennung
- Screenshot- und PDF-Erstellung
- Netzwerkverkehrsüberwachung
🚀 Anwendungsfälle:
- Automatisierte Testabläufe
- Web-Scraping und Datenerfassung
- UI/UX-Überwachung
- Automatisierung von Wettbewerbsanalysen
🔗 Repository: microsoft/files-mcp-server
🎯 Zweck: Intelligente Dateisystemoperationen
✨ Hauptfunktionen:
- Deklaratives Dateimanagement
- Inhaltssynchronisation
- Integration von Versionskontrolle
- Metadatenextraktion
🚀 Anwendungsfälle:
- Dokumentenverwaltung
- Organisation von Code-Repositories
- Workflows für Content-Publishing
- Dateiverwaltung in Datenpipelines
🔗 Repository: microsoft/markitdown
🎯 Zweck: Erweiterte Markdown-Verarbeitung und -Manipulation
✨ Hauptfunktionen:
- Umfangreiche Markdown-Analyse
- Formatkonvertierung (MD ↔ HTML ↔ PDF)
- Inhaltsstruktur-Analyse
- Template-Verarbeitung
🚀 Anwendungsfälle:
- Technische Dokumentations-Workflows
- Content-Management-Systeme
- Berichtserstellung
- Automatisierung von Wissensdatenbanken
📦 Paket: @microsoft/clarity-mcp-server
🎯 Zweck: Web-Analytics und Nutzerverhaltens-Insights
✨ Hauptfunktionen:
- Heatmap-Datenanalyse
- Aufzeichnung von Nutzersitzungen
- Performance-Metriken
- Analyse von Conversion-Funnels
🚀 Anwendungsfälle:
- Website-Optimierung
- Nutzererfahrungsforschung
- A/B-Test-Analyse
- Business-Intelligence-Dashboards
Neben Microsofts Servern umfasst das MCP-Ökosystem:
- 🐙 GitHub MCP: Repository-Verwaltung und Code-Analyse
- 🗄️ Datenbank-MCPs: PostgreSQL, MySQL, MongoDB-Integrationen
- ☁️ Cloud-Provider-MCPs: AWS, GCP, Digital Ocean Tools
- 📧 Kommunikations-MCPs: Slack, Teams, E-Mail-Integrationen
🎯 Projektziel: Erstelle einen intelligenten Browser-Automatisierungsagenten mit dem Playwright MCP Server, der Websites navigiert, Informationen extrahiert und komplexe Web-Interaktionen durchführt.
- Öffne den AI Toolkit Agent Builder
- Erstelle einen neuen Agenten mit folgender Konfiguration:
- Name:
BrowserAgent - Modell: Wähle GPT-4o
- Name:
- Wechsle zum Bereich „Tools“ im Agent Builder
- Klicke auf „Add Tool“, um das Integrationsmenü zu öffnen
- Wähle „MCP Server“ aus den verfügbaren Optionen
🔍 Tool-Typen verstehen:
- Eingebaute Tools: Vorgefertigte AI Toolkit Funktionen
- MCP Server: Externe Dienstintegrationen
- Custom APIs: Eigene Service-Endpunkte
- Function Calling: Direkter Modell-Funktionszugriff
-
Wähle die Option „MCP Server“ zum Fortfahren
-
Durchsuche den MCP-Katalog, um verfügbare Integrationen zu entdecken
- Klicke auf „Use Featured MCP Servers“, um auf Microsofts verifizierte Server zuzugreifen
- Wähle „Playwright“ aus der Liste der vorgestellten Server
- Akzeptiere die Standard-MCP-ID oder passe sie für deine Umgebung an
🔑 Kritischer Schritt: Wähle ALLE verfügbaren Playwright-Methoden für maximale Funktionalität aus
🛠️ Wichtige Playwright-Tools:
- Navigation:
goto,goBack,goForward,reload - Interaktion:
click,fill,press,hover,drag - Extraktion:
textContent,innerHTML,getAttribute - Validierung:
isVisible,isEnabled,waitForSelector - Erfassung:
screenshot,pdf,video - Netzwerk:
setExtraHTTPHeaders,route,waitForResponse
✅ Erfolgskriterien:
- Alle Tools sind in der Agent Builder-Oberfläche sichtbar
- Keine Fehlermeldungen im Integrationsbereich
- Playwright-Serverstatus zeigt „Connected“
🔧 Häufige Probleme und Lösungen:
- Verbindung fehlgeschlagen: Überprüfe Internetverbindung und Firewall-Einstellungen
- Fehlende Tools: Stelle sicher, dass alle Funktionen bei der Einrichtung ausgewählt wurden
- Berechtigungsfehler: Prüfe, ob VS Code die nötigen Systemrechte hat
Erstelle ausgefeilte Prompts, die die volle Playwright-Funktionalität nutzen:
# Web Automation Expert System Prompt
## Core Identity
You are an advanced web automation specialist with deep expertise in browser automation, web scraping, and user experience analysis. You have access to Playwright tools for comprehensive browser control.
## Capabilities & Approach
### Navigation Strategy
- Always start with screenshots to understand page layout
- Use semantic selectors (text content, labels) when possible
- Implement wait strategies for dynamic content
- Handle single-page applications (SPAs) effectively
### Error Handling
- Retry failed operations with exponential backoff
- Provide clear error descriptions and solutions
- Suggest alternative approaches when primary methods fail
- Always capture diagnostic screenshots on errors
### Data Extraction
- Extract structured data in JSON format when possible
- Provide confidence scores for extracted information
- Validate data completeness and accuracy
- Handle pagination and infinite scroll scenarios
### Reporting
- Include step-by-step execution logs
- Provide before/after screenshots for verification
- Suggest optimizations and alternative approaches
- Document any limitations or edge cases encountered
## Ethical Guidelines
- Respect robots.txt and rate limiting
- Avoid overloading target servers
- Only extract publicly available information
- Follow website terms of serviceGestalte Prompts, die verschiedene Funktionen demonstrieren:
🌐 Beispiel Web-Analyse:
Navigate to github.com/kinfey and provide a comprehensive analysis including:
1. Repository structure and organization
2. Recent activity and contribution patterns
3. Documentation quality assessment
4. Technology stack identification
5. Community engagement metrics
6. Notable projects and their purposes
Include screenshots at key steps and provide actionable insights.
- Klicke auf „Run“, um die Automatisierungssequenz zu starten
- Beobachte die Echtzeit-Ausführung:
- Chrome-Browser öffnet sich automatisch
- Agent navigiert zur Zielwebsite
- Screenshots dokumentieren jeden wichtigen Schritt
- Analyseergebnisse werden in Echtzeit angezeigt
Überprüfe die umfassende Analyse in der Agent Builder-Oberfläche:
Der Agent Builder unterstützt verschiedene Bereitstellungsoptionen:
✅ Erlernte Fähigkeiten:
- MCP-Architektur und Vorteile verstehen
- Microsofts MCP-Server-Ökosystem navigieren
- Playwright MCP mit AI Toolkit integrieren
- Komplexe Browser-Automatisierungsagenten bauen
- Fortgeschrittenes Prompt-Engineering für Web-Automatisierung
- 🔗 MCP-Spezifikation: Offizielle Protokolldokumentation
- 🛠️ Playwright API: Vollständige Methodenreferenz
- 🏢 Microsoft MCP Server: Enterprise-Integrationsleitfaden
- 🌍 Community-Beispiele: MCP Server Galerie
🎉 Herzlichen Glückwunsch! Du hast die MCP-Integration erfolgreich gemeistert und kannst jetzt produktionsreife KI-Agenten mit externen Tool-Fähigkeiten erstellen!
Bereit, deine MCP-Kenntnisse weiter auszubauen? Fahre fort mit Modul 3: Fortgeschrittene MCP-Entwicklung mit AI Toolkit, wo du lernst:
- Eigene benutzerdefinierte MCP-Server zu erstellen
- Das neueste MCP Python SDK zu konfigurieren und zu nutzen
- Den MCP Inspector für Debugging einzurichten
- Fortgeschrittene MCP-Server-Entwicklungsworkflows zu meistern
- Erstelle einen Weather MCP Server von Grund auf neu
Haftungsausschluss:
Dieses Dokument wurde mit dem KI-Übersetzungsdienst Co-op Translator übersetzt. Obwohl wir uns um Genauigkeit bemühen, beachten Sie bitte, dass automatisierte Übersetzungen Fehler oder Ungenauigkeiten enthalten können. Das Originaldokument in seiner Ursprungssprache ist als maßgebliche Quelle zu betrachten. Für wichtige Informationen wird eine professionelle menschliche Übersetzung empfohlen. Wir übernehmen keine Haftung für Missverständnisse oder Fehlinterpretationen, die aus der Nutzung dieser Übersetzung entstehen.