携手创作，共同成长！这是我参与「掘金日新计划 · 8 月更文挑战」的第4天，点击查看活动详情
前言
最近在分析哔哩哔哩的添加评论Api中 api.bilibili.com/x/v2/reply/… 发现了有三个没见过的请求头，都是sec-fetch开头的请求头，例如:
- sec-fetch-dest: empty
- sec-fetch-mode: cors
- sec-fetch-site: same-site
于是乎就要来了解一下这些作用是什么拉~
sec-fetch请求头们
Sec-Fetch是一种元数据请求头（Fetch Metadata Request Headers），它于2019年发布于新的草案中，服务端可以通过它来精确判断请求的合法性，杜绝非法请求和攻击，提高web服务的安全性。
Sec-Fetch-Dest
它是一个请求头，指示服务器的请求目的地。它是一个结构化的标头，其值是一个带有可能值的标记audio, audioworklet, document, embed, empty, font, image, manifest, object, paintworklet, report, script, serviceworker, sharedworker, style, track, video, worker, xslt, and nested-document.
PS:即说明客户端请求的目的，想要什么样的资源。
Sec-Fetch-Site
它是一个请求头，指示请求发起者的源与其目标源之间的关系。它是一个结构化的标头，其值是一个带有可能值的标记cross-site, same-origin, same-site, and none.
| 值 | 含义 |
|---|---|
| cross-site | 跨域请求 |
| same-site | ----不知道---- |
| same-origin | 同源请求？ |
| none | 啥都没有 |
ps:即表示一个请求发起者的来源与目标资源来源之间的关系。
Sec-Fetch-Mode
它是一个向服务器指示请求模式的请求头。它是一个结构化的标头，其值是一个标记，可能的值是cors, navigate, nested-navigate, no-cors, same-origin, and websocket。
| 值 | 含义 |
|---|---|
| cros | 跨域请求 |
| no-cros | 限制请求只能使用请求方法(get/post/put)和请求头(accept/accept-language/content-language/content-type) |
| websocket | 表示这是一个浏览器的页面切换请求(request)。 navigate请求仅在浏览器切换页面时创建，该请求应该返回HTML |
| navigate | 啥都没有 |
ps:即该请求头表明了一个请求的模式。
