In this article, we’ll look at how to resolve the AWS Amplify Access Denied problem. At Bobcares, with our AWS Support Services, we can handle your AWS Amplify issues.

Why Does AWS Amplify Access Denied Appear?

Frontend web and mobile developers can create full-stack applications on AWS with the help of a set of tools and features called AWS Amplify. It gives them the freedom to use the range of AWS services as their use cases change.

Users can easily manage app content outside the AWS console with Amplify, configure a web or mobile app backend, connect their app in minutes, and visually build a web frontend UI. Without the need for cloud expertise, deliver more quickly and scale with ease.

However, we may see the “Access Denied” error while using AWS Amplify. There are a number of reasons to see the  “Access Denied” error in AWS Amplify. Let’s explore some of them along with the solutions.

Case 1.

While deploying and hosting the app with Amplify, we may see the error If the app’s distribution directory is not properly configured.

Solution:

To resolve this, use amplify configure project to change the distribution directory and then re-run amplify publish.

Case 2.

The “Access Denied” error appears when the site’s root directory cannot initialize properly.

<Error>
  <Code>AccessDenied</Code>
  <Message>Access Denied</Message>
  <RequestId>4442587FB7D0A2F9</RequestId>
  <HostId>...</HostId>
</Error>

Solution:

Make sure we zip the contents of the build output rather than the top-level folder when we create the zip folder while manually deploying an app from Amazon S3. For example, if the build output creates a folder called “build” or “public,” go into that folder, select all of the contents, and zip it from there.

Case 3.

When the angular app is deployed on AWS amplify, the first landing page can be accessed. However, when we define a path on the router and try to access it, we would hit the Access Denied error.

Solution:

• Firstly, go to the AWS console.
• Now select “Rewrites and redirects.”
• Then create a new rewrite and redirect rule.
• Click “Open text editor,” and enter the following rule:

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

   
• We can now access the URL successfully.

[Need further help? Get in touch with us.]

Conclusion

In this article, we explored some of the circumstances in which we may encounter the “Access Denied” error on AWS Amplify. We also provided the best solutions from our Support team to fix the error in each case.