开始学习Fetch API

Fetch API 提供了一个获取资源的接口（包括通过网络）。任何使用过 XMLHttpRequest 的人都会觉得很熟悉，但Fetch API 提供了一个更强大和更灵活的功能集。

Fetch API 概念和用法

Fetch提供了Request和Response对象（以及涉及网络请求的其他内容）的通用的定义。这将允许他们在将来需要的地方使用，无论是service worker，Cache API 和其他类似的事情，处理或修改请求和响应，或任何类型的用例，可能需要您产生自己的响应编程。

它还为CORS和HTTP源头语义等相关概念提供了定义，取代了其他地方的单独定义。

为了提出请求并获取资源，请使用该GlobalFetch.fetch方法。它在多个接口实现的，特别是Window和WorkerGlobalScope。这使得它几乎可以在任何你想要获取资源的上下文中使用。

该 fetch() 方法采用一个强制参数，即要获取的资源的路径。它返回一个promise，它解决了对该请求的Response，无论是否成功。您也可以选择传递一个init选项对象作为第二个参数。

一旦检索到Response，就有很多方法可以定义正文内容以及应该如何处理。

您可以使用Request()和Response()构造函数直接创建请求和响应，但是您不太可能直接执行此操作。相反，这些更有可能被创建为其他API操作的结果（例如，来自service worker的FetchEvent.respondWith）。

注意：了解有关使用 fetch 中的Fetch API 功能的更多信息，并在 Fetch 基本概念中学习概念。

中止 Fetch

浏览器已经开始为 AbortController 和 AbortSignal 接口（又名Abort API）添加实验支持，允许像 Fetch 和 XHR 操作，如果他们尚未完成将被中止。

Fetch 接口

GlobalFetch

包含用于获取资源的fetch()方法。

Headers

表示响应/请求标题，允许您查询它们并根据结果采取不同的操作。

Request

代表资源请求。

Response

表示对请求的响应。

Fetch mixin

Body

提供与响应/请求主体相关的方法，允许您声明其内容类型以及应该如何处理。

规范

浏览器兼容性

• 电脑端

• 移动端

表格中的角标解释：

[1]这个API是在首选项后面实现的。

[2]在Firefox 52之前，get()只返回指定头文件中的第一个值，getAll()返回所有的值。从52开始，get()现在返回所有值，并getAll()已被删除。

[3]可读流目前在Firefox中启用，但隐藏在dom.streams.enabled和javascript.options.streamsprefs 后面。