现代JS学习笔记:网络请求Fetch

Posted by Mars . Modified at

学习内容:《现代JavaScript教程》

网络请求fetch()

可以使用fetch()方法请求任何URL的网络资源。语法如下:

let promise = fetch(url, [options])
  • url —— 要访问的 URL。
  • options —— 可选参数:method,header 等。

使用Fetch请求资源,一共分为两步:

【第一步】服务器返回响应头部header,fetch使用内建的Response Class来对响应头部进行解析,返回的是一个promise对象。(如果fetch过程没有发生错误) 此时还没有获取到响应主体,只是获取到了Header。这样做是为了提前发现请求中的错误,防止资源浪费。Response对象有几个属性:

  • header —— 返回的头部信息;
  • ok —— 是否成功响应的布尔值,如果 HTTP 状态码为 200-299,则为 true;
  • status —— HTTP 状态码,例如 200。

【第二步】 得到了resolve的Response对象,可以继续利用这个对象内部的方法,进一步获取响应主体。方法如下:

  • response.text() —— 读取 response,并以文本形式返回 response,
  • response.json() —— 将 response 解析为 JSON,
  • response.formData() —— 以 FormData 对象的形式返回 response,
  • response.blob() —— 以 Blob(具有类型的二进制数据)形式返回 response,
  • response.arrayBuffer() —— 以 ArrayBuffer(低级别的二进制数据)形式返回 response,
  • 另外,response.body 是 ReadableStream 对象,它允许你逐块读取 body。
Keywords: JavaScript
previousPost nextPost
已经有 1000000 个小伙伴看完了这篇推文。