Menjelang akhir modul ini, anda akan dapat:
- ✅ Memahami seni bina dan manfaat Model Context Protocol (MCP)
- ✅ Meneroka ekosistem pelayan MCP Microsoft
- ✅ Mengintegrasikan pelayan MCP dengan AI Toolkit Agent Builder
- ✅ Membangunkan ejen automasi pelayar berfungsi menggunakan Playwright MCP
- ✅ Mengkonfigurasi dan menguji alat MCP dalam ejen anda
- ✅ Mengeksport dan melancarkan ejen berkuasa MCP untuk kegunaan produksi
Dalam Modul 1, kita menguasai asas AI Toolkit dan mencipta Ejen Python pertama kita. Kini kita akan memperkasakan ejen anda dengan menghubungkannya kepada alat dan perkhidmatan luaran melalui Model Context Protocol (MCP) yang revolusioner.
Fikirkan ini seperti menaik taraf dari kalkulator asas ke komputer penuh - ejen AI anda akan mendapat keupayaan untuk:
- 🌐 Melayari dan berinteraksi dengan laman web
- 📁 Mengakses dan mengurus fail
- 🔧 Berintegrasi dengan sistem perusahaan
- 📊 Memproses data masa nyata dari API
Model Context Protocol (MCP) adalah "USB-C untuk aplikasi AI" - satu piawaian terbuka revolusioner yang menghubungkan Large Language Models (LLMs) kepada alat, sumber data, dan perkhidmatan luaran. Sama seperti USB-C menghapuskan kekacauan kabel dengan menyediakan satu penyambung universal, MCP menghapuskan kerumitan integrasi AI dengan satu protokol piawai.
Sebelum MCP:
- 🔧 Integrasi khusus untuk setiap alat
- 🔄 Terikat dengan vendor melalui penyelesaian proprietari
- 🔒 Kerentanan keselamatan akibat sambungan ad-hoc
- ⏱️ Berbulan-bulan pembangunan untuk integrasi asas
Dengan MCP:
- ⚡ Integrasi alat plug-and-play
- 🔄 Seni bina bebas vendor
- 🛡️ Amalan keselamatan terbina dalam
- 🚀 Beberapa minit untuk menambah keupayaan baru
MCP mengikuti seni bina klien-pelayan yang mewujudkan ekosistem yang selamat dan boleh diskala:
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]
🔧 Komponen Teras:
| Komponen | Peranan | Contoh |
|---|---|---|
| MCP Hosts | Aplikasi yang menggunakan perkhidmatan MCP | Claude Desktop, VS Code, AI Toolkit |
| MCP Clients | Pengendali protokol (1:1 dengan pelayan) | Terbina dalam aplikasi hos |
| MCP Servers | Mendedahkan keupayaan melalui protokol piawai | Playwright, Files, Azure, GitHub |
| Transport Layer | Kaedah komunikasi | stdio, HTTP, WebSockets |
Microsoft mengetuai ekosistem MCP dengan suite pelayan kelas perusahaan yang menyelesaikan keperluan perniagaan sebenar.
🔗 Repositori: azure/azure-mcp
🎯 Tujuan: Pengurusan sumber Azure menyeluruh dengan integrasi AI
✨ Ciri Utama:
- Penyediaan infrastruktur secara deklaratif
- Pemantauan sumber masa nyata
- Cadangan pengoptimuman kos
- Pemeriksaan pematuhan keselamatan
🚀 Kes Penggunaan:
- Infrastruktur-sebagai-Kod dengan bantuan AI
- Penskalakan sumber automatik
- Pengoptimuman kos awan
- Automasi aliran kerja DevOps
📚 Dokumentasi: Microsoft Dataverse Integration
🎯 Tujuan: Antara muka bahasa semula jadi untuk data perniagaan
✨ Ciri Utama:
- Pertanyaan pangkalan data menggunakan bahasa semula jadi
- Pemahaman konteks perniagaan
- Templat prompt tersuai
- Tadbir urus data perusahaan
🚀 Kes Penggunaan:
- Laporan perisikan perniagaan
- Analisis data pelanggan
- Wawasan saluran jualan
- Pertanyaan data pematuhan
🔗 Repositori: microsoft/playwright-mcp
🎯 Tujuan: Keupayaan automasi pelayar dan interaksi web
✨ Ciri Utama:
- Automasi pelbagai pelayar (Chrome, Firefox, Safari)
- Pengecaman elemen pintar
- Penjanaan tangkapan skrin dan PDF
- Pemantauan trafik rangkaian
🚀 Kes Penggunaan:
- Aliran kerja ujian automatik
- Pengikisan web dan ekstraksi data
- Pemantauan UI/UX
- Automasi analisis persaingan
🔗 Repositori: microsoft/files-mcp-server
🎯 Tujuan: Operasi sistem fail pintar
✨ Ciri Utama:
- Pengurusan fail secara deklaratif
- Penyelarasan kandungan
- Integrasi kawalan versi
- Ekstraksi metadata
🚀 Kes Penggunaan:
- Pengurusan dokumentasi
- Pengorganisasian repositori kod
- Aliran kerja penerbitan kandungan
- Pengendalian fail saluran data
🔗 Repositori: microsoft/markitdown
🎯 Tujuan: Pemprosesan dan manipulasi Markdown lanjutan
✨ Ciri Utama:
- Parsing Markdown yang kaya
- Penukaran format (MD ↔ HTML ↔ PDF)
- Analisis struktur kandungan
- Pemprosesan templat
🚀 Kes Penggunaan:
- Aliran kerja dokumentasi teknikal
- Sistem pengurusan kandungan
- Penjanaan laporan
- Automasi pangkalan pengetahuan
📦 Pakej: @microsoft/clarity-mcp-server
🎯 Tujuan: Analitik web dan wawasan tingkah laku pengguna
✨ Ciri Utama:
- Analisis data heatmap
- Rakaman sesi pengguna
- Metik prestasi
- Analisis corong penukaran
🚀 Kes Penggunaan:
- Pengoptimuman laman web
- Kajian pengalaman pengguna
- Analisis ujian A/B
- Papan pemuka perisikan perniagaan
Selain pelayan Microsoft, ekosistem MCP merangkumi:
- 🐙 GitHub MCP: Pengurusan repositori dan analisis kod
- 🗄️ Database MCPs: Integrasi PostgreSQL, MySQL, MongoDB
- ☁️ Cloud Provider MCPs: Alat AWS, GCP, Digital Ocean
- 📧 Communication MCPs: Integrasi Slack, Teams, Email
🎯 Matlamat Projek: Cipta ejen automasi pelayar pintar menggunakan pelayan Playwright MCP yang boleh melayari laman web, mengekstrak maklumat, dan melakukan interaksi web kompleks.
- Buka AI Toolkit Agent Builder
- Cipta Ejen Baru dengan konfigurasi berikut:
- Nama:
BrowserAgent - Model: Pilih GPT-4o
- Nama:
- Pergi ke Bahagian Alat dalam Agent Builder
- Klik "Add Tool" untuk membuka menu integrasi
- Pilih "MCP Server" dari pilihan yang ada
🔍 Memahami Jenis Alat:
- Built-in Tools: Fungsi AI Toolkit yang telah dikonfigurasi
- MCP Servers: Integrasi perkhidmatan luaran
- Custom APIs: Titik akhir perkhidmatan anda sendiri
- Function Calling: Akses fungsi model secara langsung
- Klik "Use Featured MCP Servers" untuk akses pelayan Microsoft yang disahkan
- Pilih "Playwright" dari senarai pilihan
- Terima MCP ID lalai atau sesuaikan mengikut persekitaran anda
🔑 Langkah Kritikal: Pilih SEMUA kaedah Playwright yang tersedia untuk fungsi maksimum
🛠️ Alat Playwright Penting:
- Navigasi:
goto,goBack,goForward,reload - Interaksi:
click,fill,press,hover,drag - Ekstraksi:
textContent,innerHTML,getAttribute - Pengesahan:
isVisible,isEnabled,waitForSelector - Tangkap:
screenshot,pdf,video - Rangkaian:
setExtraHTTPHeaders,route,waitForResponse
✅ Petunjuk Kejayaan:
- Semua alat muncul dalam antara muka Agent Builder
- Tiada mesej ralat dalam panel integrasi
- Status pelayan Playwright menunjukkan "Connected"
🔧 Penyelesaian Masalah Lazim:
- Sambungan Gagal: Semak sambungan internet dan tetapan firewall
- Alat Hilang: Pastikan semua keupayaan dipilih semasa persediaan
- Ralat Kebenaran: Sahkan VS Code mempunyai kebenaran sistem yang diperlukan
Cipta prompt canggih yang memanfaatkan sepenuhnya keupayaan Playwright:
# 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 serviceReka prompt yang menunjukkan pelbagai keupayaan:
🌐 Contoh Analisis Web:
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.- Klik "Run" untuk memulakan urutan automasi
- Pantau Pelaksanaan Masa Nyata:
- Pelayar Chrome dilancarkan secara automatik
- Ejen melayari laman web sasaran
- Tangkapan skrin diambil setiap langkah utama
- Keputusan analisis dipaparkan secara langsung
Semak analisis menyeluruh dalam antara muka Agent Builder:
Agent Builder menyokong pelbagai pilihan pelancaran:
✅ Kemahiran Dikuasai:
- Memahami seni bina dan manfaat MCP
- Menavigasi ekosistem pelayan MCP Microsoft
- Mengintegrasikan Playwright MCP dengan AI Toolkit
- Membangun ejen automasi pelayar yang canggih
- Kejuruteraan prompt lanjutan untuk automasi web
- 🔗 Spesifikasi MCP: Dokumentasi Protokol Rasmi
- 🛠️ API Playwright: Rujukan Kaedah Lengkap
- 🏢 Pelayan MCP Microsoft: Panduan Integrasi Perusahaan
- 🌍 Contoh Komuniti: Galeri Pelayan MCP
🎉 Tahniah! Anda telah berjaya menguasai integrasi MCP dan kini boleh membina ejen AI bersedia produksi dengan keupayaan alat luaran!
Bersedia untuk meningkatkan kemahiran MCP anda? Teruskan ke Modul 3: Pembangunan MCP Lanjutan dengan AI Toolkit di mana anda akan belajar cara untuk:
- Mencipta pelayan MCP tersuai anda sendiri
- Mengkonfigurasi dan menggunakan SDK Python MCP terkini
- Menyediakan MCP Inspector untuk debugging
- Menguasai aliran kerja pembangunan pelayan MCP lanjutan
- Bina Pelayan MCP Cuaca dari awal
Penafian:
Dokumen ini telah diterjemahkan menggunakan perkhidmatan terjemahan AI Co-op Translator. Walaupun kami berusaha untuk ketepatan, sila ambil maklum bahawa terjemahan automatik mungkin mengandungi kesilapan atau ketidaktepatan. Dokumen asal dalam bahasa asalnya harus dianggap sebagai sumber yang sahih. Untuk maklumat penting, terjemahan profesional oleh manusia adalah disyorkan. Kami tidak bertanggungjawab atas sebarang salah faham atau salah tafsir yang timbul daripada penggunaan terjemahan ini.










