主页 / coding / 问题 / 79182676
Accepted
Paul
Asked: 2024-11-13 04:52:48 +0800 CST

Typescript 和 AxiosError：当出现 AxiosError 时，Axios 有两个嵌套响应而不是一个

  • 772

我的 api 在任何地方都运行良好，除了当我尝试执行 if 块以解决潜在的 Axios 错误时。这是因为status在 中使用了 isresponse.response.status而不是response.statustypescript 会抛出错误Property 'response' does not exist on type 'AxiosResponse<any, any>'.

有人能帮我吗？

在没有 AxiosError 的情况下工作：

postBoundary: async (boundary: CreateBoundary) => {
    const response = await axios.post(
      `${config.baseApiPath}boundary`,
      boundary
    );
    return response.data; //returns correctly
  }

无法使用 Axios 出现错误：

postBoundary: async (boundary: CreateBoundary) => {
        const response = await axios.post(
          `${config.baseApiPath}boundary`,
          boundary
        );
        // when response has an Axios error response.status 
        // doesn't exist because there are two nested responses
        if (response.response.status === 
            HttpStatusCode.PayloadTooLarge) {
             throw new Error("Error");
         }
        return response.data;
        }
reactjs

1 个回答

  1. Best Answer

    这是因为当 Axios 请求失败时，错误对象的结构与成功响应不同。

    import { AxiosError, HttpStatusCode } from 'axios';

postBoundary: async (boundary: CreateBoundary) => {
  try {
    const response = await axios.post(
      `${config.baseApiPath}boundary`,
      boundary
    );
    return response.data;
  } catch (error) {
    // First check if it's an AxiosError
    if (error instanceof AxiosError) {
      // Now we can safely access error.response
      if (error.response?.status === HttpStatusCode.PayloadTooLarge) {
        throw new Error("Payload too large");
      }
    }
    // Re-throw any other errors
    throw error;
  }
}
    • 0

相关问题