如何配置AWS S3 Bucket路由以使用html5样式路由?

时间:2021-05-07 18:59:20

I have a web app (using Angular 2 with webpack) that should not require more than static file hosting...except that I am using html5 style routing (slashes rather than hashes). I would like to host it in an AWS S3 Bucket. If a user goes to the root of my app, the S3 Bucket serves index.html, and everything is fine. If the user clicks some button that uses the router to take them to myapp.com/routename, then it still works fine (because there's technically no page reload). But if the entry point for the user is myapp.com/routename, then the browser will do a get request to that url, and S3 will not know that index.html is the thing it should be responding with. I've tried using the S3 routing config...but the routing config seems to only be able to do redirects which actually change the url in the urlbar. For example, if I say redirect myapp.com/routename to myapp.com, it's not just serving index.html at that url too, it's actually changing the url in the browser, which sends the user back to the "/" route. Is there a way to configure and S3 bucket to do regular routing instead of redirects?

我有一个Web应用程序(使用带有webpack的Angular 2),除了我使用html5样式路由(斜杠而不是哈希)之外,不应该需要更多的静态文件托管。我想在AWS S3 Bucket中托管它。如果用户转到我的应用程序的根目录,S3 Bucket会为index.html提供服务,一切都很好。如果用户单击某个使用路由器将其带到myapp.com/routename的按钮,那么它仍然可以正常工作(因为技术上没有页面重新加载)。但是,如果用户的入口点是myapp.com/routename,那么浏览器将对该URL执行get请求,并且S3将不知道index.html是应该响应的内容。我尝试过使用S3路由配置...但路由配置似乎只能进行实际更改urlbar中url的重定向。例如,如果我说将myapp.com/routename重定向到myapp.com,它不仅仅是在该URL上提供index.html,它实际上是在更改浏览器中的url,这会将用户发送回“/”路由。有没有办法配置和S3桶进行常规路由而不是重定向?

1 个解决方案

#1


1  

Theoretically you could copy your index.html to something like 404.html and enter this filename in "Error Document" section of S3 settings. When there is no page to display (error 404), S3 would show that document.

从理论上讲,您可以将index.html复制到404.html之类,并在S3设置的“错误文档”部分输入此文件名。当没有要显示的页面时(错误404),S3将显示该文档。

It should work, but it's a horrible idea. Browsers will still receive 404 HTTP code in HTTP headers.

它应该工作,但这是一个可怕的想法。浏览器仍然会在HTTP标头中收到404 HTTP代码。

#1


1  

Theoretically you could copy your index.html to something like 404.html and enter this filename in "Error Document" section of S3 settings. When there is no page to display (error 404), S3 would show that document.

从理论上讲,您可以将index.html复制到404.html之类,并在S3设置的“错误文档”部分输入此文件名。当没有要显示的页面时(错误404),S3将显示该文档。

It should work, but it's a horrible idea. Browsers will still receive 404 HTTP code in HTTP headers.

它应该工作,但这是一个可怕的想法。浏览器仍然会在HTTP标头中收到404 HTTP代码。