Fix AWS amplify angular app error on Access Denied error

When deploy your angular app on AWS amplify, the first landing page is able to load. However, when you defined a path in your router, and try to access it, you would hit Access Denied error:

The solution is to navigate to AWS console, select “ Rewrites and redirects”, add a new rewrite and redirects, click on “ Open text editor”, and add the below rule:

[
{
"source": "</^[^.]+$|\.(?!(css|gif|ico|jpg|js|png|txt|svg|woff|ttf)$)([^.]+$)/>",
"target": "/index.html",
"status": "200",
"condition": null
}
]

Try again to access your url, it should work now.


Originally published at https://victorleungtw.com on September 19, 2020.

By Victor Leung

Experience in software development, consulting services and technical product management. Understanding of business and technology with an MBA in Finance and a Master degree in Computer Science. AWS Certified Solution Architect with experience in building products from scratch and serving as a charismatic leader.

Leave a comment

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out /  Change )

Google photo

You are commenting using your Google account. Log Out /  Change )

Twitter picture

You are commenting using your Twitter account. Log Out /  Change )

Facebook photo

You are commenting using your Facebook account. Log Out /  Change )

Connecting to %s

This site uses Akismet to reduce spam. Learn how your comment data is processed.