在用react构建的网站中服务另一个（独立）页面或静态文件

Question

我有一个使用React构建的网站，该网站使用react-
router。对于某些路由，我想提供另一个页面或静态文件，但是由于所有请求都已转发给路由器，因此它不起作用。

例如

www.myapp.com/sitemap.xml
www.myapp.com/something.html

^这些链接第一次起作用，但是一旦我加载网站，它就不起作用，因为所有请求都通过反应路由器进行。

任何使其始终可用的解决方案。谢谢。

编辑

我正在使用配置为将所有请求重定向到index.html的apache服务器，我想这就是这种行为的原因。这是我的配置，但我不知道如何解决。

Options -MultiViews
RewriteEngine On

RewriteCond %{HTTPS} off
RewriteRule (.*) https://%{HTTP_HOST}%{REQUEST_URI} [R,L]

RewriteCond %{REQUEST_FILENAME} !-f
RewriteRule ^ index.html [QSA,L]

更新 我尝试了答案中建议的解决方案。

我的路线看起来像这样，对于something.html我正在加载ServerLoad组件

<Switch>
    <Route exact path="/" component={Home} />
    <Route path="/about" component={About} />
    <Route path="/about" component={About} />
    <Route path="something.html" component={ServerLoad} />
    <Route component={NoMatch} />
</Switch>

在ServerLoad组件的componentDidMount函数中，我这样做了。但这是行不通的。

componentDidMount() {
    window.location.reload(true);
}

更多信息 我已经使用create-react-app设置了这个项目，并通过Express
server（像这样）提供了服务。我不确定是否需要对服务器上的其他静态文件进行一些设置。

Answer 1

这应该工作：

const reload = () => window.location.reload();

<Router>
  // all your routes..
  ...

  // Your special routes..
  <Route path="/sitemap.xml" onEnter={reload} />
  <Route path="/something.html" onEnter={reload} />
</Router>

因此，我认为这应该很清楚；）

更新：

如果这是一个选项，则只需将 target =“ _ blank” 属性放入您的<Link>

恕我直言，这从UX角度来看甚至更好，因为如果这些路由不是您的主应用程序的一部分，则用户可以在访问该 特殊 页面后仅切换Tab 。