Static path with S3

Using Django Deployment
1

Hi everyone, I’m currently deploying my django app and want to store my static and medias files on S3.
I have the following configuration in settings.py, which works perfectly locally :

STATIC_URL = ‘/static/’
STATICFILES_DIRS = [
os.path.join(BASE_DIR, ‘static’)
]
STATIC_ROOT = BASE_DIR / “staticfiles”

MEDIA_URL = ‘/media/’
MEDIA_ROOT = BASE_DIR / “media”

Using static folder to store my images, css, js… and media folder to store the images the user uploads.
So for example to access an image I do <img src="{% static 'my_image.png' %}">

But now that I want to use S3, I’ve created both folders in my bucket and the image is not served. Looking in details, I see that the url is :

https://my_bucket_name.s3.amazonaws.com/my_image.png

The static folder has disappeared from the url.
If I want to access my image I have to do : <img src="{% static 'static/my_image.png' %}">

I don’t understand the problem, I thought STATIC_URL was referencing the static folder…

Thanks a lot for your help!

2

I’m curious - how are you getting the my_bucket_name.s3.amazonaws.com as part of the url? What you’re showing here should render as /static/my_image.png.

3

Capture d’écran 2024-03-04 à 16.30.30
Capture d’écran 2024-03-04 à 16.30.301006×104 14.1 KB

As the image doesn’t render, I just right click on it and inspect element. That’s where I see it.

4

That’s not what I’m saying.

You’re saying that the url shows up in the html as my_bucket_name.s3.amazonaws.com. Where is that coming from?

5

Sorry I’m not sure to understand your question correctly.
I’ve uploaded my local static and media folders to my aws bucket. I configured it to be publicly accessible and then I made the configuration in settings.py :

AWS_ACCESS_KEY_ID = ‘’
AWS_SECRET_ACCESS_KEY = ‘’
AWS_STORAGE_BUCKET_NAME = ‘my_bucket_name’

AWS_S3_REGION_NAME = ‘eu-west-3’
AWS_S3_FILE_OVERWRITE = False
AWS_DEFAULT_ACL = None
DEFAULT_FILE_STORAGE = ‘storages.backends.s3boto3.S3Boto3Storage’

STATICFILES_STORAGE = ‘storages.backends.s3boto3.S3Boto3Storage’
AWS_QUERYSTRING_AUTH = False

I didn’t do anything else. In the html, I just call it like that <img src="{% static 'my_image.png' %}"> which doesn’t work.

6

The STATIC_URL setting primarily applies to the StaticFilesStorage package. I don’t see anything documented that shows that it is used with any other storage engine unless that engine specifies that it is being used.

7

So STATIC_URL is useless with S3 storage ? And replaced by STATIC_ROOT (which is useless locally in my case) ?
Thanks a lot for your quick answers.

8

That appears to me to be the case. I don’t see any reference to it in the django-storages docs for S3 and I don’t see it being used in the code.

Not “replaced by”. These two settings serve two different and complimentary functions for the StaticFilesStorages module.

The STATIC_ROOT setting identifies a physical path where static files are to be stored. The STATIC_URL setting identifies a logical path prefix to be applied to URLs being constructed to reference those files.

Neither of those settings appear to be relevant to the S3Storage module - at least not as far as I can see at Amazon S3 — django-storages 1.14.2 documentation. That module appears to have its own settings that it uses for those purposes.

9

I’ve finally found a way to make it work. If someone has the same issue, here’s how I did.

After setting the bucket public, in settings.py I made these parameters :

AWS_ACCESS_KEY_ID
AWS_SECRET_ACCESS_KEY
AWS_S3_REGION_NAME
AWS_STORAGE_BUCKET_NAME
AWS_S3_FILE_OVERWRITE = False
AWS_DEFAULT_ACL = None
AWS_QUERYSTRING_AUTH = False
AWS_S3_CUSTOM_DOMAIN = f"{AWS_STORAGE_BUCKET_NAME}.s3.amazonaws.com"

STATICFILES_LOCATION = "static"
STATIC_URL = f"https://{AWS_S3_CUSTOM_DOMAIN}/{STATICFILES_LOCATION}/"

MEDIAFILES_LOCATION = "media"
MEDIA_URL = f"https://{AWS_S3_CUSTOM_DOMAIN}/{MEDIAFILES_LOCATION}/"

STORAGES = {
    "default": {"BACKEND": "my_project_name.custom_storage.MediaStorage"},
    "staticfiles": {"BACKEND": "my_project_name.custom_storage.StaticStorage"},
}
AWS_S3_OBJECT_PARAMETERS = {
    "CacheControl": "max-age=2592000",
}

In the same folder (where there’s settings.py), I created custom_storage.py :

from django.conf import settings
from storages.backends.s3boto3 import S3Boto3Storage

class StaticStorage(S3Boto3Storage):
    location = settings.STATICFILES_LOCATION
    querystring_auth = False

class MediaStorage(S3Boto3Storage):
    location = settings.MEDIAFILES_LOCATION
    file_overwrite = False

Then I ran python manage.py collectstatic and it created in the bucket the static folder, containing admin folder.
And manually I created my folders in the bucket.