axios 重定向问题解决,反应路由器+ Axios拦截器。如何进行重定向？

末蓝、 2022-08-30 11:12 940阅读 0赞

![Image 1][]

I have an axios interceptors and when a user gets forced logged out(because of expired token) I want to go back to my home page.

I am not sure how to pass react router to it though. I am using mobx but not sure if that will help me with this problem.

export const axiosInstance = axios.create(\{

baseURL: 'https://localhost:44391/api',

timeout: 5000,

contentType: "application/json",

Authorization: getAuthToken()

\})

axiosInstance.interceptors.response.use(function (response) \{

return response;

\}, function (error) \{

const originalRequest = error.config;

if(error.code != "ECONNABORTED" && error.response.status === 401 && !originalRequest.\_retry)\{

originalRequest.\_retry = true;

return axiosInstance.post("/tokens/auth",\{

"refreshToken": getRefreshToken(),

"grantType": "refresh\_token"

\}).then(response => \{

localStorage.authentication = JSON.stringify(response.data);

updateAuthInstant();

return axiosInstance(originalRequest)

\});

\}

return Promise.reject(error);

\});

解决方案

You should add the history npm package. With this you can create the browser history and use this within other places of your application.

For example:

// routing.js

import createHistory from 'history/createBrowserHistory';

export const history = createHistory();

In your component that contains your routes.

import \{ Route, Router \} from 'react-router-dom';

import \{ history \} from './routing.js';

import ComponentA from './ComponentA';

import ComponentB from './ComponentB';

const Routes = () => (

);

And in your other file in which you want to control the routing:

import \{ history \} from './routing.js';

function changeRoute() \{

// things happening here..

history.push('/route2');

\}

When calling changeRoute() the path is updated to /route2 and ComponentB will be rendered.

[Image 1]:

发表评论取消回复

表情：

评论列表（有 0 条评论，940人围观）

还没有评论，来说两句吧...

相关阅读

相关 SpringMvc如何进行转发和重定向

转发和重定向是页面跳转的二种实现方式 > 转发（forward）：客户端发出请求，服务器接收到该请求，并直接做出相应的处理后进行页面跳转（在服务器端直接完成）。 > 重定向

﹏ヽ暗。殇╰゛Y/ 2023年07月04日 03:30/ 0 赞/ 12 阅读

相关 java 如何在拦截器重定向,反应路由器+网络拦截器。如何进行重定向?

我有一个多线程拦截器,当用户被迫注销(因为过期令牌),我想回到我的主页。但我不知道如何将react路由器传递给它。我正在使用mobx,但不确定这是否能帮助我解决这个问题。

谁借莪１个温暖的怀抱￠/ 2023年01月15日 11:28/ 0 赞/ 101 阅读

相关 axios 重定向问题解决_Axios是否有能力检测重定向？

![Image 1][] The Response interface of the Fetch API has a read-only flag, redirected,

ゝ一纸荒年。/ 2023年01月08日 06:23/ 0 赞/ 140 阅读

相关重定向 php_如何使用PHP重定向

重定向 php A [PHP][] forwarding script is useful if you want to [redirect one page][] to a

小灰灰/ 2022年12月06日 15:42/ 0 赞/ 189 阅读

相关 axios 重定向问题解决,反应路由器+ Axios拦截器。如何进行重定向？

![Image 1][] I have an axios interceptors and when a user gets forced logged out(becaus

末蓝、/ 2022年08月30日 11:12/ 0 赞/ 941 阅读

相关重定向

标准输入,输出和错误 \--------------------------------- 文件文件描述符 \-----------

淡淡的烟草味﹌/ 2022年08月06日 10:23/ 0 赞/ 284 阅读

相关重定向

MSDN 中查找关键字：WOW64 可搜得相关信息（文件重定向和注册表重定向）转自：[http://blog.csdn.net/is2120/article/deta

你的名字/ 2022年06月03日 09:27/ 0 赞/ 335 阅读

相关重定向

package cn.itcast.response; import java.io.IOException; import jav

谁借莪１个温暖的怀抱￠/ 2022年05月16日 06:18/ 0 赞/ 310 阅读

相关拦截器无限循环重定向（Spring Boot）

前言：当遇到拦截器无限循环重定向这种问题的时候，一般都是拦截器设置错了情况一：没有配置排除拦截路径，就是说全部路径都拦截了，导致一直重定向。情况二：配置排除拦截路径

刺骨的言语ヽ痛彻心扉/ 2022年04月03日 08:52/ 0 赞/ 252 阅读

相关重定向

第一种：利用header()函数进行重定向，这也是我用的较多的。(注意！locationhe和“：”之间不能有空格，否则无作用！) <?php header('conte

小灰灰/ 2022年01月06日 03:45/ 0 赞/ 346 阅读