时间戳

首页 > 解决方案 > 在 Axios 拦截器下捕获 400 和 500 用于哨兵

next.js - 在 Axios 拦截器下捕获 400 和 500 用于哨兵

问题描述

通过显示错误弹出窗口，使用 Axios 拦截器以通用方式处理 400 和 500。通常，当自定义 _error.js 页面由于 JS 错误而呈现时，会触发 Sentry 调用。如何在哨兵中记录 API 调用错误？

标签： next.jssentry

解决方案

您可以使用 axios 拦截器，也可以将其写入 axios 调用本身的 catch() 中。

拦截器

axios.interceptors.response.use(
  (response: AxiosResponse) => response,
  (error: AxiosError) => {
    Sentry.captureException(error);
    return Promise.reject(error);
  },
);

Axios 调用

axios({
      url,
      method,
      ...
    })
      .then(async (response: AxiosResponse) => {
        resolve(response.data);
      })
      .catch(async (error: AxiosError) => {
        Sentry.captureException(error);
        reject(error);
      });

推荐阅读