导航出同一主机上的 react-router 单页应用程序 [英] Navigating out of a react-router single page application on the same host

问题描述

我正在尝试设置将用户带出当前 SPA 并进入另一个 SPA(或下载 pdf)的链接.

I'm trying to set up links that take the user out of the current SPA and into another one (or download a pdf).

我已经尝试使用 <a> 标签，但是每当我导航到我不想再进入 SPA 的路径时，它都会显示我使用的 SPA 的基本布局卡在里面.

I've tried using <a> tags, however whenever I navigate to the paths were I want to not be in the SPA anymore, it shows the basic layout of the SPA I'm stuck in.

如果我在正确的路径上硬刷新，我会看到另一个 SPA，在另一种情况下，我正在尝试查看 pdf.

If I hard refresh on the proper paths, I see the other SPA, and in another case the pdf I'm trying to view.

示例锚元素:

路由器代码:

ReactDOM.render(
  <Provider store={store}>
    <ConnectedRouter history={history}>
      <Route path="/" component={App(Main)} />
    </ConnectedRouter>
  </Provider>,
  document.getElementById('root')
);

我使用 create react app 生成了两个 SPA.我还尝试注释掉 Service Worker 代码，以防出现问题.

I generated the both SPAs with create react app. I also tried commenting out the service worker code, in case that was causing the issue.

我使用 nginx 反向代理为两个 SPA 提供服务.

I'm serving both SPAs using nginx reverse proxy.

我也试过 window.location.reload(true) 来强制重新加载，但它仍然不起作用.我必须打开 chrome 检查器和 cmd + shift + r 才能完全重新加载.

I've also tried window.location.reload(true) to force a hard reload, but it still does not work. I have to have chrome inspector open and cmd + shift + r to get a full hard reload.

推荐答案

即使我停止了 service worker 的加载，它仍然被注册到页面(不确定它是否正确).我必须确保服务工作没有注册，然后我的导航按预期工作.

Even though I stopped the service worker from loading, It was still registered (not sure if that it the right word) to the page. I had to ensure the service working was not registered, then my navigation worked as expected.

幸运的是，create-react-app 内置了一个很好的函数来取消注册 Service Worker.

Luckily, create-react-app has a nice function built in to unregister the service worker.

下一步是弄清楚如何保留 Service Worker，但要指定始终传递到服务器的 url.

A next step would be to figure out how to keep the service worker, but specify urls to always pass through to the server.

这篇关于导航出同一主机上的 react-router 单页应用程序的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！