js fetch处理异步请求

Posted 2020-10-22 xuetp

以往一直认为异步请求只能使用原生js的XMLHttpRequest或jQuery的$.ajax()、$.post()等框架封装的异步请求方法

原来js还提供fetch来替代XMLHttpRequest，详情可见 https://developer.mozilla.org/en-US/docs/Web/API/Fetch_API/Using_Fetch

fetch 规格不同于  jQuery.ajax() 主要有两个方面牢记：

• 即使响应是HTTP 404或500，返回的Promise fetch() 也不会拒绝HTTP错误状态。相反，它将正常解析（ok状态设置为false），它只会拒绝网络故障或阻止要求完成。
• 默认情况下， 如果站点依靠维护用户会话（发送cookie，必须设置credentials init选项），  fetch 则不会发送或接收来自服务器的任何cookie，从而导致未经身份 验证的请求。

1 fetch(‘https://api-to-call.com/endpoint‘).then(response => {
2   if(response.ok){
3     return response.json();
4   }
5   throw new Error(‘Request failed!‘);
6 } , networkError => console.log(networkError.message)
7 ).then(jsonResponse => jsonResponse)