Nginx not serving static files for Django in Amazon EC2 - 404 Error

Question

I'm pretty new to Django development and Nginx Configuration. Once the application is deployed in amazon EC2 using gunicorn and Nginx, the page loads without the static files (css, js etc).

I suspect that Nginx is unable to load the static files. I spent a couple of hours trying to tweak the Nginx Config, and reading other answers, but still no luck.

Any tips in the right direction are appreciated.

/etc/nginx/sites-available/sbs

server{
        listen 80;
        server_name my_server_host;
        location = /favicon.ico { 
            access_log off; log_not_found off; 
        }

        location /static/ {
            autoindex on;
            root /home/ubuntu/secure-banking-system/sbs/static/;
        }
        location / {
            include proxy_params;
            proxy_pass http://unix:/home/ubuntu/secure-banking-system/sbs/sbs.sock;
        }
}

settings.py

STATIC_ROOT = '/home/ubuntu/secure-banking-system/sbs/static'

STATIC_URL = '/static/'
STATICFILES_DIRS = [
    os.path.join(BASE_DIR, 'sbs/static')
]

I have already verified that the static files are available in /home/ubuntu/secure-banking-system/sbs/static/

File Structure

secure-banking-system
|
|──sbs
   |
   |────│ 
        │   
        ├── sbs
        │   |
        │   └── static
        │       ├── css
        │       ├── images
        │       └── js
        |
        ├── static
            ├── css
            ├── images
            └── js

Just to be sure, have you executed `python manage.py collectstatic`? — Paandittya, Mar 30 '19 at 19:19
Also try removing the traling slash at the last of this statement `root /home/ubuntu/secure-banking-system/sbs/static/;` in `/static/` location block in your sbs file. — Paandittya, Mar 30 '19 at 19:25
@Paandittya I did run collectstatic. Had tried removing the trailing slashes. Thanks for your reply. But it still doesn't load the files. — John, Mar 30 '19 at 19:30
I assume it must be working fine in development environment? — Paandittya, Mar 30 '19 at 19:35
Have you looked into the nginx and gunicorn process logs? It can give a hint of whats going wrong when static resources are requested. — Paandittya, Mar 30 '19 at 19:39
nginx logs dont show any errors...its works fine in dev mode. — John, Mar 30 '19 at 19:44
This is weird. Can u try - 1) Removing `autoindex on` and restart nginx and see if it helps. 2) Use alias instead of root like this `alias /home/ubuntu/secure-banking-system/sbs/static;` and restart nginx and see if this one works. — Paandittya, Mar 30 '19 at 19:58
are the 404 error originating from Django or nginx ? (look at the header and body of the HTTP response for clues) — Thomasleveil, Mar 30 '19 at 20:59
Remove the `static` in `root /home/ubuntu/secure-banking-system/sbs/`. Also, you are using `STATIC_ROOT` wrong in conjunction with `STATICFILES_DIRS`, assuming `BASE_DIR` is `/home/ubuntu/secure-banking-system/`. More on [this SO question](https://stackoverflow.com/questions/24022558/differences-between-staticfiles-dir-static-root-and-media-root) and [STATICFILES_DIRS docs](https://docs.djangoproject.com/en/2.1/ref/settings/#std:setting-STATICFILES_DIRS). — foobarna, Mar 30 '19 at 23:43

score 1 · Accepted Answer · answered Mar 31 '19 at 08:21

The root directive will not remove the /static part from the request. So a request to

http://my_server_hos/static/foo/test.png

would make nginx look for a file in

/home/ubuntu/secure-banking-system/sbs/static/static/foo/test.png.

Understanding that, the configuration for the /static location should be:

       location /static {
            autoindex on;
            root /home/ubuntu/secure-banking-system/sbs;
       }

Another way would be to use the alias directive :

       location /static {
            autoindex on;
            alias /home/ubuntu/secure-banking-system/sbs/static;
       }

score 1 · Answer 2 · answered Mar 31 '19 at 22:04

This is what finally worked for me. I also cleared the Python cache files and *.pyc since my changes in settings.py were not reflecting.

/etc/nginx/sites-available/sbs

server{
        listen 80;
        server_name my_server_host;
location = /favicon.ico { access_log off; log_not_found off; }

    location /static/ {
        alias /home/ubuntu/secure-banking-system/sbs/static/;
    }
location / {
        include proxy_params;
        proxy_pass http://unix:/home/ubuntu/secure-banking-system/sbs/sbs.sock;
    }
}

settings.py

STATIC_ROOT = os.path.join(BASE_DIR, 'sbs/static/')
STATIC_URL = '/static/'
STATICFILES_DIRS = [
    os.path.join(BASE_DIR, 'sbs/static/')
]

Nginx not serving static files for Django in Amazon EC2 - 404 Error

2 Answers2