Traefik: Serve static content with Nginx for a Django Application

Currently I am trying to run a docker-compose file on my server where I will run a django application using traefik and gunicorn. My current configuration is as follows:

version: '3'

services:
  web:
    build:
      context: ./src
      dockerfile: dockerfiles-stage/Dockerfile
    command: gunicorn core.wsgi:application --workers 2 --threads 2 --bind 0.0.0.0:8000
    volumes:
      - static_volume:/code/static
      - ./src/logs/main/:/code/logs/
    expose:
      - 8000
    labels:
      - "traefik.enable=true"
      - "traefik.http.routers.web.rule=Host(`mk.getalice.ai`)"
      - "traefik.http.routers.web.entrypoints=websecure"
      - "traefik.http.routers.web.tls.certresolver=myhttpchallenge"
    depends_on:
      - db
      - mongo
      - redis

  traefik:
    image: "traefik:v2.0.0-rc3"
    container_name: "traefik"
    command:
      - "--api.insecure=true"
      - "--providers.docker=true"
      - "--providers.docker.exposedbydefault=false"
      - "--entrypoints.web.address=:80"
      - "--entrypoints.websecure.address=:443"
      - "--certificatesresolvers.myhttpchallenge.acme.httpchallenge=true"
      - "--certificatesresolvers.myhttpchallenge.acme.httpchallenge.entrypoint=web"
      - "[email protected]gmail.com"
      - "--certificatesresolvers.myhttpchallenge.acme.storage=/letsencrypt/acme.json"
    ports:
      - "80:80"
      - "443:443"
      - "8000:8000"
    volumes:
      - "./letsencrypt:/letsencrypt"
      - "/var/run/docker.sock:/var/run/docker.sock:ro"
    depends_on:
      - web

  db:
    image: postgres:11.5-alpine
    volumes:
      - postgres_data:/var/lib/postgresql/data/
    environment:
      - POSTGRES_USER=misfit
      - POSTGRES_PASSWORD=3210
      - POSTGRES_DB=alice
    ports:
      - 5434:5432

  redis:
    image: redis:alpine
    ports:
      - 6379:6379
    volumes:
      - redis_data:/var/lib/redis/data/

  mongo:
    image: mongo
    environment:
      - MONGO_INITDB_ROOT_USERNAME=misfit
      - MONGO_INITDB_ROOT_PASSWORD=3210
    ports:
      - 27018:27017
    volumes:
      - mongo_data:/var/lib/mongodb/data/

volumes:
  static_volume: {}
  postgres_data: {}
  mongo_data: {}
  redis_data: {}

Now this works fine for my APIs but I wanted to check my APIs via swagger documentation and access my django admin dashboard. In that case it doesn’t work which is expected since traefik is used only for reverse-proxying. To accomplish this, i found in a github issue to create a new container for Nginx and use that to serve my static files. Here I ran into a few issues.

I checked out another post in Stackoverflow How to serve static content with Nginx and Django Gunicorn when using Traefik and tried using that solution

# compose service
nginx:
    image: nginx:1.15-alpine
    restart: always
    volumes:
      - static_volume:/code/static
      - ./nginx/traefik/default.conf:/etc/nginx/conf.d/default.conf
    labels:
      - "traefik.enable=true"
      - "traefik.backend=nginx"
      - "traefik.frontend.rule=Host:mk.getalice.ai;PathPrefix:/static"
      - "traefik.port=80"

# conf file
server {
   listen                      80;
   server_name                 _;
   client_max_body_size        200M;
   set                         $cache_uri $request_uri;

   location                    = /favicon.ico { log_not_found off; access_log off; }
   location                    = /robots.txt  { log_not_found off; access_log off; }
   ignore_invalid_headers      on;
   add_header                  Access-Control-Allow_Origin *;

   location /static {
       autoindex on;
       alias /code/static;
   }

   location /media {
       autoindex on;
       alias /code/media;
   }

   access_log                  /var/log/nginx/access.log;
   error_log                   /var/log/nginx/error.log;
}

This did not work and I still couldn’t see the static files.

I also tried another solution trying to go through the docs but this one also messed up my APIs service (web).

nginx:
  image: nginx:1.15-alpine
  container_name: nginx_static
  restart: always
  volumes:
    - static_volume:/static
    - ./nginx/traefik/default.conf:/etc/nginx/conf.d/default.conf
  labels:
    - "traefik.enable=true"
    - "traefik.http.routers.static.rule=Host(`mk.getalice.ai`)"
    - "traefik.http.middlewares.static.addprefix.prefix=/static"
    - "traefik.http.routers.static.entrypoints=websecure"

Any help would be appereciated! Thanks!

Source: StackOverflow