无法从 React Native 中的 Axios 响应中获取错误消息答案

【问题标题】：Can't Get Error Message From Axios Response in React Native无法从 React Native 中的 Axios 响应中获取错误消息
【发布时间】：2019-11-02 17:32:16
【问题描述】：

我正在使用 React Native 编写移动应用程序。在某些情况下，我需要发送一个发布请求并获得包括错误部分的响应。因此，对于某些特定输入，API（我自己的）返回 409 和一条消息。示例返回：

{
    "status": 409,
    "message": "E-mail is already exists!"
}

在这里，我想接收该消息并显示给用户。这是我尝试过的：

UserService.signup({ fullName, email, username, password })
  .then(response => {
    this.setState({ signUp: true });
    if (response.result) {
      Toast.show(messages.successfulSignUp, {
        backgroundColor: "green",
        duration: Toast.durations.LONG,
        position: Toast.positions.TOP
      });
      this.props.navigation.navigate("SignIn");
    } else {
    }
  })
  .catch(error => {
    Toast.show(error.message, {
      backgroundColor: "red",
      duration: Toast.durations.LONG,
      position: Toast.positions.TOP
    });
    this.setState({ signUp: false });
  });

我尝试了error.message, error.response, error, error.data 键，但它总是显示TypeError: undefined is not an object (evaluating 'error.message')。那么，如何从错误对象中获取消息呢？

编辑：这就是我发送请求的方式：

import { post } from "./api";

export default {
  signup: ({ fullName, email, username, password }) => {
    return post("/user/register", { fullName, email, username, password });
  }
};

export const request = config => {
  return new Promise((resolve, reject) => {
    axiosInstance
      .request({
        url: config.url,
        method: config.method || "get",
        data: config.body,
        headers: {
          "Content-Type": "application/json",
          "X-Auth-Token": store.getState().auth.token
        }
      })
      .then(response => {
        resolve(response.data);
      })
      .catch(error => {
        reject(error.data);
      });
  });
};

export const post = (url, body = {}) => {
  return request({
    url,
    body,
    method: "post"
  });
};

【问题讨论】：

您可以记录所有密钥并查看是否有您要查找的密钥：for (key in error) console.log('key', key)。如果您找不到密钥，那么您可能没有从您的 api 发送正确的响应。
你能试试JSON.stringify(error) 吗？
@Vishnudev 正如我所说，它返回 undefined
你的服务应该有问题，返回Promise@JollyRoger？
@Clarity 没有进入for循环。不，我发送了正确的响应，因为我打印了我在 Web 服务中返回的内容并且没有问题。

标签： javascript react-native axios

【解决方案1】：

根据后端返回的内容，axios中的错误信息在错误对象的response.data中。

.catch(error => {

    const errResponse = (error && error.response && error.response.data) 
     || (error && error.message); 

    reject(errResponse);
});

【讨论】：

不幸的是没有用。它返回：Possible Unhandled Promise Rejection (id:1): TypeError: undefined is not an object (evaluationg 'error.response')
在这里查看演示 snack.expo.io/@lekgwaraj/sadistic-truffle
我明白了，但是当使用这个代码时，我得到了Possible Unhandled Promise Rejection (id:1): TypeError: undefined is not an object (evaluationg 'error.response.data' 错误。

【解决方案2】：

最后我解决了这个问题。我不得不更改我的请求方法以及我处理错误的方式：

export const request = (config) => {
    return new Promise((resolve, reject) => {
        axiosInstance.request({
            url: config.url,
            method: config.method || 'get',
            data: config.body,
            headers: {
                'Content-Type': 'application/json',
                'X-Auth-Token': store.getState().auth.token,
            }
        }).then(response => {
            resolve(response.data)
        }).catch(error => {
            reject(error.response)
        })
    })
}

// This is how reach out to the error message:
console.log(error.data.message);

【讨论】：