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

0
votes

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
2
djangonginxamazon-ec2gunicornstatic-files
Just to be sure, have you executed python manage.py collectstatic? - Paandittya
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
@Paandittya I did run collectstatic. Had tried removing the trailing slashes. Thanks for your reply. But it still doesn't load the files. - John
I assume it must be working fine in development environment? - Paandittya
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 and STATICFILES_DIRS docs. - foobarna

2 Answers

1
votes

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;
       }
1
votes

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/')
]