Child routes resuting 404 error on refresh when hosted in S3

[phanikumar]

I have a web application developed in angular 4 and build the application using ng build --prod and copied all files of dist folder into S3. I enabled S3 for static web hosting and configured landing page with index.html. The application is working as expected without any issues.

Now, If I refresh my browser, I am getting 404 error instead of existing page. I deployed the similar application in ECS and EC2 as well where I am able to refresh the page without any errors. Is there any solution for this.

[fzs]

Now, If I refresh my browser, I am getting 404 error instead of existing page. I deployed the similar application in ECS and EC2 as well where I am able to refresh the page without any errors. Is there any solution for this.

Hello Phani. It appears the problem you are having is related to the inability of Cloudfront/S3 to redirect to the index page by default (Default Directory Indexes) when you call the domain name in the distribution for folders other than the root folder.

You can solve this by configuring a lamda function to ensure the redirect is always happening to load the default index page. Below is the link that will help you do this.

https://aws.amazon.com/blogs/compute/imp...ambdaedge/

However, if it is still giving you a 404 when the link in the address bar shows the index page, then ensure that the Cloud distribution and S3 bucket policies are configured correctly.

[phanikumar]

Hi FZS,

I just went with a solution I have configured error page with index.html which is letting the things work fine as of now even for child routes. Thanks for the support