亚马逊网络服务放大ReactJS应用程序重新加载页面时出现问题

Question

我目前正在做一个全栈项目，主要使用ReactJS和AWS Amplify。我已经成功地部署了网站，但URL路由似乎只有在我从主页重定向的情况下才有效。我只能加载主页www.website.com，但我尝试手动键入www.website.com/login/，结果显示以下消息

<Error>
  <Code>AccessDenied</Code>

  <Message>Access Denied</Message>

  <RequestId>B2173BDEE0658858</RequestId>

  <HostId>
  TRevHdaqGZYTUxU9W1wXc3CQccfLeznHlYLcbuF+Wr511FVmOPFBp4tpyccJ2t5QMVpvYygNNb4=
  </HostId>
</Error>

我在其他StackOverflow页面上查找了解决方案，但似乎没有解决问题。

我尝试在亚马逊网络服务控制台提供的(Getting 403 ACCESS DENIED error when deploying React Web app on AWS Amplify)中添加重定向规则，但问题仍然存在。有没有办法解决这个问题？

Answer 1

您必须在AWS Amplify上设置404 (未找到页面)重定向，以指向index.html。

React App是SPA (Single Page App)，它有自己的路由，而在AWS端，除了基本路径之外的所有其他路由都将返回404，因为它们不存在于服务器端。

一旦您再次在React应用程序上设置404 to points，React路由器将处理路由。

检查: docs.aws.amazon.com/amplify/latest/userguide/redirects.html并注意404重定向。

​

​