Js中fetch方法

fetch() 方法定义在 Window 对象以及 WorkerGlobalScope 对象上，用于发起获取资源的请求，其返回一个 Promise 对象，这个 Promise 对象会在请求响应后被 resolve ，并传回 Response 对象。

Promise<Response> fetch(input[, init])

input : 定义要获取的资源，其值可以是：

init : 一个配置项对象，包括所有对请求的设置。可选的参数有：

返回一个 Promise ， resolve 时回传 Response 对象。

fetch与jQuery.ajax区别

发起一个简单的资源请求，对于 fetch 请求返回一个 Promise 对象，这个 Promise 对象会在请求响应后被 resolve ，并传回 Response 对象。

window.fetch("https://cdn.jsdelivr.net/npm/jquery@3/dist/jquery.min.js")
.then(res => console.log(res))
通过init配置对象设置参数，可以设置method、headers、body、mode、credentials、cache、redirect、referrer、referrerPolicy、integrity。
var headers = new Headers({
    "accept": "application/javascript" 
headers.append("accept", "application/xml");
headers.set("user-agent", "Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/81.0.4044.92 Safari/537.36");
window.fetch("https://cdn.jsdelivr.net/npm/jquery@3/dist/jquery.min.js", {
    method: "GET",
    headers: headers,
    cache: 'no-cache',
.then(res => console.log(res))
Headers对象
Headers.append(): 给现有的header添加一个值, 或者添加一个未存在的header并赋值。
Headers.delete(): 从Headers对象中删除指定header。
Headers.entries(): 以迭代器的形式返回Headers对象中所有的键值对。
Headers.get(): 以ByteString的形式从Headers对象中返回指定header的全部值。
Headers.has(): 以布尔值的形式从Headers对象中返回是否存在指定的header。
Headers.keys(): 以迭代器的形式返回Headers对象中所有存在的header名。
Headers.set(): 替换现有的header的值, 或者添加一个未存在的header并赋值。
Headers.values(): 以迭代器的形式返回Headers对象中所有存在的header的值。
通过Response对象对响应的数据作处理，包括获取响应状态以及响应体的处理等操作。
window.fetch("https://cdn.jsdelivr.net/npm/jquery@3/dist/jquery.min.js")
.then(res => res.text())
.then(data => console.log(data))
Response对象
Response对象的相关属性与方法：
Response.headers: 只读，包含此Response所关联的Headers对象。
Response.ok: 只读，包含了一个布尔值，标示该Response成功，HTTP状态码的范围在 200-299。
Response.redirected: 只读，表示该Response是否来自一个重定向，如果是的话，它的URL列表将会有多个条目。
Response.status: 只读，包含Response的状态码。
Response.statusText: 只读，包含了与该Response状态码一致的状态信息。
Response.type: 只读，包含Response的类型，例如basic、cors。
Response.url: 只读，包含Response的URL。
Response.useFinalURL: 包含了一个布尔值，来标示这是否是该Response的最终URL。
Response.clone(): 创建一个Response对象的克隆。
Response.error(): 返回一个绑定了网络错误的新的Response对象。
Response.redirect(): 用另一个URL创建一个新的Response。
Response实现了Body接口，相关属性与方法可以直接使用：
Body.body: 只读，一个简单的getter，用于暴露一个ReadableStream类型的body内容。
Body.bodyUsed: 只读，包含了一个布尔值来标示该Response是否读取过Body。
Body.arrayBuffer(): 读取Response对象并且将它设置为已读，并返回一个被解析为ArrayBuffer格式的Promise对象，Responses对象被设置为了stream的方式，所以它们只能被读取一次。
Body.blob():

读取Response对象并且将它设置为已读，并返回一个被解析为Blob格式的Promise对象。
Body.formData():

读取Response对象并且将它设置为已读，并返回一个被解析为FormData格式的Promise对象。
Body.json():

读取Response对象并且将它设置为已读，并返回一个被解析为JSON格式的Promise对象。
Body.text():

读取Response对象并且将它设置为已读，并返回一个被解析为USVString格式的Promise对象。
https://github.com/WindrunnerMax/EveryDay
https://segmentfault.com/a/1190000012740215
https://developer.mozilla.org/zh-CN/docs/Web/API/Headers
https://developer.mozilla.org/zh-CN/docs/Web/API/Response
https://developer.mozilla.org/zh-CN/docs/Web/API/Fetch_API
https://developer.mozilla.org/zh-CN/docs/Web/API/Fetch_API/Using_Fetch
https://developer.mozilla.org/zh-CN/docs/Web/API/WindowOrWorkerGlobalScope/fetch