Fixing issue with Public images in S3 for websites

You may face this error when you use S3 to host the images for your website and when clicking on the images from website, results in :

<Error>
    <Code>AccessDenied</Code>
    <Message>Access Denied</Message>
    <RequestId>xxxxxxxxxxxxxxxxxxxxxxxxxxxxx</RequestId>
    <HostId>
xxxxxx/xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx=
    </HostId>
</Error>

The bucket for hosting the images may be set as public and the status of the bucket may be shown as Objects as public.

But you would need to explicably set the policy for the bucket to be accessed by public.

Generate policy – https://awspolicygen.s3.amazonaws.com/policygen.html

Amazon Resource Name (ARN) – Should be the ARN of the s3 public and the principle as *

The action would be : GetObject and the policy screen would look like :

The generated policy would look like :

{
  "Id": "Policy1589120677521",
  "Version": "2012-10-17",
  "Statement": [
    {
      "Sid": "Stmt1589120676107",
      "Action": [
        "s3:GetObject"
      ],
      "Effect": "Allow",
      "Resource": "arn:aws:s3:::bucketname",
      "Principal": "*"
    }
  ]
}

Copy paste this policy to the bucket policy.

You may get this error : “Action does not apply to any resource(s) in statement”

The “Resource”: “arn:aws:s3:::bucketname”, should be changed to the following ( Add /* )

"Resource": "arn:aws:s3:::bucketname/*",

Once this is saved, it would be fine.