Forbidden error 403 get in console while direct uploading to S3

Question

I was upload image through a server to s3 but I want to use direct uploading to S3 because of fast uploading. I used django-s3direct package for direct uploading. I follow all step but still, I get this error.

While uploading I get error in console:

POST https://s3-ap-south-1.amazonaws.com/collegestudentworld-assets/img/mainpost/amar.jpg?uploads 403 (Forbidden)

initiate error: collegestudentworld-assets/img/mainpost/amar.jpg AWS Code: AccessDenied, Message:Access Deniedstatus:403

settings.py:

AWS_ACCESS_KEY_ID = os.environ.get('AWS_ACCESS_KEY_ID')
AWS_SECRET_ACCESS_KEY = os.environ.get('AWS_SECRET_ACCESS_KEY')
AWS_STORAGE_BUCKET_NAME =os.environ.get('AWS_STORAGE_BUCKET_NAME')

AWS_S3_ENDPOINT_URL = 'https://s3-ap-south-1.amazonaws.com'
#'http://' + AWS_STORAGE_BUCKET_NAME + '.s3.amazonaws.com/' #"https://collegestudentworld-assets.s3-website.ap-south-1.amazonaws.com/"
AWS_S3_REGION_NAME = 'ap-south-1'
AWS_S3_FILE_OVERWRITE = False
AWS_DEFAULT_ACL = None
STATICFILES_STORAGE = 'storages.backends.s3boto3.S3Boto3Storage'
DEFAULT_FILE_STORAGE = 'storages.backends.s3boto3.S3Boto3Storage'

STATIC_URL = 'http://' + AWS_STORAGE_BUCKET_NAME + '.s3.amazonaws.com/'
ADMIN_MEDIA_PREFIX = STATIC_URL + 'admin/'
S3DIRECT_DESTINATIONS = {
    'primary_destination': {
        'key': 'uploads/',
        'allowed': ['image/jpg', 'image/jpeg', 'image/png', 'video/mp4'],
    },
    'mainpost':{
        'key':'img/mainpost/',
        'auth': lambda u:u.is_authenticated
    },
}

Bucket policy:

{
    "Version": "2012-10-17",
    "Statement": [
        {
            "Effect": "Allow",
            "Action": [
                "s3:ListAllMyBuckets"
            ],
            "Resource": "arn:aws:s3:::*"
        },
        {
            "Effect": "Allow",
            "Action": [
                "s3:ListBucket",
                "s3:GetBucketLocation",
                "s3:ListBucketMultipartUploads",
                "s3:ListBucketVersions"
            ],
            "Resource": "arn:aws:s3:::collegestudentworld-assets/*"
        },
        {
            "Effect": "Allow",
            "Action": [
                "s3:GetObject",
                "s3:PutObject",
                "s3:PutObjectAcl",
                "s3:*Object*",
                "s3:ListMultipartUploadParts",
                "s3:AbortMultipartUpload"
            ],
            "Resource": "arn:aws:s3:::collegestudentworld-assets/*"
        }
    ]
}

CORS Configuration:

<?xml version="1.0" encoding="UTF-8"?>
<CORSConfiguration xmlns="http://s3.amazonaws.com/doc/2006-03-01/">
<CORSRule>
    <AllowedOrigin>http://127.0.0.1:8000</AllowedOrigin>
    <AllowedMethod>PUT</AllowedMethod>
    <AllowedMethod>POST</AllowedMethod>
    <AllowedMethod>DELETE</AllowedMethod>
    <MaxAgeSeconds>3000</MaxAgeSeconds>
    <ExposeHeader>x-amz-server-side-encryption</ExposeHeader>
    <AllowedHeader>*</AllowedHeader>
</CORSRule>
<CORSRule>
    <AllowedOrigin>*.collegestudentworld.com</AllowedOrigin>
    <AllowedMethod>PUT</AllowedMethod>
    <AllowedMethod>POST</AllowedMethod>
    <AllowedMethod>DELETE</AllowedMethod>
    <ExposeHeader>ETag</ExposeHeader>
    <AllowedHeader>*</AllowedHeader>
</CORSRule>
</CORSConfiguration>

In my browser console I get this:

    Starting img/mainpost/amar.jpg reason: first file

    initiate getPayloadSha256Content: e3b0c44298fc1c149afbf4c8996fb92427ae41e4649b934ca495991b7852b855

initiate V4 CanonicalRequest: POST
/collegestudentworld-assets/img/mainpost/amar.jpg
uploads=
content-type:image/jpeg
host:s3-ap-south-1.amazonaws.com
x-amz-acl:public-read
x-amz-date:20200604T125344Z
content-type;host;x-amz-acl;x-amz-date
e3b0c44298fc1c149afbf4c8996fb92427ae41e4649b934ca495991b7852b855
V4 stringToSign: AWS4-HMAC-SHA256
6f90e1d9b91a3e557fe7f531fd735b407e29cc7f28f30655322ab5ad9ae17940
initiate signature: ebd6d06d109fff2ac35f49314a429e57019c48288073e4549d6d4c1b7ec2a10b
initiate getPayloadSha256Content: e3b0c44298fc1c149afbf4c8996fb92427ae41e4649b934ca495991b7852b855

POST https://s3-ap-south-1.amazonaws.com/collegestudentworld-assets/img/mainpost/amar.jpg?uploads 403 (Forbidden)

initiate error: collegestudentworld-assets/img/mainpost/amar.jpg AWS Code: AccessDenied, Message:Access Deniedstatus:403

EDIT:

When I make Block public access (bucket settings) is **OFF . then everything working.**

but I have user information which is private. I don't want to make it public. Is it okay to make it public.. any thought thanx

Answer 1

If IAM policy for the user is set correctly then you can try these suggestions below. Instead of IAM policy, you can try adding principal value in your bucket policy. And also make sure Block public access (account settings) is off and your bucket has public access.

You can try this solution:

{
    "Version": "2012-10-17",
    "Statement": [
        {
            "Sid": "S3Permissions",
            "Effect": "Allow",
            "Principal": "*",
            "Action": [
                "s3:Get*",
                "s3:List*"
            ],
            "Resource": "arn:aws:s3:::collegestudentworld-assets/*"
        }
    ]
}

And also you can remove the <AllowedOrigin>http://127.0.0.1:8000</AllowedOrigin> from CORS settings and can try the full path to your website or EB environment name also.

 <?xml version="1.0" encoding="UTF-8"?>
<CORSConfiguration xmlns="http://s3.amazonaws.com/doc/2006-03-01/">
<CORSRule>
    <AllowedOrigin>*.collegestudentworld.com</AllowedOrigin>
    <AllowedMethod>GET</AllowedMethod>
</CORSRule>
</CORSConfiguration>

Answer 2

This is the IAM policy I use. I would make sure the IAM user who is attached to the upload policy has the correct IAM policy attached to him.

{
    "Version": "2012-10-17",
    "Statement": [
        {
            "Effect": "Allow",
            "Action": [
                "s3:ListBucketMultipartUploads",
                "s3:ListBucketVersions",
                "s3:ListBucket",
                "s3:GetBucketLocation",
                "s3:HeadBucket"
            ],
            "Resource": "arn:aws:s3:::collegestudentworld-assets/*"
        },
        {
            "Effect": "Allow",
            "Action": [
                "s3:AbortMultipartUpload",
                "s3:*Object*",
                "s3:ListMultipartUploadParts"
            ],
            "Resource": "arn:aws:s3:::collegestudentworld-assets/*"
        }
    ]
}