WebMCP
W3C-standardforslag til eksponering af strukturerede AI-værktøjer direkte på websider
WebMCP gør det muligt for webapplikationer at eksponere typede JavaScript-funktioner og annoterede HTML-formularer direkte til AI-agenter i browseren.
Kom hurtigt i gang
index.html
Kom i gang med WebMCP i dit projekt.
<!-- 1. Declarative WebMCP: Annotate standard HTML forms -->
<form action="/api/quote" toolname="request_freight_quote" tooldescription="Get freight estimate between Danish postal codes">
<input name="fromZip" toolparam="from_postal_code" placeholder="Fra postnr (f.eks. 8000)" required />
<input name="toZip" toolparam="to_postal_code" placeholder="Til postnr (f.eks. 1050)" required />
<input name="weightKg" type="number" toolparam="weight_kg" placeholder="Vægt i kg" required />
<button type="submit">Beregn fragt</button>
</form>
<!-- 2. Imperative WebMCP: Register typed tools in JavaScript -->
<script>
if (window.modelContext) {
window.modelContext.registerTool({
name: 'get_live_train_status',
description: 'Fetches live train delays and track alterations for Danish stations',
inputSchema: {
type: 'object',
properties: {
stationName: { type: 'string', description: 'Station name in Denmark, e.g. Aarhus H' }
},
required: ['stationName']
},
execute: async ({ stationName }) => {
const res = await fetch(`/api/trains?station=${encodeURIComponent(stationName)}`)
return res.json()
}
})
}
</script>Om WebMCP
WebMCP er en åben webstandard udviklet under W3C Web Machine Learning Working Group og tilgængelig eksperimentelt fra Chrome 146 (samt Origin Trials). Standarden gør det muligt for webapplikationer at registrere kaldepare agent-værktøjer med eksplicitte JSON Schemas direkte i klientside-koden, så agenter slipper for at gætte museklik eller scrape rå HTML. WebMCP understøtter både et Deklarativt API (via standard HTML-formularattributter som `toolname` og `toolparam`) og et Imperativt API (`document.modelContext` / `navigator.modelContext`). Cloudflare tilbyder en 1-klik WebMCP edge-bridge, der automatisk forbinder browseragenter til et same-origin `/mcp`-endpoint, og Cloudflare BrowserRun understøtter direkte opdagelse og eksekvering af WebMCP-værktøjer. Da værktøjerne afvikles i den aktive browsersession under standard origin-isolering og Permissions Policy, muliggør WebMCP sikre Human-in-the-Loop arbejdsgange på MitID- og loginbeskyttede selvbetjeningsløsninger uden at udstille brugernavne eller sessionsnøgler.
Danske data- og produkt-guides
Hvordan udviklere og agenter bruger WebMCP til at tilgå dansk digital infrastruktur.
Cloudflare WebMCP Edge Bridge with Same-Origin /mcp
AgentAccess.dk / Cloudflare EdgeEnable Cloudflare WebMCP preview on your Danish platform domain. The edge bridge connects browser agents directly to your /mcp endpoint for instant, zero-maintenance agent access.
<!-- Injected at the edge by Cloudflare HTMLRewriter -->
<script type="module"
src="/.webmcp/bridge.js"
data-packs="c2pa,mcp-server-client"
data-mcp-url="/mcp"></script>Declarative CVR Search on Danish Portals
CVR.dk / Virk.dkAdd toolname="cvr_search" and toolparam="cvr_query" attributes to native HTML search forms so in-browser agents can execute business lookups without DOM scraping.
<form action="/search" method="GET" toolname="cvr_search" tooldescription="Look up Danish registered businesses by CVR number or company name">
<label for="cvr">CVR / Navn</label>
<input type="text" id="cvr" name="q" toolparam="cvr_query" toolparamdescription="8-digit Danish CVR number or legal company name" required />
<button type="submit">Søg</button>
</form>Imperative Tool Registration for MitID-Protected Self-Service
Register an imperative client-side tool with document.modelContext that handles municipal or tax form pre-filling after the user has completed MitID authentication.
if (document.modelContext) {
document.modelContext.registerTool({
name: 'prepare_tax_deduction',
description: 'Pre-fills Danish commuter deduction (kørselsfradrag) for the authenticated citizen',
inputSchema: {
type: 'object',
properties: {
workDays: { type: 'integer', minimum: 1, maximum: 365 },
distanceKmPerDay: { type: 'number', minimum: 25 }
},
required: ['workDays', 'distanceKmPerDay']
},
execute: async ({ workDays, distanceKmPerDay }) => {
// Updates local form state; user inspects and clicks final submit
return {
content: [{ type: 'text', text: 'Commuter deduction updated successfully' }],
isError: false,
}
}
})
}