Gebruik WebMCP om sites te bouwen die beter werken met AI-agents.

WebMCP API's

Wat is WebMCP en waarom is het belangrijk?

Het document lezen

Definieer WebMCP-tools met standaard JavaScript om sitespecifieke functies uit te voeren, zoals formulierinvoer en sitenavigatie.

Het document lezen

Zet uw standaard HTML-formulieren om in WebMCP-tools door annotaties toe te voegen.

Het document lezen

Samen helpen WebMCP en MCP agents om gepersonaliseerde taken uit te voeren namens menselijke gebruikers.

Het document lezen

Hoe WebMCP werkt

In maar 3 stappen vertelt je site agents precies wat ze kunnen doen.
Stap 1

Je site definieert de acties die een agent kan uitvoeren als WebMCP-tools. Elke tool heeft een naam, beschrijving en json-schema.

// 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);
  }
});
Stap 2

De browser verzamelt deze tools en presenteert ze aan de WebMCP-bewuste agent van de gebruiker, samen met de URL, de titel en het bereik van de oorspronkelijke rechten van de pagina.

Je site communiceert met de browser, die vertaalt voor de agent.
Stap 3

De agent ziet een contract, levert gestructureerde argumenten en je code doet de rest. De gebruiker blijft op de hoogte van rechten en bevestigingen. Het is sneller en betrouwbaarder dan activering.

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

Je site optimaliseren voor agents

Maak beveiligde tools die aansluiten bij de behoeften van je gebruikers en de mogelijkheden van je site.

Lees voorbeelden vanuit het perspectief van een gebruiker en een agent om te begrijpen welke WebMCP-tools een critical user journey (CUJ) ondersteunen.

Het document lezen

Net als bij elke software-app is de eerste stap het plannen van je toolstrategie.

Het document lezen

Ontdek hoe je WebMCP-tools definieert en bouwt die nuttig zijn voor je website of web-app.

Het document lezen

Lees onze vroege richtlijnen over beveiliging voor mensen die tools bouwen met WebMCP.

Het document lezen

Test voordat je WebMCP-tools vrijgeeft of agents begrijpen wanneer ze de tool moeten aanroepen, hoe ze deze moeten uitvoeren en welke antwoorden acceptabel zijn.

Het document lezen

Bouwen met AI-agents

Gebruik Modern Web Guidance met je favoriete AI-programmeeragents, zodat je toegang hebt tot best practices voor het web in de workflow van je voorkeur.
npx modern-web-guidance@latest install
Gebruik Modern Web Guidance om extensies sneller te maken met behulp van programmeeragents.

Veiligheidsoverwegingen voor ontwikkelaars van agents

Ontwikkelaars van agents moeten beveiligingsmaatregelen ontwerpen tegen schadelijke tekst uit niet-vertrouwde content. We identificeren een aantal beveiligingstechnieken die relevant zijn voor agents die WebMCP gebruiken.

AI-ondersteuning, rechtstreeks in je browser. Krijg belangrijke inzichten, verduidelijk concepten en vind antwoorden op basis van de context van je open tabbladen.

Gemini werkt in al je Google-apps om je te helpen je dag door te komen.

Maak kennis met AI-agents

Inzicht krijgen in de basisprincipes en definities van de verschillende opkomende technologieën, die vaak AI worden genoemd.
Als webprofessionals is het essentieel dat we nieuwe technologie doordacht en verantwoord ontwikkelen.
Bouw een basis van kennis over AI op om functies toe te voegen aan je websites en web-apps.