首页
学习
活动
专区
圈层
工具
发布
社区首页 >问答首页 >未处理的运行时错误AxiosError: next.js中状态代码401的请求失败

未处理的运行时错误AxiosError: next.js中状态代码401的请求失败
EN

Stack Overflow用户
提问于 2022-10-06 20:01:01
回答 1查看 170关注 0票数 0

我用的是Next.js。我已经创建了一个Axios拦截器,其中将返回一个被拒绝的承诺。但是我需要一个特定于服务器的错误。Next.js正在显示应用程序中的错误,如下所示。

还有Axios拦截器和实例的代码。

代码语言:javascript
复制
import axios from "axios";
import store from "../redux/store";
import getConfig from 'next/config';
const { publicRuntimeConfig } = getConfig();

let token = "";
if (typeof window !== 'undefined') {
  const item = localStorage.getItem('key')
  token = item;
}
const axiosInstance = axios.create({
  baseURL: publicRuntimeConfig.backendURL,
  headers: {
    Authorization: token ? `Bearer ${token}` : "",
  },
});

axiosInstance.interceptors.request.use(
  function (config) {
    const { auth } = store.getState();
    if (auth.token) {
      config.headers.Authorization = `Bearer ${auth.token}`;
    }
    return config;
  },
  function (error) {
    return Promise.reject(error);
  }
);

axiosInstance.interceptors.response.use(
  (res) => {
    console.log(res)
    return res;
  },
  (error) => {
    console.log(error)
    return Promise.reject(error);
  }
);

export default axiosInstance;

另外,我正在使用redux,这是操作。

代码语言:javascript
复制
import axios from "../../api/axios";
import { authConstants } from "../types";

export const login = (data) => {
  return async (dispatch) => {
    try {
      dispatch({
        type: authConstants.LOGIN_REQUEST,
      });
      const res = axios.post("/user/login", data);
      if (res.status === 200) {
        dispatch({
          type: authConstants.LOGIN_SUCCESS,
          payload: res.data,
        });
      }
    } catch (error) {
      console.log(error, authConstants);
      dispatch({
        type: authConstants.LOGIN_FAILURE,
        payload: { error: error.response?.data?.error },
      });
    }
  };
};
EN

回答 1

Stack Overflow用户

回答已采纳

发布于 2022-10-07 05:56:54

你的问题在这里..。

const = axios.post("/user/login",data);

你错过了await等待响应

代码语言:javascript
复制
const res = await axios.post("/user/login", data);

这能解决两件事..。

  1. ,您的代码现在等待响应,下一行的res.status将被定义为
  2. ,任何由Axios引发的错误(表面为被拒绝的承诺)都将触发catch块。如果没有await,这种情况就不会发生,任何最终的承诺失败都会出现在顶级的Next.js错误处理程序上,从而导致屏幕截图中的弹出.

票数 2
EN
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接:

https://stackoverflow.com/questions/73979442

复制
相关文章

相似问题

领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档