Static files not being utilized by Django on docker with nginx

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.