fetch API中的request.mode有什么意义，特别是对于cors？ [英] What is the point of request.mode in the fetch API, especially with respect to cors?

问题描述

查看新的fetch API，您可以在请求中指定模式字段。来自 Mozilla ：

Looking at the new fetch API, you can specificy a mode field in the request. From Mozilla:

The mode read-only property of the Request interface contains the mode 
of the request (e.g., cors, no-cors, same-origin, or navigate.) This is 
used to determine if cross-origin requests lead to valid responses, and 
which properties of the response are readable.

然后如何使用它：

var myHeaders = new Headers();

var myInit = { method: 'GET',
           headers: myHeaders,
           mode: 'cors',
           cache: 'default' };

fetch('flowers.jpg', myInit).then(function(response) {
  return response.blob();
}).then(function(myBlob) {
  var objectURL = URL.createObjectURL(myBlob);
  myImage.src = objectURL;
});

我不明白为什么你需要具体说明在请求中如此明显的东西本身？如果我在客户端网站上 http://foo.com 服务器请求资源 http://client.com ，服务器是否有原始标题可供查看？这种模式不会造成混乱吗？

I don't understand why would you would need to specificy something that is so self evident in the request itself? If I was requesting a resource from http://foo.com servers on the client website http://client.com, doesn't the server have the origin header to look at? And wouldn't the mode only cause confusion?

此外，我正在试图找出目标模式：同源甚至可以服务？ 您可以使用它来确保始终向您的来源发出请求。但是如果您要发送请求，或者其他开发人员可以访问该代码，为什么不能你只是没有发送请求而不是一个字段来表明它是无效的？

Furthermore I'm trying to figure out what goal mode: same-origin would even serve? "You could use this to ensure that a request is always being made to your origin." But if you're sending a request out, or if another developer has access to the code, why wouldn't you just not send the request instead of a field to indicate it's invalid?

推荐答案

Fetch API通过设计公开了浏览器用于内部提取的相同原语。

The Fetch API by design exposes the same primitives that browsers use for fetches internally.

mode 是其中一个原语。并且它不仅仅用于定义Fetch API的Fetch规范部分 - 因为Fetch规范以及定义JavaScript API，还定义了浏览器如何在内部处理各种类型的提取的低级算法。

mode is one of those primitives. And it’s not just used in the part of the Fetch spec that defines the Fetch API — because the Fetch spec, along with defining that JavaScript API, also defines low-level algorithms for how browsers handle fetches of various kinds internally.

规范中定义的浏览器内部算法（如HTML规范引用了Fetch规范中的低级算法），并依赖于设置模式和fetch的其他方面。

Browser-internal algorithms defined in specifications such as the HTML spec reference those low-level algorithms in the Fetch spec, and rely on setting the mode and other aspects of the fetch.

例如，根据HTML规范，这里的 获取经典工作脚本算法的开始：

For example, from the HTML spec, here’s the start of the fetch a classic worker script algorithm:

获取经典工作人员脚本给定网址，获取
客户端设置对象，目标和脚本设置对象，
运行这些步骤。该算法将异步完成null（失败时）或新的
经典脚本（成功时）。

To fetch a classic worker script given a url, a fetch client settings object, a destination, and a script settings object, run these steps. The algorithm will asynchronously complete with either null (on failure) or a new classic script (on success).

1. 让请求成为新的请求 url 是 url ，客户端是获取客户端设置对象，目的地是目的地，模式是同源，凭据模式是 same-origin ，解析器
   元数据是未解析器插入，并且其 use-URL-credentials标志是设置。

1. Let request be a new request whose url is url, client is fetch client settings object, destination is destination, mode is "same-origin", credentials mode is "same-origin", parser metadata is "not parser-inserted", and whose use-URL-credentials flag is set.

特别注意«让请求是一个新的请求»和«模式是同源»部分 - 并注意到请求转到 https://fetch.spec.whatwg.org/#concept-request 和模式转到 https：// fetch。 spec.whatwg.org/#concept-request-mode 。

Note especially the «Let request be a new request» and «mode is "same-origin"» parts — and notice that the hyperlink for request goes to https://fetch.spec.whatwg.org/#concept-request and the hyperlink for mode goes to https://fetch.spec.whatwg.org/#concept-request-mode.

因此HTML规范需要同源 请求的模式设置 - 以指定浏览器在进行某种类型的提取时内部使用的行为。

So the HTML spec has need for the "same-origin" mode setting for requests — in order to specify behavior that browsers use internally when making a certain type of fetch.

这种事情是Fetch规范需要的原因s提供具有特定模式的提取。除此之外，Fetch API提供设置同源模式的能力的原因（如上所述）符合允许您作为Web开发人员可以访问浏览器在进行提取时可以访问的相同原语。

And that kind of thing is the reason the Fetch spec needs to provide for fetches to have particular modes. Along with that, the reason the Fetch API provides the ability to set the "same-origin" mode is (as mentioned above) in keeping with the goal of allowing you as a web developer to have access to the same primitives that browsers have access to internally when making fetches.

您可能永远不会觉得需要Fetch API公开的所有各种模式 - 您不太可能想要使用导航模式 - 但它们仍然存在，因为它们代表了任何给定提取所需的完整模式集场景（包括内部只有浏览器可能使用的场景）。

You may not ever find need for all the various modes the Fetch API exposes — it’s pretty unlikely you’d ever want to use the navigate mode — but they’re all there nonetheless, because they represent the complete set of modes that are needed for any given fetch scenario (including scenarios that are only ever likely to be used by browsers internally).

这篇关于fetch API中的request.mode有什么意义，特别是对于cors？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！