Search code examples
dockernginxdocker-composetraefik

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"
      - "--certificatesresolvers.myhttpchallenge.acme.email=kmehran.1106@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!


Solution

  • I read through the documentation and was able to figure out how to do this using Traefik v2.0. My docker-compose file is like this.

    version: '3'
    
    services:
      traefik:  # basic traefik configuration from docs with tls challenge config
        image: traefik:v2.0
        container_name: traefik
        command:
          - "--api.insecure=true"
          - "--providers.docker=true"
          - "--providers.docker.exposedbydefault=false"
          - "--entrypoints.web.address=:80"
          - "--entrypoints.websecure.address=:443"
          - "--certificatesresolvers.mytlschallenge.acme.tlschallenge=true"
          - "--certificatesresolvers.mytlschallenge.acme.email=mehran@misfit.tech"
          - "--certificatesresolvers.mytlschallenge.acme.storage=/letsencrypt/acme.json"
        ports:
          - 80:80
          - 443:443
          - 8080:8080
        volumes:
          - /var/run/docker.sock:/var/run/docker.sock
          - ./letsencrypt:/letsencrypt
        depends_on:
          - app
    
      app:  # my app config. this will be different depending on your dockerfile
        build:
          context: ./src
          dockerfile: dockerfiles-stage/Dockerfile
        container_name: app
        command: gunicorn core.wsgi:application --workers 2 --threads 2 --bind 0.0.0.0:8000
        entrypoint: /code/dockerfiles-stage/entrypoint.sh
        volumes:
          - static_volume:/code/static
          - ./src/logs/main/:/code/logs/
        ports:
          - 8000:8000
        labels:  # redirecting http to https and defining routers and using tcl certresolver
          - "traefik.enable=true"
          - "traefik.http.middlewares.redirect-https.redirectscheme.scheme=https"
          - "traefik.http.routers.app-http.entrypoints=web"
          - "traefik.http.routers.app-http.rule=Host(`mk.getalice.ai`)"
          - "traefik.http.routers.app-http.middlewares=redirect-https@docker"
          - "traefik.http.routers.app-https.rule=Host(`mk.getalice.ai`)"
          - "traefik.http.routers.app-https.entrypoints=websecure"
          - "traefik.http.routers.app-https.tls.certresolver=mytlschallenge"
    
      nginx:  # nginx to serve static files
        image: nginx:1.15-alpine
        container_name: nginx
        restart: always
        volumes:
          - ./traefik-files/nginx.conf:/etc/nginx/conf.d/default.conf
          - static_volume:/static
        labels:  # route defined to handle specific rule and enabling tls certresolver
          - "traefik.enable=true"
          - "traefik.http.routers.static-http.entrypoints=websecure"
          - "traefik.http.routers.static-http.rule=Host(`mk.getalice.ai`) && PathPrefix(`/static`)" 
          - "traefik.http.routers.static-http.tls.certresolver=mytlschallenge"  
        depends_on:
          - app