WebMCP: cos'è e come implementarlo sul tuo sito (2026)

WebMCP è lo standard che permette a un sito di dichiarare agli agenti AI quali azioni possono compiere sulla pagina, come cercare un prodotto o inviare una richiesta di preventivo, invece di lasciarli indovinare dove cliccare.

A fine settembre 2026 funziona in Chrome tramite origin trial, ChatGPT lo usa nel suo browser integrato e Shopify lo ha già attivato su tutti i negozi, checkout compreso.

Molte guide italiane su WebMCP sono ferme a febbraio: parlano di navigator.modelContext, di un file webmcp.json da mettere nella root e di un'anteprima riservata a pochi.

Nel frattempo è cambiato quasi tutto. Qui trovi lo stato reale, il codice che funziona oggi e i controlli di sicurezza che io non salterei.

Cos'è WebMCP in parole semplici

Oggi un agente AI che apre un sito lo tratta come farebbe una persona distratta: legge l'HTML, guarda uno screenshot, prova a capire quale bottone premere. Funziona, ma è lento e sbaglia spesso.

Con WebMCP è il sito a dire all'agente cosa può fare. Ogni azione diventa un tool con tre elementi:

• Un nome, per esempio richiedi_preventivo
• Una descrizione in linguaggio naturale, che spiega all'agente quando usarlo
• Uno schema dei parametri, cioè quali dati servono e in che formato

L'agente legge l'elenco dei tool, sceglie quello giusto e lo chiama con i parametri corretti. Il sito esegue l'azione con la stessa logica che usa per l'utente umano, nella stessa sessione e con lo stesso login.

A che punto è WebMCP a settembre 2026

Chi si è informato nei mesi scorsi deve aggiornare parecchie cose. Questi sono i passaggi verificati sulle fonti ufficiali:

• Specifica: è una bozza del Web Machine Learning Community Group del W3C, aggiornata il 26 settembre 2026. Gli editor sono di Microsoft e Google.
• Chrome: WebMCP è in origin trial da Chrome 149. Per provarlo in locale basta il flag chrome://flags/#enable-webmcp-testing.
• ChatGPT: dal 25 agosto 2026 i "site tools" di ChatGPT sono l'implementazione di WebMCP. Il browser integrato nell'app desktop, ChatGPT Work e Codex scoprono e usano i tool dei siti che li espongono.
• Shopify: dal 5 agosto 2026 tutti i negozi Liquid espongono tool per catalogo, carrello e ordini. Dal 28 settembre 2026 anche il checkout ha i suoi tool.

Il dettaglio tecnico che rompe molti tutorial: l'API adesso vive su document.modelContext, non più su navigator.modelContext. Se copi un esempio di febbraio, probabilmente non funziona.

Cosa fa Shopify con WebMCP, in pratica

Sui negozi Shopify l'agente trova tool come search_catalog, get_product, update_cart e proceed_to_checkout. Nel checkout arrivano get_checkout, update_checkout e complete_checkout, che invia l'ordine solo dopo la conferma dell'acquirente.

Il commerciante non deve installare nulla. Ci sono però limiti precisi: niente checkout B2B, niente checkout incorporati e niente nuove carte di credito inserite dall'agente.

Per questo, se hai un negozio Shopify, WebMCP è già attivo e il lavoro da fare riguarda soprattutto schede prodotto e policy chiare. Ne ho parlato anche nell'articolo su come gli agenti AI comprano al posto dell'utente.

WebMCP e MCP: qual è la differenza

Il nome confonde, ma lavorano su due livelli diversi. Se ti serve un ripasso su MCP, trovi la guida completa al Model Context Protocol.

• Dove gira: MCP gira sul server o sul desktop come processo sempre attivo. WebMCP gira dentro la scheda del browser.
• Quanto dura: MCP è persistente. WebMCP esiste solo finché la pagina è aperta: chiusa la scheda, l'agente perde i tool.
• Sessione e login: con MCP devi gestire autenticazione e token a parte. Con WebMCP l'agente lavora nella sessione già aperta dall'utente.
• Come si scrive: MCP usa JSON-RPC e SDK in vari linguaggi. WebMCP usa JavaScript o semplici attributi HTML.

La regola che uso io: MCP per la logica di business e i processi in background, WebMCP per le azioni che l'utente fa sul sito. Non sono alternative, spesso servono entrambi.

Come funziona WebMCP: API dichiarativa e imperativa

Ci sono due modi per creare un tool. Puoi usarli insieme nello stesso sito.

API dichiarativa: bastano attributi HTML sui form

È la strada più veloce per form lineari: contatti, preventivi, ricerca interna, iscrizione alla newsletter. Aggiungi quattro attributi e il form diventa un tool.

<form toolname="richiedi_preventivo"
      tooldescription="Invia una richiesta di preventivo per un sito o un ecommerce"
      action="/api/preventivo" method="post">
  <label>Nome
    <input name="nome" required
           toolparamdescription="Nome e cognome di chi chiede il preventivo">
  </label>
  <label>Email
    <input name="email" type="email" required
           toolparamdescription="Email a cui inviare la risposta">
  </label>
  <button type="submit">Invia</button>
</form>

Gli attributi sono toolname, tooldescription, toolparamdescription sui singoli campi e toolautosubmit, che fa partire l'invio quando l'agente chiama il tool.

Senza toolautosubmit l'agente compila i campi e l'utente preme il bottone: per un preventivo è la scelta che preferisco.

Nel gestore del submit puoi capire chi ha inviato il form con event.agentInvoked e restituire un risultato all'agente con event.respondWith().

API imperativa: tool in JavaScript per i flussi complessi

Per configuratori, filtri a più passaggi o carrelli personalizzati serve JavaScript. Il tool si registra così:

if ('modelContext' in document) {
  const controller = new AbortController();

  await document.modelContext.registerTool({
    name: 'cerca_prodotti',
    description: 'Cerca nel catalogo per parola chiave e restituisce nome, prezzo e disponibilità',
    inputSchema: {
      type: 'object',
      properties: {
        query: { type: 'string', description: 'Cosa cerca il cliente' }
      },
      required: ['query']
    },
    annotations: { readOnlyHint: true },
    execute: async ({ query }) => {
      const res = await fetch('/api/prodotti?q=' + encodeURIComponent(query));
      return await res.json();
    }
  }, { signal: controller.signal });

  // per togliere il tool: controller.abort();
}

Non esiste un metodo unregisterTool(): il tool si rimuove con l'AbortSignal passato in registrazione. In un sito Next.js o React lo lego al ciclo di vita del componente, così il tool esiste solo quando la sezione è montata.

Come implementare WebMCP sul tuo sito, passo per passo

1. Scegli due o tre azioni che portano valore: di solito ricerca prodotti, richiesta di preventivo, prenotazione. Non esporre tutto.
2. Attiva il flag chrome://flags/#enable-webmcp-testing in Chrome per lavorare in locale.
3. Parti dai form esistenti con l'API dichiarativa: è il modo più economico per iniziare.
4. Passa all'API imperativa solo dove il form non basta, per esempio filtri o varianti di prodotto.
5. Imposta le annotazioni di sicurezza su ogni tool, come spiego nella sezione successiva.
6. Testa con l'estensione Model Context Tool Inspector: mostra i tool registrati sulla pagina e ti fa chiamarli a mano.
7. Registra il sito all'origin trial e aggiungi il token, altrimenti i visitatori con Chrome stabile non vedono i tool.

Se lavori con agenti AI che scrivono codice per te, tienili in un ambiente isolato mentre fanno queste modifiche: ho spiegato come nella guida a Docker Sandbox per Claude Code e Codex.

Sicurezza di WebMCP: le quattro cose da non saltare

Un tool WebMCP è una porta che apri a un software che interpreta testo. Gli attacchi di prompt injection contro gli agenti sono documentati e ripetibili, quindi tratto ogni tool come un endpoint pubblico.

Sul tema ho scritto anche a proposito della falla Plugin4Shell negli agenti di coding.

• readOnlyHint: segnalo come sola lettura i tool che non cambiano nulla, così l'agente non chiede conferme inutili.
• consequentialHint: lo metto a true su tutto ciò che invia ordini, pagamenti o dati personali, così browser e agente chiedono conferma all'utente.
• untrustedContentHint: lo uso quando il tool restituisce contenuti scritti da utenti, come recensioni o commenti, che possono contenere istruzioni malevole.
• exposedTo: limita il tool alle sole origini di cui ti fidi, soprattutto se tocca dati dei clienti.

Due requisiti tecnici da conoscere: WebMCP funziona solo in documenti con origin isolation e richiede la permissions policy tools, che per gli iframe di altre origini va concessa con allow="tools".

La documentazione Chrome consiglia anche output brevi, intorno a 1.500 caratteri per risposta e 500 per descrizione.

Tre cose false che circolano su WebMCP

• "Serve un file webmcp.json nella root": nella bozza della specifica e nella documentazione Chrome i tool li registra la pagina, con JavaScript o con attributi HTML. Il manifest in /.well-known/ è una convenzione della community, non uno standard.
• "È una cosa di Google": la specifica è scritta insieme da Microsoft e Google e ChatGPT la usa già.
• "Fa salire su Google": non ho trovato nulla che leghi WebMCP al posizionamento organico. Serve a far completare azioni agli agenti, non a rankare. Per farti citare dalle AI contano altre cose, come ho spiegato parlando di llms.txt.

WebMCP serve alla mia azienda adesso?

Dipende dalla piattaforma e da quanto conta per te che un agente completi un'azione sul tuo sito.

• Negozio Shopify: è già attivo. Lavora su titoli, varianti e policy chiare, perché l'agente li legge tramite i tool.
• WordPress e WooCommerce: nella directory ufficiale ci sono plugin di terze parti per WebMCP. Prima di installarli controllo cosa espongono e chi li mantiene: un plugin che apre azioni agli agenti è una superficie d'attacco in più. Se stai ancora scegliendo la piattaforma, ecco il mio confronto tra WooCommerce e Shopify.
• Sito o web app su misura: è il caso in cui WebMCP rende di più, perché scegli tu quali azioni esporre. Io partirei dal form di contatto o preventivo con l'API dichiarativa, poi valuterei la ricerca prodotti.
• Sito vetrina senza form: oggi non ti serve. Meglio investire su contenuti chiari e dati strutturati.

Se vuoi capire come gli agenti AI possono lavorare anche dietro al sito, sui tuoi processi interni, trovi il mio approccio nella pagina sull'automazione AI per le aziende.

Per un ecommerce su misura pronto per gli agenti, o per valutare il tuo caso, puoi scrivermi dalla pagina contatti.