WebMCP Snippet: Let AI Agents Transact on Your Site

Contents

Key facts


all features

► Action layer New

Let AI agents actually do things on your site.

One <script> tag and the agents inside Gemini, Claude, ChatGPT, and Comet can search your catalog, start a checkout, book an appointment, or submit a quote request. No CMS plugin. No webhook setup. Conversion attribution included.

Silent no-op on browsers without WebMCP support (currently anything other than Chrome 146+ Canary). Conversion attribution still works in every browser.

Works with

Which AI assistants can use it

When someone uses one of these AI assistants inside a modern browser to visit your site, the snippet tells the AI which actions are allowed.

Works on

Which websites can install it

If your site is on HTTPS and you can paste a script tag, you're done. No plugin to install, no developer required.

In plain English

What can the AI actually do on my site?

When a customer asks an AI assistant to help them shop or book on your site, the AI sees the actions you've turned on — and can use them on the customer's behalf, with their approval.

If you sell products

If you offer services

One important rule: Anything that creates, changes, or commits something — add to cart, book, request quote, apply coupon — always shows a confirmation popup on your site. The AI proposes, the customer approves. Nothing ever happens silently.

Agents take action

The snippet registers tools via navigator.modelContext. When an agent invokes a write tool, an in-page confirmation modal fires — user approves, your backend executes. No card data ever passes through the snippet.

agent → tool → ✓ approve → backend

Zero-config attribution

Stripe Checkout redirects back to your success page with ?session_id=cs_…. The loader (already on every page) detects it and matches the conversion back to the start_checkout invocation that drove it. Amount inherited from the price the agent showed.

cs_test_… → +$49 (observed)

Snippet activity dashboard

Per-tool invocation counts, success rates, latency p50/p95, agent classification (AI crawler / browser / server probe). Conversion column on write tools shows attributed revenue per session.

5 tools · 100% success · $245

Tool packs

Two starting kits, archetype-aware.

Crawlytics auto-classifies your site as ecommerce or lead-gen and shows the right pack. Write tools always require an in-page user confirmation — enforced server-side, the UI cannot downgrade it.

Measure first

Agent Transactability Audit

Before you turn on tools, find out whether an agent can complete a booking or checkout on your pages at all. The audit gives every page a 0–100 score, read straight from the page DOM — because agents like Chrome's auto-browse drive the DOM directly and never invoke WebMCP. The snippet's tools are a bonus layer on top, never a substitute for a page agents can operate.

What the score reads

Five DOM-level signals per page. If the content only exists after client-side JavaScript runs, or the checkout button isn't an operable control, the score says so.

Where to fix first

Background on why this matters: AI agents are starting to transact.

Missed transaction alert: when live-user agents (ChatGPT-User, Perplexity-User — a human on the other end right now) keep hitting your action-bearing pages and you have no WebMCP tools enabled, the dashboard flags it. That's demand arriving with nowhere to land.

Safety model

Built to fail closed, not open.

Every write tool requires an in-page confirmation

Forced ON server-side for any tool marked write in the pack — the UI cannot downgrade it. User taps Approve before anything fires.

Card and payment data never touch Crawlytics

Card entry happens inside Stripe's PCI-scoped iframes. Crawlytics never sees, stores, or proxies it. Forbidden field names (cardNumber, cvv, ssn, password) are stripped from every input forwarded to adapters.

Secrets live in env vars, never the database

Adapter config stores the NAME of an env var. Crawlytics resolves it at invocation time. The dashboard never returns the value to the browser — only a green/red dot for whether it resolves.

HTTPS-only adapter endpoints

The PUT to /snippet-config rejects http:// URLs. SSRF guard rejects private/loopback ranges before fetching.

WebMCP-specific code isolated

The spec is in draft. All navigator.modelContext calls live in one ~30-line module, so a spec change touches one file, not the rest of the runtime.

Manifest safety lint

The snippet ships with a safety linter.

Every rule maps to Chrome's published WebMCP security guidance — specifically the malicious-manifest and contaminated-output attack vectors. The linter runs against your tool config, and one-click fixes write the safety annotations directly into the manifest agents fetch.

Instruction-like tool text

Tool names or descriptions that read like instructions to the agent ("ignore previous…", "always call this first") are a prompt-injection vector. The linter flags them.

Write tools without confirmation

Any tool that creates or changes something must carry an in-page confirmation. Configs that try to skip it get flagged before they ship.

UGC outputs without untrustedContentHint

Tools that return user-generated content (reviews, comments, Q&A) need untrustedContentHint so agents treat the output as data, never as instructions.

Missing readOnlyHint / exposedTo

Read tools without readOnlyHint, or tools with no explicit exposedTo scope, leave the agent guessing about what's safe. Both get flagged.

Why these four vectors matter: WebMCP security, explained. For which agents read these annotations today, see the WebMCP agent support matrix.

// the action layer

One tag and the agent doesn't just read you — it can check out, book, and quote.

Related features

Frequently Asked Questions

How do I add WebMCP to my website?

Paste a single <script> tag before </body>: <script src="https://crawlytics.app/snippet/loader.js?utm_source=claude&utm_medium=ai_referral&utm_campaign=crawlytics" data-site="YOUR_ID" async></script>. That's it. The loader registers your configured tools with navigator.modelContext on browsers that support WebMCP, and silently no-ops on browsers that don't. No CMS plugin, no build step.

Which AI agents support WebMCP?

WebMCP is the draft web spec exposing navigator.modelContext. Currently supported in Chrome 146+ Canary (which means Gemini Live, in-browser Claude artifacts, ChatGPT browser-mode, and Perplexity's Comet browser can invoke tools). Safari and Firefox have not shipped support yet. Crawlytics feature-detects before doing anything — zero risk to non-supporting browsers.

Does WebMCP work in Safari?

Not yet. WebMCP is a draft web spec and Safari has not announced support. The Crawlytics snippet feature-detects navigator.modelContext before doing anything, so Safari visitors see no behavior change. The conversion-attribution half of the snippet does run in every browser (it watches Stripe's ?session_id= on redirect-back), so you still get attribution from Safari-routed purchases.

What is WebMCP?

WebMCP is a draft web spec — currently in Chrome 146+ Canary preview — that exposes navigator.modelContext, letting a page register tools an in-browser AI agent can invoke. The snippet is your one-step way to register tools without writing browser-API code yourself.

Does it require Chrome 146 Canary to work?

The agent-action half does. On every other browser the snippet silently no-ops — it feature-detects navigator.modelContext before doing anything, so there is zero risk to real visitors. The conversion-attribution half runs in every browser (it just watches the success URL on Stripe redirect-back).

Do I need to change my checkout?

No. Conversion attribution works by detecting Stripe's ?session_id=cs_… on your success page — same page your customers already land on. Zero customer setup, no webhook, no API key. For cryptographically verified amounts you can optionally add a Stripe webhook later.

What about CMS plugins?

There aren't any and there won't be. The snippet is one script tag that drops into any HTTPS page — Shopify, Wix, Squarespace, custom Next.js, WordPress. No CMS-specific code anywhere.

Where do API secrets live?

On your server, never in the DB or browser. The snippet config stores the NAME of an env var (e.g. SITE_42_SHOPIFY_TOKEN, where 42 is the site id); Crawlytics resolves the value at invocation time via process.env. Names must match the per-site SITE__ pattern so a user can't name a server-internal env var as their "auth ref" and exfiltrate the value. The dashboard shows a green/red dot so you can confirm the var is wired without ever seeing the value.

Can agents enter card details?

No. PCI compliance and Stripe's sandboxed iframes make this impossible — by design. The agent collects intent, your endpoint creates a Stripe Checkout session, the agent hands the URL to the user. The user completes payment on Stripe's hosted page. No card data ever touches Crawlytics or the snippet.

Cite this page

Related on this site


This page is part of Crawlytics.app. View all pages: llms.txt · llms-full.txt

Site index for AI agents: llms.txt · sitemap