Sec-Fetch-Dest 头
Baseline 广泛可用 *
HTTP Sec-Fetch-Dest Fetch 元数据请求头指示请求的“目的地”。即原始 fetch 请求的发起者，也就是所获取数据将被使用的地方（以及方式）。
这允许服务器根据请求的预期用途是否合适来决定是否响应请求。例如，目标为 audio 的请求应该请求音频数据，而不是其他类型的资源（例如，包含敏感用户信息的文档）。
| 头类型 | Fetch 元数据请求头 |
|---|---|
| 禁止请求头 | 是 (Sec- 前缀) |
| CORS 安全列表请求头 | 否 |
语法
Sec-Fetch-Dest: audio
Sec-Fetch-Dest: audioworklet
Sec-Fetch-Dest: document
Sec-Fetch-Dest: embed
Sec-Fetch-Dest: empty
Sec-Fetch-Dest: fencedframe
Sec-Fetch-Dest: font
Sec-Fetch-Dest: frame
Sec-Fetch-Dest: iframe
Sec-Fetch-Dest: image
Sec-Fetch-Dest: manifest
Sec-Fetch-Dest: object
Sec-Fetch-Dest: paintworklet
Sec-Fetch-Dest: report
Sec-Fetch-Dest: script
Sec-Fetch-Dest: serviceworker
Sec-Fetch-Dest: sharedworker
Sec-Fetch-Dest: style
Sec-Fetch-Dest: track
Sec-Fetch-Dest: video
Sec-Fetch-Dest: webidentity
Sec-Fetch-Dest: worker
Sec-Fetch-Dest: xslt
如果此头包含任何其他值，服务器应忽略此头。
指令
注意：这些指令对应于 Request.destination 返回的值。
audio-
目标是音频数据。这可能源自 HTML
<audio>标签。 audioworklet-
目标是为 audio worklet 使用而获取的数据。这可能源自对
audioWorklet.addModule()的调用。 document-
目标是文档（HTML 或 XML），并且该请求是用户发起的顶级导航的结果（例如，用户点击链接导致的结果）。
嵌入-
目标是嵌入内容。这可能源自 HTML
<embed>标签。 empty-
目标是空字符串。这用于没有自己值的目标。例如：
fetch()、navigator.sendBeacon()、EventSource、XMLHttpRequest、WebSocket等。 fencedframe实验性-
目标是围栏帧。
font-
目标是字体。这可能源自 CSS
@font-face。 frame-
目标是帧。这可能源自 HTML
<frame>标签。 iframe-
目标是 iframe。这可能源自 HTML
<iframe>标签。 图片-
目标是图像。这可能源自 HTML
<img>、SVG<image>、CSSbackground-image、CSScursor、CSSlist-style-image等。 manifest-
目标是清单。这可能源自 HTML <link rel=manifest>。
object-
目标是对象。这可能源自 HTML
<object>标签。 paintworklet-
目标是 paint worklet。这可能源自对
CSS.PaintWorklet.addModule()的调用。 report-
目标是报告（例如，内容安全策略报告）。
script-
目标是脚本。这可能源自 HTML
<script>标签或对WorkerGlobalScope.importScripts()的调用。 serviceworker-
目标是 service worker。这可能源自对
navigator.serviceWorker.register()的调用。 -
目标是 shared worker。这可能源自
SharedWorker。 style-
目标是样式。这可能源自 HTML <link rel=stylesheet> 或 CSS
@import。 track-
目标是 HTML 文本轨道。这可能源自 HTML
<track>标签。 video-
目标是视频数据。这可能源自 HTML
<video>标签。 webidentity-
目标是与验证用户身份相关的端点。例如，它在 FedCM API 中用于验证身份提供商 (IdP) 端点的真实性，防止 CSRF 攻击。
worker-
目标是
Worker。 xslt-
目标是 XSLT 转换。
示例
使用 Sec-Fetch-Dest
由 <img> 元素生成的跨站请求将导致具有以下 HTTP 请求头的请求（注意目的地是 image）
Sec-Fetch-Dest: image
Sec-Fetch-Mode: no-cors
Sec-Fetch-Site: cross-site
规范
| 规范 |
|---|
| Fetch 元数据请求头 # sec-fetch-dest-header |
浏览器兼容性
加载中…
另见
Sec-Fetch-Mode、Sec-Fetch-Site、Sec-Fetch-Userfetch 元数据请求头- 使用 Fetch 元数据保护你的资源免受网络攻击 (web.dev)
- Fetch 元数据请求头操场 (secmetadata.appspot.com)