时间戳

首页 > 解决方案 > 没有处理 React 的斜杠

javascript - 没有处理 React 的斜杠

问题描述

我有一个问题，网址 /covid19/ 有效，但 /covid19 无效（末尾没有斜线）。

当您检查网络请求时，似乎请求是针对 / 而不是 /covid19/

/covid19（无斜线）

在此处输入图像描述

/covid19/（带斜线）

在此处输入图像描述

我不确定这是否与 React 的路由器有关，这是我的配置：

ReactDOM.render(
  <React.StrictMode>
    <Router history={history}>
      <Route path={"/covid19"} component={dashboard}/>
      <Route path={"/"} component={dashboard}/>
    </Router>
  </React.StrictMode>,
  document.getElementById('root')
);

该网站是： https ://datcom-website.uc.r.appspot.com/covid19/

我的服务器在 App Engine 实例上运行。

标签： javascriptreactjsgoogle-app-engineroutesreact-router

解决方案

问题在于如何在 HTML 中包含脚本，而不是任何与 JS 或 React 相关的内容。

您的脚本来源是相对的 - ./path-to-script; 这使得它依赖于 URL。因此，从页面domain.com/exampleA到脚本的路径是domain.com/path-to-script，但是一旦您在 URL 中添加另一个级别，甚至只是一个斜杠，相对路径就会改变。例如，domain.com/exampleA/生成路径domain.com/exampleA/path-to-script。

您应该改用绝对路径。在大多数情况下，只需.在开头删除就足够了。以 a 开头的源路径/意味着它位于域的根级别。因此，无论 URL 是什么，源/path-to-source总是会产生。domain.com/path-to-script

因此，对于您的用例，您的脚本似乎需要更改为

<script src="/covid19/static/js/2.8cd0c9f0.chunk.js"></script>
<script src="/covid19/static/js/main.05f82414.chunk.js"></script>

推荐阅读