In breve: WebMCP permette a un sito di dichiarare agli agenti IA quali azioni offre, con un nome, una descrizione e dei parametri. Esistono due modi: l'API dichiarativa, con attributi HTML aggiunti ai moduli, e l'API imperativa, con JavaScript. È una proposta di standard in evoluzione: secondo la documentazione di Chrome è in fase sperimentale (origin trial). La sintassi può cambiare, quindi controlla sempre la documentazione ufficiale prima di pubblicare.
Perché serve WebMCP?
Un agente che usa un sito "a vista" deve indovinare dove cliccare e cosa compilare. Con WebMCP il sito gli dice direttamente: "qui puoi richiedere un preventivo, questi sono i campi, questo è il risultato". È più rapido, meno fragile e più controllabile da chi gestisce il sito. Per le basi leggi WebMCP spiegato semplice.
API dichiarativa: trasformare un modulo in uno strumento
È il modo più semplice: aggiungi attributi a un modulo che già esiste. Il nome e la descrizione dello strumento si indicano sul tag form, la descrizione di ogni campo sul campo stesso.
<form toolname="richiedi_preventivo"
tooldescription="Invia una richiesta di preventivo gratuito per un sito web, un e-commerce o un software su misura."
action="/preventivo" method="post">
<label for="servizio">Servizio</label>
<select id="servizio" name="servizio" toolparamdescription="Servizio di interesse">
<option value="sito">Sito web</option>
<option value="ecommerce">E-commerce</option>
</select>
<label for="email">Email</label>
<input id="email" name="email" type="email" required
toolparamdescription="Indirizzo email a cui rispondere">
<button type="submit">Invia la richiesta</button>
</form>Il modulo resta utilizzabile dalle persone come prima. Dove il browser non supporta WebMCP, gli attributi vengono semplicemente ignorati.
API imperativa: registrare uno strumento in JavaScript
Serve quando l'azione non coincide con un modulo, per esempio cercare tra i servizi o leggere dati. Lo strumento ha un nome, una descrizione, uno schema dei parametri e una funzione che lo esegue.
const controllo = new AbortController();
document.modelContext.registerTool({
name: "cerca_servizi",
description: "Cerca tra i servizi dell'agenzia per argomento e restituisce nome e pagina. Sola lettura.",
inputSchema: {
type: "object",
properties: {
argomento: { type: "string", description: "Ad esempio: e-commerce, SEO, app" }
},
required: ["argomento"]
},
annotations: { readOnlyHint: true },
async execute({ argomento }) {
const risultati = await cercaNelCatalogo(argomento); // la tua funzione
return JSON.stringify(risultati);
}
}, { signal: controllo.signal });
// Quando lo strumento non serve più:
// controllo.abort();Il codice è un esempio indicativo: nome dell'oggetto, opzioni e formato dei risultati sono quelli descritti nella documentazione di Chrome e possono cambiare. Nelle prime versioni lo stesso oggetto si trovava in navigator.modelContext: usa document.modelContext e prevedi un controllo di compatibilità.
Buone pratiche
- Nomi chiari e orientati all'azione, come
prenota_consulenzaocerca_prodotti. - Descrizioni precise e brevi: spiegano cosa fa lo strumento, quando usarlo e cosa non fa.
- Pochi strumenti: Lighthouse segnala un numero troppo alto, oltre i 40.
- Registra gli strumenti quando servono e rimuovili quando non sono più utili.
- Azioni sensibili: chiedi sempre la conferma dell'utente. Ne parliamo in WebMCP e sicurezza.
Come testare
- Lighthouse include controlli dedicati: strumenti registrati, moduli senza annotazioni dichiarative e validità dello schema degli strumenti.
- Chrome DevTools ha un pannello per vedere gli strumenti registrati dalla pagina.
- Estensioni di test permettono di elencare ed eseguire gli strumenti.
- Per provare WebMCP in locale, la documentazione di Chrome indica un flag di sperimentazione e, per i siti pubblici, l'origin trial.
Limiti da conoscere
Lo standard è giovane e può cambiare. L'agente deve visitare la pagina in un browser compatibile. Non tutti i servizi di IA lo usano ancora. Per questo conviene partire da poche azioni utili e a basso rischio.
Un esempio dal vivo
Questo sito espone già alcuni strumenti per gli agenti: descrivere la pagina, elencare i servizi, fornire i contatti, rispondere alle domande frequenti e indicare i link per preventivo e consulenza. Se vuoi farlo anche sul tuo, scopri i nostri siti agent-ready o richiedi un preventivo gratuito.