S3 Static Website Hosting Route All Paths to Index.html

Question

I am using S3 to host a javascript app that will use HTML5 pushStates. The problem is if the user bookmarks any of the URLs, it will not resolve to anything. What I need is the ability to take all url requests and serve up the root index.html in my S3 bucket, rather than just doing a full redirect. Then my javascript application could parse the URL and serve the proper page.

Is there any way to tell S3 to serve the index.html for all URL requests instead of doing redirects? This would be similar to setting up apache to handle all incoming requests by serving up a single index.html as in this example: https://stackoverflow.com/a/10647521/1762614. I would really like to avoid running a web server just to handle these routes. Doing everything from S3 is very appealing.

Answer 1

It's very easy to solve it without url hacks, with CloudFront help.

• Create S3 bucket, for example: react
• Create CloudFront distributions with these settings:
  • Default Root Object: index.html
  • Origin Domain Name: S3 bucket domain, for example: react.s3.amazonaws.com
• Go to Error Pages tab, click on Create Custom Error Response:
  • HTTP Error Code: 403: Forbidden (404: Not Found, in case of S3 Static Website)
  • Customize Error Response: Yes
  • Response Page Path: /index.html
  • HTTP Response Code: 200: OK
  • Click on Create