Fetch Metadata (Sec-Fetch-*) Simulator
Browsers automatically attach Sec-Fetch-Site, Sec-Fetch-Mode,
and Sec-Fetch-Dest headers to every request — but they're invisible to
frontend code, so backend engineers writing WAF and CSRF rules can't easily see what to
expect. This simulator shows the exact headers for any request scenario.
Tool interface
🎬 Scenario Explorer
Select a real-world request scenario to see the headers the browser would send.
🛠️ Custom Header Builder
Pick each header value to model a specific request and get tailored guidance.
📖 Header Reference
| Header | Purpose | Valid Values |
|---|---|---|
| Sec-Fetch-Site | Relationship between requester's origin and target's origin | same-origin, same-site, cross-site, none |
| Sec-Fetch-Mode | The request's mode (how it was initiated) | navigate, cors, no-cors, websocket |
| Sec-Fetch-Dest | The type of resource being requested | document, empty, image, script, style, font, iframe, object, worker, audio, video, track, manifest, report, xslt |
| Sec-Fetch-User | Whether the request was triggered by user activation | ?1 (yes), ?0 (no) — only on navigations |
Introduction
Fetch Metadata request headers give servers contextual information about every incoming request — where it came from, how it was initiated, and what it's loading. This is invaluable for writing precise WAF and CSRF defenses, but the headers are invisible to frontend developers. This simulator bridges that gap.
How It Works
- The Scenario Explorer maps 12 common request patterns to their exact Fetch Metadata headers.
- Each scenario includes a security note and a WAF-handling recommendation.
- The Custom Builder lets you model any combination and generates tailored guidance.
- All logic is based on the W3C Fetch Metadata specification — no network calls.
Privacy
This tool performs pure spec-based simulation in your browser. No requests are made and no data is transmitted.
Limitations
- Simulates headers based on the spec; actual behavior may vary slightly by browser version.
- Does not intercept real network traffic — that requires a server or proxy.
- Fetch Metadata should complement, not replace, CSRF tokens and SameSite cookies.
FAQ
Can I use Fetch Metadata to stop CSRF?
Yes, as a defense-in-depth layer. Rejecting cross-site requests to state-changing endpoints blocks most CSRF attacks, but keep CSRF tokens as your primary protection since not all browsers send these headers.
What does Sec-Fetch-Site: none mean?
It indicates a user-initiated request not tied to an origin — like typing a URL in the address bar or opening a bookmark. These are generally safe to trust.
Is my data uploaded?
No. Everything is simulated locally in your browser. Nothing is transmitted.