Django collectstatic giving no errors. But staticfiles not loading on website with both debug true and false. Files on S3

Question

Intro: I have made my application in Django I am trying to get my static and media files hosted in aws s3. My Django project is on AWS Lambda and AWS Api gateway using Zappa. below is my settings.py

AWS_DEFAULT_ACL = None
STATICFILES_DIRS = [
    os.path.join(BASE_DIR, 'static'),
]
DEFAULT_FILE_STORAGE = 'aws_storage_classes.MediaStorage'
AWS_ACCESS_KEY_ID = os.getenv("ACCESS_KEY")
AWS_SECRET_ACCESS_KEY = os.getenv("ACCESS_SECRET_KEY")
AWS_STORAGE_BUCKET_NAME = os.getenv("AWS_STORAGE_BUCKET_NAME")
STATICFILES_STORAGE = 'aws_storage_classes.StaticStorage'
AWS_S3_OBJECT_PARAMETERS = {
    'CacheControl': 'max-age=86400',
}

AWS_S3_DOMAIN = "%s.s3.amazonaws.com" % AWS_STORAGE_BUCKET_NAME

STATIC_URL = 'https://%s.static/' % AWS_S3_DOMAIN
MEDIA_URL = 'https://%s.media/' % AWS_S3_DOMAIN

STATIC_ROOT = os.path.join(BASE_DIR, 'staticfiles')
MEDIA_ROOT = os.path.join(BASE_DIR, 'media')

I then created a file in my project folder the same as my manage.py called aws_storage_classes.py

Below are the contents of my file aws_storage_classes.py

from storages.backends.s3boto3 import S3Boto3Storage    

class StaticStorage(S3Boto3Storage):
    location = 'static'

class MediaStorage(S3Boto3Storage):
    location = 'media'

Below are my urls

if settings.DEBUG:

    urlpatterns += static(settings.STATIC_URL, document_root=settings.STATIC_ROOT)
    urlpatterns += static(settings.MEDIA_URL, document_root=settings.MEDIA_ROOT)

Also in my settings.py

DEBUG = False

When I do python manage.py collectstatic all the staticfiles are downloaded and I don't get any errors. But when go on admin page the static files are not uploaded. See images below

Below is the image of my S3 bucket

Below is what is inside the static folder

Static files not loading

<link rel="stylesheet" type="text/css" href="https://<bucketname>.s3.amazonaws.com/static/style.css?AWSAccessKeyId=AKIAJHJGHJGJGJGJJGJGJMHIFQ&amp;Signature=yfS3%2BvA0q15aUxw7OBySuQWZfjg%3D&amp;x-amz-security-token=FQoGZXIvYXdgljdaksfgdjsgfkjertert;hre;thtires=151232173">

Updated settings.py

AWS_DEFAULT_ACL = None
STATICFILES_DIRS = [
    os.path.join(BASE_DIR, 'static'),
]
DEFAULT_FILE_STORAGE = 'aws_storage_classes.MediaStorage'
AWS_ACCESS_KEY_ID = os.getenv("ACCESS_KEY")
AWS_SECRET_ACCESS_KEY = os.getenv("ACCESS_SECRET_KEY")
AWS_STORAGE_BUCKET_NAME = os.getenv("AWS_STORAGE_BUCKET_NAME")
STATICFILES_STORAGE = 'aws_storage_classes.StaticStorage'
AWS_S3_OBJECT_PARAMETERS = {
    'CacheControl': 'max-age=86400',
}

AWS_S3_DOMAIN = "%s.s3.amazonaws.com" % AWS_STORAGE_BUCKET_NAME

STATIC_URL = 'https://%s.static/' % AWS_S3_DOMAIN
MEDIA_URL = 'https://%s.media/' % AWS_S3_DOMAIN

ADMIN_MEDIA_PREFIX = STATIC_URL + 'admin/'

STATIC_ROOT = os.path.join(BASE_DIR, 'staticfiles')
MEDIA_ROOT = os.path.join(BASE_DIR, 'media')

Below is the link after adding ADMIN_MEDIA_PREFIX = STATIC_URL + 'admin/'

<link rel="stylesheet" type="text/css" href="https://django-static-media.s3.amazonaws.com/static/style.css?AWSAccessKeyId=AKIAGGGGGGGGGMHIFQ&amp;Signature=6gFQTsOSDFSDFA%3D&amp;x-amz-security-token=FQoGZvwbJhd9amp;Expires=1549168642">

Still staticfiles not loading

I have given my user full s3 access so I don't think I should need the below. Also I was able to successfully add the static files in the S3 and it is not giving me any permission related errors. still trying it out as per a suggestions below

Below are my permissions I tried to give permission to lambda function but it gives me the bellow error

After changing the static and media URLS

Answer 1

I can see STATIC_URL and MEDIA_URL not setup correctly.

change

STATIC_URL = 'https://%s.static/' % AWS_S3_DOMAIN
MEDIA_URL = 'https://%s.media/' % AWS_S3_DOMAIN

To

STATIC_URL = 'https://%s/static/' % AWS_S3_DOMAIN
MEDIA_URL = 'https://%s/media/' % AWS_S3_DOMAIN

It should work.

The following link has a very good explanation. https://simpleisbetterthancomplex.com/tutorial/2017/08/01/how-to-setup-amazon-s3-in-a-django-project.html

Answer 2

I had the same issue but with me it was a ACL issue. I could only get collectstatic to run if I set AWS_DEFAULT_ACL=None but then all the files would be set to private by default and couldn't access them from the app.

To fix I had to change the S3 bucket Object Ownership to Bucket owner preferred so that it accepted the public-read ACL.