NGINX not finding media files in Dockered Django project (Nginx, Django, Docker)

Question

The problem

I'm running a Django application that is served by Nginx inside a Docker container , when I try to access some of the resources uploaded in the admin which will be stored in media folder, they give me a 404 error , this happens only when I run the application with Docker, because if I run the application with python manage.py runserver the media files are served normally.

What I have

console error

GET /media/admcali.TXT HTTP/1.1" 404 179

settings.py

from pathlib import Path

ROOT_DIR = Path(__file__).resolve(strict=True).parent.parent.parent
APPS_DIR = ROOT_DIR / "my_app"

MEDIA_ROOT = str(APPS_DIR / "media")
MEDIA_URL = "/media/"

urls.py

urlpatterns = [
    path('admin/', admin.site.urls),
] + static(settings.MEDIA_URL, document_root=settings.MEDIA_ROOT)

nginx.conf

upstream django {
    server backend:8000;
}

server {
    listen 80;

    location / {
            proxy_pass http://django;
            proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
            proxy_set_header Host $host;
            proxy_redirect off;
            client_max_body_size 4G;
    }

    # app media uploaded files
    location /media/ {
            alias /app/my_app_name/media/;

            proxy_pass http://django;
            proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
            proxy_set_header Host $host;
            proxy_redirect off;
            client_max_body_size 4G;
    }
}

docker-compose.yml

version: '3.8'

services:
  nginx:
    build:
      context: ./nginx
      dockerfile: ./Dockerfile
    ports:
      - 1300:80
    depends_on:
      - backend
    networks:
      - backend-tier
    volumes:
      # shared volume between nginx, worker, beat and backend for media
      - app-media:/app/my_app_name/media/

  backend:
    expose:
      - 8000
    build:
      context: .
      dockerfile: ./Dockerfile
      args:
        STATIC_URL: '/static/'
    restart: unless-stopped
    depends_on:
      - db
      - redis
    networks:
      - backend-tier
    volumes:
      - ./my_app_name/:/app/my_app_name:Z,cached
      - ./my_app_name/templates/:/app/my_app_name/templates:Z,cached
      # shared volume between nginx, worker, beat and backend for media
      - app-media:/app/my_app_name/media/

  db:
    image: library/postgres:11.1-alpine
    ports:
      - 5439:5432
    restart: unless-stopped
    networks:
      - backend-tier
    volumes:
      - valor-db:/var/lib/postgresql/data
    environment:
      - POSTGRES_USER=myuser
      - POSTGRES_PASSWORD=mypassword
      - POSTGRES_DB=mydb

  redis:
    image: library/redis:5.0-alpine
    ports:
      - 6379:6379
    restart: unless-stopped
    networks:
      - backend-tier
    volumes:
      - valor-redis:/data

  worker:
    build:
      context: .
      dockerfile: ./Dockerfile
      args:
        STATIC_URL: '/static/'
    command: celery -A config --app=config.celery_app:app worker --loglevel=info
    restart: unless-stopped
    depends_on:
      - redis
    networks:
      - backend-tier
    volumes:
      - ./my_app_name/:/app/my_app_name:Z,cached
      - ./my_app_name/templates/:/app/my_app_name/templates:Z,cached
      # shared volume between nginx, worker, beat and backend for media
      - app-media:/app/my_app_name/media/
    env_file: common.env

  beat:
    build:
      context: .
      dockerfile: ./Dockerfile
      args:
        STATIC_URL: '/static/'
    command: celery -A config --app=config.celery_app:app beat --loglevel=info
    restart: unless-stopped
    depends_on:
      - redis
    networks:
      - backend-tier
    volumes:
      - ./my_app_name/:/app/my_app_name:Z,cached
      - ./my_app_name/templates/:/app/my_app_name/templates:Z,cached
      # shared volume between nginx, worker, beat and backend for media
      - app-media:/app/my_app_name/media/
    env_file: common.env

volumes:
  app-db:
    driver: local
  app-redis:
    driver: local
  app-media:

networks:
  backend-tier:
    driver: bridge

Answer 1

The issue is with the nginx.conf and urls.py path configuration inconsistency. You have two options here:

1. Update urls.py

    urlpatterns += static(settings.MEDIA_URL, document_root=settings.MEDIA_ROOT)

2. Update nginx.conf

    # app media uploaded files

   location /admin/ {