如何为登录页面添加 reactjs 路由器

Posted 2023-02-21

【中文标题】如何为登录页面添加 reactjs 路由器

【英文标题】：How to add a reactjs router for a landing page

【发布时间】：2019-01-12 01:41:41

【问题描述】：

我需要能够登陆页面以验证用户电子邮件并让他们根据电子邮件发送的令牌更改密码，因此我尝试添加一个反应路由器，例如：

<Route exact path="/" component=Home />
<Route exact path="/users" component=About />
<Switch>
   <Route exact path="/users/activation" component=About />
   <Route exact path="/users/recoverpassword" component=About />
   <Route exact path="/users/activation/:atoken" component=Activation />
   <Route exact path="/users/recoverpassword/:ptoken" component=PasswordRecovery />
</Switch>

但它只有在我首先登陆初始页面 website.com/ 页面并转到 /users 而不是 /users/activation 和 /users/activation/123 时才有效

如果我直接登陆 /users/activation/123 它会显示 nginx 404

404 Not Found
nginx/1.4.6 (Ubuntu)

不确定它是否与 nginx 缓存、service-worker.js 或它自己的路由器有关。

如何拥有多个登陆路由器？

【问题讨论】：

看起来 nginx 设置有问题。看看this question。

非常感谢@FK82，将此添加到我的nginx默认配置中解决了这个问题：location / try_files $uri /index.html;

【参考方案1】：

应该是nginx缓存或者配置的问题。尝试修改 NGINX。

【参考方案2】：

你可以试试这个

     <BrowserRouter  >
                     <Route push=true path="/users/activation/:atoken" component=Activation/> 
      </BrowserRouter>