axios如何获取后端接口返回的状态码以及相关信息

Question

如题：axios如何获取后端接口返回的状态码以及相关信息

axios返回的有两个函数

axios.get("/internal/user/check_mobile_and_sent_code",{withCredentials:true,params:{mobile:formInline.mobile}}).then(res=>{
                        console.log(res);
                        //if(res.result==true){
                            if (!this.timer) {
                                this.count = this.TIME_COUNT;
                                this.show = false;
                                this.timer = setInterval(() => {
                                    if (this.count > 0 && this.count <= this.TIME_COUNT) {
                                        this.count--;
                                    } else {
                                        this.show = true;
                                        clearInterval(this.timer);
                                        this.timer = null;
                                    }
                                }, 1000)
                            }
                        //}
                    }).catch(error=>{
                        console.log(error);
                    })

我想判断当 返回400或者500的时候 输出相应的返回信息，请问大神们该怎么判断呀？
console.log(error);这个error返回的是这个：

而后台实际返回的是这个：

{
  "timestamp": "2017-09-15T08:30:56Z",
  "status": 400,
  "error": "Bad Request",
  "exception": "com.xinwenhd.common.utils.BadReqExcption",
  "message": "Bad Request",
  "path": "/internal/user/check_mobile_and_sent_code",
  "errorMassage": "手机号已存在",
  "errorCode": "MOBILE_EXIST"
}

Answer 1

axios.get('/user/12345')
  .catch(function (error) {
    if (error.response) {
      // The request was made and the server responded with a status code
      // that falls out of the range of 2xx
      console.log(error.response.data);
      console.log(error.response.status);
      console.log(error.response.headers);
    } else if (error.request) {
      // The request was made but no response was received
      // `error.request` is an instance of XMLHttpRequest in the browser and an instance of
      // http.ClientRequest in node.js
      console.log(error.request);
    } else {
      // Something happened in setting up the request that triggered an Error
      console.log('Error', error.message);
    }
    console.log(error.config);
  });

Handling Errors https://github.com/mzabriskie...

Answer 2

返回值 res 就是包含 status 的对象， 直接使用if(res.status === 400)就是了。

{
  "timestamp": "2017-09-15T08:30:56Z",
  "status": 400, // 看这里
  "error": "Bad Request",
  "exception": "com.xinwenhd.common.utils.BadReqExcption",
  "message": "Bad Request",
  "path": "/internal/user/check_mobile_and_sent_code",
  "errorMassage": "手机号已存在",
  "errorCode": "MOBILE_EXIST"
}

Answer 3

error.response.status 就是了

Answer 4

常规的HTTP状态码本身有意义

• 2XX：请求成功
• 3XX：重定向
• 4XX：客户端错误
• 5XX：服务器端错误

根据问题并结合自身工作开发经验，我觉得题主可能需要一个封装过的返回结果，简单来说就是除了通信问题外的自定义错误情况(比如问题中的400 —— 手机号已存在)放在一个data字段中，然后包在200的http码中返回给到前端

{
    code: 200,
    data: {
        timestamp: '',
        status: 400,
        errorMessage: '手机号已存在'
        // ...
    }
}

类似于这种格式的返回结果，当然这只是一种思路。