Fetch发送请求方式

Fetch发送请求方式

除了xhr方式（JQuery和axios都基于xhr）发送请求以外，还有Fetch方式发送请求

github 地址：https://github.com/github/fetch

老版本的浏览器可能不支持

Fetch关注分离

未优化版本

fetch('').then(
  //第一次先判断能否联系上服务器
	response => {
    console.log('联系服务器成功');
    return response.json();
  },
  error => {
    console.log('联系服务器失败',error);
    return new Promise(() =>{})
  }
).then(
  //第二次在判断是否能取数据
	response => {console.log('获取数据成功了',response);),
  error => {console.log('获取数据成功了',response);}
)

优化版本

fetch('').then(
  //第一次先判断能否联系上服务器
	response => {
    console.log('联系服务器成功');
    return response.json();
  },
).then(
  //第二次在判断是否能取数据
	response => {console.log('获取数据成功了',response);),
).catch(
	error =>{console.log('请求出错',error);}
)

使用await,记得方法中要加async

try {
  const response = await fetch('')
	const data = await response.json()
	console.log(data)
} catch(error){
  console.log(error);
}