Error Accessing Static Files

Question

Error Accessing Static Files

dorian-adams opened this issue 2 years ago · 7 comments

dorian-adams commented 2 years ago

Python Version

3.10

Django Version

4.1

Package Version

No response

Description

Hi, I believe I've encountered a bug or not followed the instructions correctly. Most likely, the latter. But my issue is that after following the instructions for configuring Cloudfront with whitenoise, CF cannot access any files under my static folder.

Error: The requested resource was not found on this server.

It can, however, access my pages.

My static settings:

STATIC_ROOT = BASE_DIR / "staticfiles"
STATIC_HOST = os.environ.get("DJANGO_STATIC_HOST", "")
STATIC_URL = STATIC_HOST + "/static/"
STATICFILES_STORAGE = "whitenoise.storage.CompressedStaticFilesStorage"

Middleware:

MIDDLEWARE = [
    'django.middleware.security.SecurityMiddleware',
    'whitenoise.middleware.WhiteNoiseMiddleware',
    'django.contrib.sessions.middleware.SessionMiddleware',
    'django.middleware.common.CommonMiddleware',
    'django.middleware.csrf.CsrfViewMiddleware',
    'django.contrib.auth.middleware.AuthenticationMiddleware',
    'django.contrib.messages.middleware.MessageMiddleware',
    'django.middleware.clickjacking.XFrameOptionsMiddleware',
    'wagtail.contrib.redirects.middleware.RedirectMiddleware',
]

I can confirm that collectstatic was run successfully, the files exist and are compressed, and I have the correct URL because it works for pages. CF settings were left to default, per instructions.

Also, the instructions have us create staticfiles and static directories, is that supposed to be the case when using a CDN? Or was staticfiles only for setup without a CDN? Should these two directories be consolidated?

Thank you.

Answer 1 · 2022-10-12T07:46:36.000Z

Hi, I believe I've encountered a bug or not followed the instructions correctly. Most likely, the latter. But my issue is that after following the instructions for configuring Cloudfront with whitenoise, CF cannot access any files under my static folder.

Error: The requested resource was not found on this server.

This is too little information to go on. What are the requests you're making and how are they failing?

Have you tried accessing your app not through the CDN?

Also, the instructions have us create staticfiles and static directories, is that supposed to be the case when using a CDN? Or was staticfiles only for setup without a CDN? Should these two directories be consolidated?

You need the directories whether or not you are using a CDN.

Answer 2 · 2022-10-12T18:43:01.000Z

Hi, I believe I've encountered a bug or not followed the instructions correctly. Most likely, the latter. But my issue is that after following the instructions for configuring Cloudfront with whitenoise, CF cannot access any files under my static folder.
Error: The requested resource was not found on this server.

This is too little information to go on. What are the requests you're making and how are they failing?

All requests to static files fail with a 404 error Not Found: The requested resource was not found on this server. This includes my css, js, and static image files. When loading a page, the necessary static resources fail with that error. The same error also occurs when accessing the files directly from the CDN.

Initially, I began with: "whitenoise.storage.CompressedManifestStaticFilesStorage" - which didn't work at all. It caused a server error. So I then switched to "whitenoise.storage.CompressedStaticFilesStorage" and now pages will load but without any of my static content.

So I wonder if there's some cache issue going on? Essentially my CDN can load everything on my site except the files being handled by whitenoise.storage.

Have you tried accessing your app not through the CDN?

Serving the files locally in debug works if I run python manage.py runserver --nostatic but standard python manage.py runserver leads to the same 404s on static files.

Answer 3 · 2022-10-12T19:06:52.000Z

Are you using {% static %} to generate your static URL’s? What do they look like?

Answer 4 · 2022-10-12T19:19:48.000Z

Are you using {% static %} to generate your static URL’s? What do they look like?

Yes, here are a few of them:

<link rel="icon" href="{% static 'img/brand/favicon.png' %}" type="image/png">
<link rel="stylesheet" href="{% static 'libs/@fortawesome/fontawesome-free/css/all.min.css' %}">
<link rel="stylesheet" href="{% static 'css/quick-website.css' %}" id="stylesheet">

Would HTTPS or HSTS settings conflict with anything within whitenoise?

SESSION_COOKIE_SECURE = True
CSRF_COOKIE_SECURE = True
SECURE_SSL_REDIRECT = True

# HSTS Settings
SECURE_HSTS_SECONDS = 31536000  # 1 year
SECURE_HSTS_PRELOAD = True
SECURE_HSTS_INCLUDE_SUBDOMAINS = True

Answer 5 · 2022-10-18T18:58:30.000Z

Sorry I can’t really help any more. I hope you can debug the issue my making requests direct to your origin server and tracing them.

Answer 6 · 2022-10-20T03:39:07.000Z

No worries. I almost have it completely working now. I think it was more of a misunderstanding on my part regarding Heroku. To get it working, I had to run collectstatic from my development environment and then push the optimized files to production. Previously, I was running collectstatic from production instead. Works fine now, except for one js file.

Thanks.

Answer 7 · 2022-10-20T08:00:17.000Z

It does work to run collectstatic locally, and commit the assets, but that’s not the intended method.

The default Django deployment setup has you run collectstatic in your build process, for your production environment. Heroku does this by default, if it can detect your manage.py, unless you disable it with an env var. Refer to the Heroku docs for collectstatic.