TypeScript中使用Axios捕获错误时无法获取错误类型的问题排查

可能的原因及对应解决方法 #

1. postRequest 函数未明确错误抛出类型 #

如果你的postRequest是基于Promise封装的，但没有在函数返回类型里明确错误泛型参数，TypeScript会默认把catch捕获的错误推断为any。

错误示例：

async postRequest(url: string, data: any): Promise<ProjectResponse> {
  return fetch(url, {
    method: 'POST',
    body: JSON.stringify(data)
  }).then(res => {
    if (!res.ok) throw new Error(res.statusText);
    return res.json();
  });
}

解决方式：定义自定义错误类，并在函数中明确抛出该类型错误：

// 自定义请求错误类型
class RequestError extends Error {
  statusCode?: number;
  constructor(message: string, statusCode?: number) {
    super(message);
    this.statusCode = statusCode;
    this.name = 'RequestError';
  }
}

// 修正后的postRequest函数
async postRequest(url: string, data: any): Promise<ProjectResponse> {
  return fetch(url, {
    method: 'POST',
    body: JSON.stringify(data)
  }).then(res => {
    if (!res.ok) throw new RequestError(res.statusText, res.status);
    return res.json();
  });
}

2. 调用时未给catch块的错误参数指定类型 #

即便函数内部抛出了明确类型的错误，在复杂Promise链中，TypeScript可能无法自动推断错误类型，需要手动指定。

错误示例：

projectService.postRequest('/api/projects', projectData)
  .then(res => console.log(res))
  .catch(err => {
    // err 类型为 any
    console.log(err.statusCode);
  });

解决方式：手动指定错误参数的类型：

projectService.postRequest('/api/projects', projectData)
  .then(res => console.log(res))
  .catch((err: RequestError) => {
    console.log(err.statusCode);
  });

3. 迁移postData时丢失类型定义 #

如果原postData函数有明确的错误处理类型，迁移到Project Service时可能遗漏了相关类型声明或自定义错误类的引入，导致TypeScript无法识别错误类型。

解决方式：检查迁移后的代码，确保所有相关类型定义、自定义错误类都被正确引入，函数的返回类型和错误抛出逻辑与原函数保持一致。

4. 依赖未类型化的第三方工具 #

如果postRequest内部使用了无TypeScript类型定义的第三方请求库，或者封装的工具函数返回的Promise未明确错误类型，也会导致catch块错误为any。

解决方式：

• 安装对应库的类型定义包（如@types/xxx）
• 对第三方库的调用进行类型包装，明确返回Promise的错误类型

内容的提问来源于stack exchange，提问作者Bertug