fetch请求如何判断断网的情况及处理

fetchChange(url,oldPassword, newPassword) {

let formData = new FormData();
formData.append('tokenId',global.tokenId);
formData.append('oldPassword', oldPassword);
formData.append('newPassword', newPassword);
fetch(url,{
   method:'POST',
   headers:{
       'Content-Type':'multipart/form-data',
   },
   body:formData,
 })
 .then((response) => response.json())
 .then((responseJson)=>{console.log('123');
   if(responseJson.code && responseJson.code=='success') {
     Alert.alert(
      '提示',
      '密码修改成功 !',
      [
        {text: '返回', onPress: () => {
          const {goBack} = this.props.navigation;
          goBack();
          this.setEnable();
        }},
      ]
     )
   } else if(responseJson.errorCode){
     Alert.alert(
      '提示',
      responseJson.errorCode == 'incorrect_old_password' ? '原密码不正确' : responseJson.errorCode,
      [
        {text: '返回', onPress: () => {console.log('Cancel Pressed!');this.setEnable();}},
      ]
     )
   } else {console.log('123');
     alert('123');
   }
 }).catch((error)=>{console.log(error);alert('连接服务器出错');this.setEnable();});

}

这样写的一个修改密码请求,但是如果是断网情况如何判断,这样写断网也不会有任何反馈,一定要重新封装吗? 有没有快速点的方法直接在这段代码中修改一下就可以得到断网情况的反馈

阅读 7.9k
3 个回答

最终我用的时 Promise.race 赛跑模式达到目的
_fetchRequest() {

let timeoutAction = null;
const timerPromise = new Promise((resolve, reject) => {//resolve代表成功,reject代表失败
  timeoutAction = () => {
    reject(checkNetWork)//checkNetWork 只是一个全局变量字符串,表示在如果timeoutaction先运行了就调用reject失败方法,超时
  }
})

Promise.race([
    this.fetchRequestPromise(isExpress),//这个是你想要调用的借口
    timerPromise//这个是判断时间的function
]).then(
  (res) => console.log(res), //接收上面resolve中的参数
  (error) => {
    Alert.alert(
      '提示',
      error,
      [
        {text: '返回', onPress: () => {
          this.setState({disabled: false});
        }},
      ]
    )
  } //接收上面reject中的参数
);

setTimeout(()=>{
  timeoutAction()
}, waitTime);

}

navigator.onLine 可以判断网络连接状态

断网状态可以发生在任何一次网络请求,所以应该在异常操作里面处理。在异常里面判断是否是网络链接终端,如果是则可以发送广播,然后全局监听跳转到无网络界面。
自己写的工具类:https://github.com/wuyunqiang...

推荐问题