Amplify publish causes AccessDenied error

Thanks for the additional information.

your S3 Bucket Policy looks Ok.

  • Regarding Origin Domain name or Path, It is always S3 bucket appears in the drop down so no need to update it with region

  • However there is one setting missing in your Cloudfront Origin.
    you need to select Restrict Bucket access to Yes

    As per AWS documentation
    If you want to require that users always access your Amazon S3 content using CloudFront URLs, not Amazon S3 URLs, click Yes. This is useful when you are using signed URLs or signed cookies to restrict access to your content. In the Help, see "Serving Private Content through CloudFront

  • Now create new Identity or select Existing Identity

  • Click on Create button to save Origin.

enter image description here

While the answer by @raj-paliwal helped me tremendously solving my original problem, Amplify has since fixed the problem with a new option.

If you type Amplify add hosting (or Amplify update hosting for an existing site), Amplify gives you the option of Hosting with Amplify Console.

enter image description here

Choosing this will also create a hosting environment with S3 and CloudFront, but Amplify will manage everything for you. With this option I had no problems at all. It seems that this first option fixes the bug I encountered.

If you want to upgrade an existing site from manual CloudFront and S3 hosting to a Hosting with Amplify Console, you have to call amplify update hosting and select the new option.

For those whom the first solution does not work, also make sure that the javascript.config.DistributionDir in your project-config.json file is configured correctly. That can also cause the AccessDenied error (as I just learned the hard way).

Amplify expects your app entrypoint (index.html) to be at the first level within the directory you have configured. So if you accept the amplify default config (dist) and are using a project that puts the built files at a deeper level in the hierarchy (dist/<project name> in the case of angular 8), then it manifests as a 403 AccessDenied error after publishing. This is true of both the amplify and s3 hosting options.

docs: (see the end)