我是AWS部署
的新手,并尝试部署后端(NodeJS、Express、MongoDB
)和前端(React/Redux
)代码到 AWS。我使用 AWS Beanstalk
作为后端,使用 AWS amplify
作为前端代码。我已经完成了后端部署并使用 postman 对其进行了测试,甚至通过在 http://localhost:3000/
运行前端来测试 API。我也在 AWS amplify 上部署了代码,但似乎我不知道它使用的重写和重定向
,以便应用程序可以导航到不同的 URL。我的是一个SPA
。我可以看到登录屏幕,但输入凭据后,它不会导航到 protected (使用 JWT Auth
)URL。
我的 amplify 应用程序托管在:https://url-resolve-changes.d1z993fyobkz3s.amplifyapp.com/
App.js -> 包含不同的路由。除了 /login
和 /register
之外,所有路由都必须首先使用 PrivateRoute 检查,然后才能渲染主页。我声明了 BASE_URL = host 但我不确定如何使用它在不同的 URL 上导航
// const BASE_URL = "https://url-resolve-changes.d1z993fyobkz3s.amplifyapp.com";
class App extends Component {
render() {
return (
<div className="App">
<MessageSnackbar />
<Router history={history}>
<Switch>
<PrivateRoute
exact
path={`/`}
renderFunc={routeProps => <HomePage {...routeProps} />}
/>
<Route path={`/login`} component={Login} />
<Route path={`/register`} component={Register} />
</Switch>
</Router>
</div>
);
}
}
export default withTheme()(App);
我在放大设置中的重写和重定向中进行了以下配置。
list .json
{
"short_name": "React App",
"name": "Create React App Sample",
"icons": [
{
"src": "favicon.ico",
"sizes": "64x64 32x32 24x24 16x16",
"type": "image/x-icon"
}
],
"start_url": ".",
"display": "standalone",
"theme_color": "#000000",
"background_color": "#ffffff"
}
问题是,当我点击:
时,目前还没有加载任何内容https://url-resolve-changes.d1z993fyobkz3s.amplifyapp.com/index.html
或者
https://url-resolve-changes.d1z993fyobkz3s.amplifyapp.com/
后端 URL 的配置正确,因为当我从 http://localhost:3000/
发送请求时,API 工作正常。这只是我缺少的重定向部分。如果需要任何其他详细信息,请告诉我。
感谢你的帮助。提前致谢。
最佳答案
我在刷新带有路线路径的页面时遇到问题, 收到响应 AccessDenied,由于 S3 并不真正具有该路径或文件。首先在搜索结果中得到这个问题,所以在这里发布我的解决方案。
解决了问题:
原文地址:
</^[^.]+$|\.(?!(css|gif|ico|jpg|js|png|txt|svg|woff|woff2|ttf|map|json)$)([^.]+$)/>
Redirects for single page web apps (SPA)
Most SPA frameworks support HTML5 history.pushState() to change browser location without triggering a server request. This works for users who begin their journey from the root (or /index.html), but fails for users who navigate directly to any other page. Using regular expressions, the following example sets up a 200 rewrite for all files to index.html except for the specific file extensions specified in the regular expression.
关于node.js - 在 AWS amplify 中重写和重定向,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/54477432/