I was developing the frontend using React.js, and I use Javascript SDK for uploading a file to my S3 bucket using my root AWS account. I followed the official doc but kept getting 403 Forbidden. If you encounter the same case, you can try to remove the “ACL” in params while uploading to solve it.
I basically followed the demo code here in the official doc in the addPhoto()
function:
https://docs.aws.amazon.com/sdk-for-javascript/v2/developer-guide/s3-example-photo-album-full.html
I also referred to another blog post here:
https://medium.com/@fabianopb/upload-files-with-node-and-react-to-aws-s3-in-3-steps-fdaa8581f2bd
They all add ACL: 'public-read'
the params in s3.upload(params) function.
// Use S3 ManagedUpload class as it supports multipart uploads var upload = new AWS.S3.ManagedUpload({ params: { Bucket: albumBucketName, Key: photoKey, Body: file, ACL: "public-read" } });
But in my case, I kept getting 403 Forbidden until I simply removed this ACL field. Could someone tell me what’s the reason? Or AWS updated their way to handle the ACL parameter?
Advertisement
Answer
Your bucket probably has Amazon S3 block public access activated (which is default).
One of the settings is: “Block public access to buckets and objects granted through new access control lists (ACLs)”
This means that it will block any command (such as yours) that is granting public access via an ACL. Your code is setting the ACL to public-read
, which is therefore being blocked.
The intention of S3 Block Public Access is to default to a setting where nothing S3 content will not be accidentally made public. You can deactivate S3 Block Public Access to change this setting.
S3 Block Public Access is relatively new (November 2018), so a lot of articles on the web might have been written before the “block by default” rule came into effect.