我正在将一个经典应用程序（仅服务器端页面呈现）转换为客户端应用程序（typescript+JSONAPI服务器中的前端应用程序）。该应用程序是相当后续，我正在转换它每页。新客户端应用程序正在使用react&react路由器。
我目前的状态是，一些页面在客户端处理，而其他页面仍在服务器端处理。在客户端和服务器端处理的页面之间，我遇到了历史导航的问题。
我知道最好的办法是使用 Link 以客户端页面和 a 以服务器页面为目标。不幸的是，有些链接被呈现为通用组件（例如列表），除非我在呈现链接之前检查每个url，看看路由是在客户端还是服务器端处理的，否则我无法知道是哪个组件( Link 或 a )使用。
因此，我选择了以下路由器：

<Switch>
        <Route path="/route/handled/by/client">
            <MyPageComponent />
        </Route>
        <Route path="/other/route/handled/by/client">
            <MyOtherPageComponent />
        </Route>
        <Route path="/route/handled/by/server">
            <ExternalPage />
        </Route>
        <Route>
            <NotFoundPage />
        </Route>
    </Switch>

以及以下 ExternalPage 组成部分：

import { useEffect } from "react"

import Loader from "./Loader"
import Page from "./Page"

export default function ExternalPage() {
    useEffect(() => {
        window.location.reload()
    })

    return (
        <Page title="Loading...">
            <section>
                <Loader />
            </section>
        </Page>
    )
}

这样，我只能使用 Link 代码中的组件并避免 a 尽可能多。所以当我导航到 /route/handled/by/server ，由于 ExternalPage 组成部分。但是，向后的历史记录无法正常工作：当我单击浏览器的“后退”按钮时，url会变回客户端页面url，但页面不会刷新（它会保留服务器页面内容）。
那么，有人知道如何让这段历史完美运作吗？有没有办法让浏览器明白，当从服务器页面返回到客户端页面时，它必须刷新页面？
提前感谢您的回答。
这是一份重新回购协议：https://github.com/vinorcola/test-client-server-router
导航到 http://localhost:3000/page-c ，然后单击 Page A (Server) ，然后从浏览器中单击“上一步”按钮。