Fix AWS amplify angular app error on Access Denied error

September 19, 2020

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.


Profile picture

Experience in software development, application architecture, and deploying cloud solutions for enterprise customers. Strong hands-on skills with a Master's degree in Computer Science and business acumen with a master of business administration (MBA) in Finance. Certified in Amazon Web Services (AWS), Google Cloud Platform (GCP), Microsoft Azure, Kubernetes (CKA, CKAD, CKS, KCNA) and Scrum (PSM, PSPO) with experience in building banking products from scratch. Connect on Linkedin

© 2022, @victorleungtw