我正在使用 AWS Amplify,但不知道如何配置我的重写和重定向或 routes.js 以防止尾部斜杠破坏我的功能。
当我在本地运行我的代码并尝试访问localhost:3000/foo/bar/id页面时呈现良好。当我通过AMPLIFY部署相同的代码和用户点击一个按钮与一个href,浏览器获得一个302和用户重定向到example.com/foo/bar/id/,然后因为这个页面不存在,则默认扩增出重定向它们发送到index.html一个404
我尝试将以下内容添加到我的反应路线中:
/foo/bar/:id
/foo/bar/:id/
Run Code Online (Sandbox Code Playgroud)
以及 AWS Amplify 控制台中的以下重定向规则:
/foo/bar/<id> | /foo/bar/<id> | 302
/foo/bar/<id>/ | /foo/bar/<id> | 302
Run Code Online (Sandbox Code Playgroud)
但没有任何效果。我在这里失去理智,有什么建议吗?
我目前有一个 React 应用程序react-router-dom,它可以在本地运行,但在使用AWS Amplify部署时却不能。
问题是,当我路由到 URL 并使用查询字符串时,浏览器会重定向并删除查询字符串。
例如,当我路由到 时/path?value1=foo&value2=bar,浏览器得到 301 并重定向到 url:/0000000X/path/如下所示
我已经使用哈希值以及久经考验/path/?value1=foo&value2=bar的中提到的方法这篇文章没有运气。
下面是我的实现:
按钮.js
href: '/path?value1=foo&value2=bar'
路径.js
import queryString from 'query-string'
const values = queryString.parse(this.props.location.search)
console.log(values.value1)
console.log(values.value2)
Run Code Online (Sandbox Code Playgroud)
路由.js
<AuthenticatedRoute path="/path" exact component={Path} props={childProps} />
Run Code Online (Sandbox Code Playgroud)
所有这些都可以在本地正常工作,重定向,我可以访问查询字符串参数,但不能在 S3 中访问。提前致谢!