Reputation: 877
So I have an AWS S3 Bucket hosting the files for a react application I've built. I use CodePipeline to build and compile the React app and store the files on an S3 bucket which is served through a CloudFront CDN.
Everything seems to be working fine when I access the url from the root https://website.com
. When I click "login" on that page I get directed to the following route https://website.com/auth/login
and it works awesome.
The Problem
If I try to access the page https://website.com/auth/login
directly I get the following error:
<Error>
<Code>AccessDenied</Code>
<Message>Access Denied</Message>
<RequestId>66CE67E2E5DA0B7B</RequestId>
<HostId>Spfhgnlygx05eugycEy5ew4e8oSn/ccNX21Iy/6qaAxI8glXljDjgKmUPvMzRd8+NktQsNietpg=</HostId>
</Error>
I set the default resource in the cloudfront CDN to the /index.html
which is why the root domain works, but how do I get all there urls to point to /index.html
so the app routes it properly?
Upvotes: 6
Views: 3777
Reputation: 877
I needed to set a rule for 403 Forbidden in my cloudfront configuration as posted here: Receive AccessDenied when trying to access a reload or refresh or one in new tab in angular 5
Upvotes: 5