Navigating out of a react-router single page appli

问题:

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

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.

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

Example anchor element: <a href="/requirements" rel="external" target="_blank">

Router code:

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

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.

I'm serving both SPAs using nginx reverse proxy.

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.

回答1:

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.

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

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