Static files not being utilized by Django on docker with nginx - django

Question

Background
I am working on a docker-compose app made of 4 services: a django app, a wagtail django app, nginx, and postgresql. My main issue is with static files: they work fine with the development server, but not with nginx. The really strange part is that nginx shows that it is serving the static files, and they are accessible through their URL on a browser. How can I get them to show up?
From settings.py in wagtail app
STATICFILES_FINDERS = [
'django.contrib.staticfiles.finders.FileSystemFinder',
'django.contrib.staticfiles.finders.AppDirectoriesFinder',
]
STATICFILES_DIRS = [
os.path.join(PROJECT_DIR, 'static'),
''
]
STATICFILES_STORAGE = 'django.contrib.staticfiles.storage.ManifestStaticFilesStorage'
STATIC_ROOT = os.path.join(BASE_DIR, 'static')
STATIC_URL = '/static/'
From settings.py in django app
STATIC_URL = '/static/'
STATIC_ROOT = os.path.join(BASE_DIR, 'static')
docker-compose.yml
version: '3.7'
services:
nginx:
image: nginx:latest
container_name: production_nginx
volumes:
- ./nginx/nginx.conf:/etc/nginx/nginx.conf
- ./nginx/error.log:/etc/nginx/error_log.log
#- /etc/letsencrypt/:/etc/letsencrypt/
- cms_static_volume:/usr/src/cms/static
- core_static_volume:/usr/src/core/static
ports:
- 80:80
- 443:443
depends_on:
- core
- cms
core:
build:
context: ./cirrus_core
dockerfile: Dockerfile.prod
command: gunicorn cirrus_core.wsgi:application --bind 0.0.0.0:8000
volumes:
- core_static_volume:/usr/src/core/static
expose:
- "8000"
env_file: .env
depends_on:
- db
cms:
build:
context: ./cirrus_cms
dockerfile: Dockerfile.prod
command: gunicorn cirrus_cms.wsgi:application --bind 0.0.0.0:8001
volumes:
- cms_static_volume:/usr/src/cms/static
expose:
- '8001'
env_file: .env
depends_on:
- db
db:
image: postgres:11.5-alpine
volumes:
- postgres_data:/var/lib/postgresql/data/
env_file: .env.db
volumes:
postgres_data:
core_static_volume:
cms_static_volume:
nginx.conf
events{}
http {
upstream cms {
server cms:8001;
}
upstream core {
server core:8000;
}
server {
listen 80;
server_name dashboard.sentimentco.com 192.168.86.1;
location / {
proxy_pass http://cms/admin/login/?next=/admin/;
proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
proxy_set_header Host $host;
proxy_redirect off;
}
location /static/ {
alias /usr/src/cms/static/;
}
}
server {
listen 80;
server_name admin.sentimentco.com 192.168.86.1;
location / {
proxy_pass http://core/admin/login/?next=/admin/;
proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
proxy_set_header Host $host;
proxy_redirect off;
}
location /static/ {
alias /usr/src/core/static/;
}
}
}
nginx logs
77.247.108.110 - - [19/Aug/2019:20:56:51 +0000] "GET / HTTP/1.1" 400 37 "-" "-"
192.168.86.1 - - [19/Aug/2019:20:56:59 +0000] "GET / HTTP/1.1" 200 6387 "-" "Mozilla/5.0 (Macintosh; Intel Mac OS X 10_14_6) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/76.0.3809.100 Safari/537.36"
192.168.86.1 - - [19/Aug/2019:20:56:59 +0000] "GET /static/wagtailadmin/js/vendor/modernizr-2.6.2.min.76e933e876d5.js HTTP/1.1" 200 10583 "http://dashboard.sentimentco.com/" "Mozilla/5.0 (Macintosh; Intel Mac OS X 10_14_6) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/76.0.3809.100 Safari/537.36"
192.168.86.1 - - [19/Aug/2019:20:56:59 +0000] "GET /static/wagtailadmin/css/vendor/jquery-ui/jquery-ui-1.10.3.verdant.767104e7b415.css HTTP/1.1" 200 27112 "http://dashboard.sentimentco.com/" "Mozilla/5.0 (Macintosh; Intel Mac OS X 10_14_6) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/76.0.3809.100 Safari/537.36"
192.168.86.1 - - [19/Aug/2019:20:56:59 +0000] "GET /static/wagtailadmin/css/core.a28f9631bc68.css HTTP/1.1" 200 78445 "http://dashboard.sentimentco.com/" "Mozilla/5.0 (Macintosh; Intel Mac OS X 10_14_6) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/76.0.3809.100 Safari/537.36"
192.168.86.1 - - [19/Aug/2019:20:56:59 +0000] "GET /static/wagtailadmin/css/normalize.aa75c284e281.css HTTP/1.1" 200 2359 "http://dashboard.sentimentco.com/" "Mozilla/5.0 (Macintosh; Intel Mac OS X 10_14_6) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/76.0.3809.100 Safari/537.36"
192.168.86.1 - - [19/Aug/2019:20:56:59 +0000] "GET /static/wagtailadmin/css/vendor/jquery.tagit.1060b2909c82.css HTTP/1.1" 200 832 "http://dashboard.sentimentco.com/" "Mozilla/5.0 (Macintosh; Intel Mac OS X 10_14_6) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/76.0.3809.100 Safari/537.36"
192.168.86.1 - - [19/Aug/2019:20:56:59 +0000] "GET /static/wagtailadmin/css/layouts/login.ea7b231e7652.css HTTP/1.1" 200 1842 "http://dashboard.sentimentco.com/" "Mozilla/5.0 (Macintosh; Intel Mac OS X 10_14_6) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/76.0.3809.100 Safari/537.36"
192.168.86.1 - - [19/Aug/2019:20:56:59 +0000] "GET /static/wagtailadmin/js/vendor/jquery.autosize.a300cc7b9e37.js HTTP/1.1" 200 5571 "http://dashboard.sentimentco.com/" "Mozilla/5.0 (Macintosh; Intel Mac OS X 10_14_6) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/76.0.3809.100 Safari/537.36"
192.168.86.1 - - [19/Aug/2019:20:56:59 +0000] "GET /static/wagtailadmin/js/vendor/jquery-3.2.1.min.c9f5aeeca3ad.js HTTP/1.1" 200 86659 "http://dashboard.sentimentco.com/" "Mozilla/5.0 (Macintosh; Intel Mac OS X 10_14_6) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/76.0.3809.100 Safari/537.36"
192.168.86.1 - - [19/Aug/2019:20:56:59 +0000] "GET /static/wagtailadmin/js/vendor/bootstrap-transition.7b8c2e460984.js HTTP/1.1" 200 2087 "http://dashboard.sentimentco.com/" "Mozilla/5.0 (Macintosh; Intel Mac OS X 10_14_6) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/76.0.3809.100 Safari/537.36"
192.168.86.1 - - [19/Aug/2019:20:56:59 +0000] "GET /static/wagtailadmin/js/vendor/bootstrap-modal.b411788be2b6.js HTTP/1.1" 200 7031 "http://dashboard.sentimentco.com/" "Mozilla/5.0 (Macintosh; Intel Mac OS X 10_14_6) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/76.0.3809.100 Safari/537.36"
192.168.86.1 - - [19/Aug/2019:20:56:59 +0000] "GET /static/wagtailadmin/js/vendor/jquery.datetimepicker.280df8b3286d.js HTTP/1.1" 200 108981 "http://dashboard.sentimentco.com/" "Mozilla/5.0 (Macintosh; Intel Mac OS X 10_14_6) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/76.0.3809.100 Safari/537.36"
192.168.86.1 - - [19/Aug/2019:20:56:59 +0000] "GET /static/wagtailadmin/js/vendor/tag-it.a60812d95e27.js HTTP/1.1" 200 21758 "http://dashboard.sentimentco.com/" "Mozilla/5.0 (Macintosh; Intel Mac OS X 10_14_6) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/76.0.3809.100 Safari/537.36"
192.168.86.1 - - [19/Aug/2019:20:56:59 +0000] "GET /static/wagtailadmin/js/vendor/bootstrap-tab.f9e4e160df7e.js HTTP/1.1" 200 3563 "http://dashboard.sentimentco.com/" "Mozilla/5.0 (Macintosh; Intel Mac OS X 10_14_6) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/76.0.3809.100 Safari/537.36"
192.168.86.1 - - [19/Aug/2019:20:56:59 +0000] "GET /static/wagtailadmin/js/core.7690c99ae674.js HTTP/1.1" 200 17602 "http://dashboard.sentimentco.com/" "Mozilla/5.0 (Macintosh; Intel Mac OS X 10_14_6) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/76.0.3809.100 Safari/537.36"
192.168.86.1 - - [19/Aug/2019:20:56:59 +0000] "GET /static/wagtailadmin/js/vendor/jquery-ui-1.12.1.min.c15b1008dec3.js HTTP/1.1" 200 253669 "http://dashboard.sentimentco.com/" "Mozilla/5.0 (Macintosh; Intel Mac OS X 10_14_6) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/76.0.3809.100 Safari/537.36"
192.168.86.1 - - [19/Aug/2019:20:56:59 +0000] "GET /static/wagtailadmin/js/wagtailadmin.8edb9675af94.js HTTP/1.1" 200 58279 "http://dashboard.sentimentco.com/" "Mozilla/5.0 (Macintosh; Intel Mac OS X 10_14_6) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/76.0.3809.100 Safari/537.36"
192.168.86.1 - - [19/Aug/2019:20:56:59 +0000] "GET /static/wagtailadmin/js/vendor.a08a4452c3bc.js HTTP/1.1" 200 194518 "http://dashboard.sentimentco.com/" "Mozilla/5.0 (Macintosh; Intel Mac OS X 10_14_6) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/76.0.3809.100 Safari/537.36
result
django admin screenshot
Can anyone tell what's going on here?

Answer 1

It turns out I just needed to include mime.types in my nginx.conf. Big thanks to gasman for helping me figure out the problem.