ajax 写了多年，也用了种种 ajax 库，浏览器终究推出了一个原生的 Fetch API 完成ajax 功用。和 Fetch 一同的另有四个类：Headers Request Response Body

Fetch

window.fetch 推断浏览器是不是支撑

fetch(url/request[, options])

request 是一个 Request 对象，背面细致讲

options 是一个对象，重要key 以下：
method: GET/POST等
headers: 一个平常对象，或许一个 Headers 对象
body: 传递给服务器的数据，可所以字符串/Buffer/Blob/FormData，假如要领是 GET/HEAD，则不能有此参数
mode: cors / no-cors / same-origin， 是不是跨域，默许是 no-cors
credentials: omit / same-origin / include
cache: default / no-store / reload / no-cache / force-cache / only-if-cached
redirect: follow / error / manual
referrer: no-referrer / client / 或许一个url
referrerPolicy: no-referrer / no-referrer-when-downgrade / origin /  origin-when-cross-origin / unsafe-url
integrity: 资本完整性考证

fetch() 返回一个 promise，所以这么用

fetch()
.then(response => {
  if (response.ok) {
  // 胜利处置惩罚
  }
}).catch(error => {
  // 非常处置惩罚
})

收集毛病，权限题目等会报非常，404不算作非常
所以还需要经由过程 response.ok 推断是不是胜利

比方：

var headers = new Headers();
headers.append('Content-Type', 'image/jpeg');

/* headers 也可所以一个对象
 * {'Content-Type': 'image/jpeg'}
*/
var init = {
  method: 'GET',
  headers: headers,
  mode: 'cors',
  cache: 'default'
};

fetch('xxxxx.jpg', init)
.then(response => {
  // XXXX
});

Request

var request = new Request(url/request[, options]);
Request 参数和 fetch 参数雷同

Headers

var headers = new Headers([init])
init 可所以一个平常对象或许是一个 Headers 对象

Headers对象有以下要领

append(key, value)
delete(key)
entries()  返回一个遍历器，相似二维数组，每个 key 和它对应的 value 构成一个数组
get(key) 猎取指定 key 的value，假如key被增加了屡次，则返回第一次增加时的 value
getAll(key) 返回 key 对应的一切 value，构成一个数组
has(key)
keys() 一切 key 构成的遍历器
set(key, value) 变动 key 的值，假如 key 不存在，则相当于 append
values() 一切 value 构成的遍历器

Body

Request 和 Response 都完成了 Body 的功用，Body 的要领在下面 Response 中详解

Response

var response = new Response([body][, init])
很少用到 new Response 平常是作为 fetch 返回的效果

response 有以下属性，都是只读的

headers
ok  status在 200 和 299 之间为 true
redirected  Boolean
status
statusText
type   basic / cors / error / opaque
url
bodyUsed

有以下要领

clone()
error()
redirect()

从 Body 完成的要领
arrayBuffer()
blob()  将body 剖析为Blob文件，返回一个 promise
formData()
json()  将body 剖析为json，返回一个 promise
text()  将body 剖析为字符串，返回一个 promise

参考：
https://www.w3ctech.com/topic…
https://developer.mozilla.org…