1

I configured an angularjs application in AWS S3. I need to remove hash(#) from URL So, followed the rules mentioned here Angular on Aws S3 everything works fine but when a refresh on any page it is landing into the base/root/main page.

Could anyone help me to solve the issue.

FYI: Am using Apache to serve my S3 content.

mallikarjun
  • 1,862
  • 5
  • 23
  • 47

1 Answers1

0

This happens because when the browser is reloaded when the angular app is in a route(Not with #) it request it from S3 where there isn't a file on that path. The Angular development handles this which is why its not appear locally. As a workaround you can do the following.

  • Setup AWS CloudFront Distribution in-front of S3.
  • Create an error handler if a different path is called and its not found in S3 to return the index.html.

For more details and automate the setup use the AWS Cloudformation in the article Deploying Angular/React Apps in AWS

Note: You can directly serve your S3 content using this approach using the Apache server only for the backend logic which can also be routed through CloudFront while in the same origin.

Ashan
  • 18,898
  • 4
  • 47
  • 67
  • Does it SEO friendly? And I heard CloudFront is too much cost. So we decided to move out of AWS. If you give me a reason to convene my teammates(cost and maintainability of a number of servers) it would be very helpful. – mallikarjun Dec 12 '17 at 06:33