React：从 FUNCTION 而不是 COMPONENT 重定向到新页面（使用 React Router）答案

【问题标题】：React: Redirect to new page from FUNCTION not from COMPONENT (working with React Router)React：从 FUNCTION 而不是 COMPONENT 重定向到新页面（使用 React Router）
【发布时间】：2019-12-30 20:38:24
【问题描述】：

我有一个使用 setInterval 计时器运行的函数。它的目的是询问服务器我在本地存储中的登录名/会话 ID 是否仍然有效。如果会话已过期，我想发出警报并路由到登录页面。

我通常会使用this.props.history.push("/login") 之类的东西来完成重定向。但这不能是组件；由 setInterval 运行，它必须是一个函数。 React-Router history.push 选项在组件之外不可用，AFAIK。我最好的选择是什么？

这是登录时发生的 setInterval 代码：

sessionStorage.setItem('mycha_sessionID',returnData.data.sessionID)
let intervalID = setInterval(CheckSession,1*30*1000)
sessionStorage.setItem('intervalID',intervalID)

以及将在每个间隔运行的功能代码：

import {axiosGet} from "./AxiosCalls";
import {ClearSession} from "./ClearSession";

export function CheckSession() {
    // Call Wordpress to see if the current session ID is still valid
    if (sessionStorage.getItem('mycha_sessionID')) {
        axiosGet(sessionStorage.getItem('mycha_base_url')+"/wp-json/mycha/check-session")
            .then(res => {
                if ((false === res.data) || ("" === res.data)) {
                    ClearSession()
                    alert("Your login session has expired.  Please log in again before continuing.")
                    // Redirect to Login here
                }
            })
            .catch(err => alert(err));
    }

    return
}

【问题讨论】：

我可能会误会，但为什么不直接打电话给window.location.href = 'https://www.my-site.com/login'
谢谢你，巴里曼。我默认使用 React-ish 方式来处理这个问题，而不是考虑普通的 JS 技术。我刚刚测试过，这似乎确实解决了我的部分问题。我将进一步测试以确保我没有创建新问题来替换它。 :-)
@Barryman9000，这对我来说效果很好。非常感谢你。我最终使用了window.location.pathname = '/login' 而不是.href。无论是在我的测试环境还是生产环境中运行，都可以让相同的代码工作，而无需指定 url 的基域。 :-)
太棒了！我添加了一个答案，因此您可以将此帖子标记为已回答。

标签： reactjs redirect

【解决方案1】：

我可能会误会，但为什么不直接打电话 window.location.href = 'https://www.my-site.com/login'

【讨论】：