Bangun situs dan aplikasi yang berfungsi untuk pengguna dan agen AI mereka.
Mulai Bergabung dengan uji coba origin

Cara kerja WebMCP

Hanya dalam tiga langkah, situs Anda akan memberi tahu agen secara persis apa yang dapat mereka lakukan.
Langkah 1

Situs Anda menyatakan tindakan yang dapat dilakukan agen, sebagai alat WebMCP. Setiap alat memiliki nama, deskripsi, dan skema JSON.

// Imperative API
document.modelContext.registerTool({
  name: "bookSlot",
  title: "Book a consultation slot",
  description: "Reserve a 30-minute consultation.",
  inputSchema: {
    type: "object",
    properties: {
      date:  { type: "string", format: "date" },
      time:  { type: "string" },
      name:  { type: "string" },
      email: { type: "string", format: "email" }
    },
    required: ["date", "time", "name", "email"]
  },
  annotations: { readOnlyHint: false },
  execute: async (input, client) => {
    return await api.book(input);
  }
});
Langkah 2

Browser mengumpulkan dan menyajikan alat ini ke agen yang kompatibel dengan WebMCP pengguna, bersama dengan URL, judul, dan cakupan izin origin halaman.

Situs Anda berkomunikasi dengan browser, yang menerjemahkan untuk agen.
Langkah 3

Agen melihat kontrak, memberikan argumen terstruktur, dan kode Anda melakukan sisanya. Pengguna akan terus mendapatkan informasi terkait izin dan konfirmasi. Fitur ini lebih cepat dan lebih andal daripada aktivasi.

// the agent's view
{
  "tool": "bookSlot",
  "arguments": {
    "date": "2026-07-31",
    "time": "14:00",
    "name": "Jerry Jones",
    "email": "jerry.jones@example.com"
  }
}

Membangun alat untuk agen

Pelajari lebih dalam API dan dokumentasi WebMCP.
Mulai
Temukan peluang bagi situs Anda untuk membantu pengguna dan agen menjadi lebih efisien, dengan menambahkan alat WebMCP.
Baca dokumen
Tentukan alat WebMCP dengan JavaScript standar untuk menjalankan fungsi khusus situs, seperti input formulir dan navigasi situs.
Baca dokumen
Ubah formulir HTML standar Anda menjadi alat WebMCP dengan menambahkan anotasi.
Baca dokumen
Uji alat Anda untuk mengonfirmasi bahwa agen memahami kapan harus memanggil alat, cara menjalankannya, dan jawaban apa yang dapat diterima.
Baca dokumen
Pelajari praktik terbaik untuk menggunakan WebMCP API.
Baca dokumen
Pelajari cara membuat alat yang aman untuk situs Anda.
Baca dokumen
Bersama-sama, WebMCP dan MCP membantu agen menyelesaikan tugas yang dipersonalisasi atas nama pengguna manusia.
Baca dokumen

Membangun dengan agen AI

Gunakan Panduan Web Modern dengan agen coding AI favorit Anda, sehingga Anda dapat mengakses praktik terbaik web dalam alur kerja pilihan Anda. 
npx modern-web-guidance@latest install
Baca dokumen
Gunakan Panduan Web Modern untuk membangun ekstensi lebih cepat, dengan bantuan agen coding.
Baca dokumen

Pertimbangan keamanan untuk developer agen

Developer agen harus merancang perlindungan terhadap teks berbahaya dari konten yang tidak tepercaya. Kami mengidentifikasi beberapa teknik keamanan yang relevan untuk agen yang menggunakan WebMCP.
Baca panduan kami

Bantuan AI, langsung di browser Anda. Dapatkan poin penting, klarifikasi konsep, dan temukan jawaban berdasarkan konteks tab yang Anda buka.

Gemini berfungsi di seluruh aplikasi Google untuk membantu Anda menyelesaikan pekerjaan sehari-hari.

Temukan Gemini di Chrome

Memperkenalkan agen AI

web.dev
Memahami dasar-dasar dan definisi berbagai teknologi baru, yang sering disebut sebagai AI.
Baca dokumen
web.dev
Sebagai praktisi web, kita harus membuat teknologi baru dengan penuh pertimbangan dan penuh tanggung jawab.
Baca dokumen
web.dev
Bangun dasar pengetahuan tentang AI untuk menambahkan fitur ke situs dan aplikasi web Anda.
Ikuti kursus