Hosting Angular website using S3 maintaining routes, without s3 access denied error

Hi,

So you hosted your Angular website in s3

Application work fine but in middle of any page if user hit Ctrl+ F5 or Reload angular app , S3 respond it with 403 forbidden.


Below are the step to fix the access denied error with S3 hosting Angular App.

1. Navigate to Edit Distribution
2. Navigate to Error Pages Pane
3. Add new "Create Custom Error Response"
4. Select Error code to 403 forbidden 
5. Caching Minimum TTL to 0
6. Customize Error Response to Yes
7. Response Page path "/Index.html"  {Entry page for angular including '/'}
8. HTTP Response Code to 200:OK
9. Invalidate the Cloudfront Cache
10. Wait for some time and reload in browse to test it :)

Hope this will help