Fetch概念:
fetch号称是AJAX的替代品,是在ES6出现的,使用了ES6中的promise对象。Fetch是基于promise设计的。Fetch的代码结构比起ajax简单多了,参数有点像jQuery ajax。
但是,一定记住 fetch不是ajax的进一步封装,而是原生js,没有使用XMLHttpRequest对象。
一个简单的Fetch请求例子:
但是,一定记住 fetch不是ajax的进一步封装,而是原生js,没有使用XMLHttpRequest对象。
一个简单的Fetch请求例子:
fetch(url).then(function(response){
1.res.arrayBuffer()
arrayBuffer() 方法会返回一个promise,可以解决一个ArrayBuffer
2.res.blob()
blob() 方法将返回一个promise,使用一个Blob解决
3.res.formData()
formData() 方法返回一个Promise,它使用一个FormData对象来解决
4.res.json()
json() 方法返回解析正文文本为JSON的结果。这可以是任何可以由JSON表示的东西:对象、数组、字符串、数字等等
5.res.text()
text() 方法返回一个promise,使用一个USVString解决
Fetch请求的缺点:
1)fetch只对网络请求报错,对400,500都当做成功的请求,服务器返回 400,500 错误码时并不会 reject,只有网络错误这些导致请求不能完成时,fetch 才会被 reject。 2)fetch默认不会带cookie,需要添加配置项: fetch(url, {credentials: 'include'}) 3)fetch不支持abort,不支持超时控制,使用setTimeout及Promise.reject的实现的超时控制并不能阻止请求过程继续在后台运行,造成了流量的浪费 4)fetch没有办法原生监测请求的进度,而XHR可以
参考:
https://www.jianshu.com/p/8bc48f8fde75
https://blog.csdn.net/WU5229485/article/details/85219165
https://www.w3cschool.cn/fetch_api/fetch_api-w7mt2jzc.html