首页 > 解决方案 > 如何删除控制台中显示的 `GET http://localhost:5000/api/users/profile 401 (Unauthorized)`?

问题描述

我正在为我的 Vue Web 应用程序设置刷新和访问令牌系统。http://localhost:5000/api/users/profile是我的 POST 请求的 URL。当有人尝试访问并且他们的访问令牌已过期时,我预计会出现错误。我使用 Axios 的拦截器,以便在出现此类错误时生成全新的访问令牌。一切正常。但是,我花了很多时间试图弄清楚如何摆脱GET http://localhost:5000/api/users/profile 401 (Unauthorized)控制台。有没有办法摆脱它?任何帮助,将不胜感激。

获取个人资料:

getProfile: async (context) => {
     context.commit('PROFILE_REQUEST')

     let res = await axios.get('http://localhost:5000/api/users/profile')
     context.commit('USER_PROFILE', res.data.user);

     return res;
}

拦截器:

axios.interceptors.response.use((res) => {
        return res;
    }, async (err) => {
        const originalRequest = err.config;

        if (err.response.status === 401 && !originalRequest._retry) {
            originalRequest._retry = true;

            const refreshToken = Cookies.get('jid');

            return axios.post('http://localhost:5000/api/users/refresh-token', { refreshToken }).then((res) => {
                axios.defaults.headers.common['Authorization'] = `Bearer ${res.data.accessToken}`;
                originalRequest.headers['Authorization'] = `Bearer ${res.data.accessToken}`;
                originalRequest.baseURL = undefined;
                return axios(originalRequest);
            })
        }
        return Promise.reject(err);
    });
}

标签: vue.jsvuejs2axios

解决方案


推荐阅读