Sec-Fetch-Dest

Baseline 2023 *
Newly available

Since March 2023, this feature works across the latest devices and browser versions. This feature might not work in older devices or browsers.

* Some parts of this feature may have varying levels of support.

Sec-Fetch-Dest Fetch 元数据请求标头指示请求的目标,即数据的来源以及如何使用这些获取到的数据。

这允许服务器根据请求是否采用了适当的使用方式来确定是否为请求提供服务。例如,具有 audio 目标的请求应请求音频数据,而不是其他类型的资源(例如,包含敏感用户信息的文档)。

标头类型 Fetch 元数据请求标头
禁止修改的消息首部 是(带有 Sec- 前缀)
CORS-safelisted request header

语法

http
Sec-Fetch-Dest: audio
Sec-Fetch-Dest: audioworklet
Sec-Fetch-Dest: document
Sec-Fetch-Dest: embed
Sec-Fetch-Dest: empty
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: worker
Sec-Fetch-Dest: xslt

如果此标头包含任何其他的值,服务器应忽略它。

指令

备注: 这些指令对应于 Request.destination 返回的值。

audio

目标是音频数据。这可能源自 HTML <audio> 标签。

audioworklet

目标是获取供 audio worklet 使用的数据。这可能源于对 audioWorklet.addModule() 的调用。

document

目标是文档(HTML 或 XML),请求是用户发起的顶级导航的结果(例如,由用户单击链接产生)。

embed

目标是嵌入内容。这可能源自 HTML <embed> 标签。

empty

目标是空字符串。这用于没有自己值的目标。例如:fetch()navigator.sendBeacon()EventSourceXMLHttpRequestWebSocket 等等。

font

目标是字体。这可能源自 CSS @font-face

frame

目标是 frame。这可能源自 HTML <frame> 标签。

iframe

目标是 iframe。这可能源自 HTML <iframe> 标签。

image

目标是图片。这可能源自 HTML <image>、SVG <image>、CSS background-image、CSS cursor、CSS list-style-image 等等。

manifest

目标是 mainfest。这可能源自 HTML <link rel=manifest>

object

目标是对象,这可能源自 <object> 标签。

paintworklet

目标是 paint worklet。这可能源自对 CSS.PaintWorklet.addModule() 的调用。

report

目标是报告(如一份内容安全策略报告)。

script

目标是一个脚本。这可能源自 HTML <script> 标签或对 WorkerGlobalScope.importScripts() 的调用。

serviceworker

目标是 service worker。这可能源于对 navigator.serviceWorker.register() 的调用。

sharedworker

目标是 shared worker。这可能源自 SharedWorker

style

目标是 style。这可能源自 HTML <link rel=stylesheet> 或者 CSS @import

track

目标是 HTML text track。这可能源自 HTML <track> 标签。

video

目标是视频数据。这可能源自于 <video> 标签。

worker

目标是 Worker

xslt

目标是 XSLT 转换。

示例

<img> 元素生成的跨域请求将具有以下的 HTTP 请求标头(请注意,目标是 image):

http
Sec-Fetch-Dest: image
Sec-Fetch-Mode: no-cors
Sec-Fetch-Site: cross-site

规范

Specification
Fetch Metadata Request Headers
# sec-fetch-dest-header

浏览器兼容性

Report problems with this compatibility data on GitHub
desktopmobile
Chrome
Edge
Firefox
Opera
Safari
Chrome Android
Firefox for Android
Opera Android
Safari on iOS
Samsung Internet
WebView Android
WebView on iOS
Sec-Fetch-Dest
fencedframe value
Experimental

Legend

Tip: you can click/tap on a cell for more information.

Full support
Full support
No support
No support
Experimental. Expect behavior to change in the future.

参见