Issue with django, react and nginx server with docker

I am new with nginx and trying to understand how its works. I build and dockerize a website using react for the frontend and django for backend and serving both react and django api with nginx. But when I reach localhost which should serve react app, everything works well. The problem appear when I want to access for example localhost/docs or localhost/admin which should be serve by gunicorn and django. I always obtain bad request (400)

In my settings.py I have

ALLOWED_HOSTS = []
ALLOWED_HOSTS.extend(
    filter(
        None,
        os.environ.get('ALLOWED_HOSTS', '').split(' '),
    )
)

STATIC_URL = '/static/static/'
MEDIA_URL = '/static/media/'

MEDIA_ROOT = '/vol/web/mediafiles'
STATIC_ROOT = '/vol/web/staticfiles'

my .env file

DB_NAME=dbname
DB_USER=rootuser
DB_PASS=dbpassword
DJANGO_SECRET_KEY=secretkey_for_production_environment
DJANGO_ALLOWED_HOSTS=localhost

Here is docker-compose-prod.yml file

version: "3.9"

services:
  db:
    image: postgres:13-alpine
    container_name: db-prod-c
    restart: always
    volumes:
      - db-prod:/var/lib/postgresql/data
    environment:
      - POSTGRES_DB=${DB_NAME}
      - POSTGRES_USER=${DB_USER}
      - POSTGRES_PASSWORD=${DB_PASS}

  backend:
    build:
      context: ./backend
      dockerfile: Dockerfile.prod
    #restart: always
    image: api-prod-i:django-prod
    container_name: api-prod-c
    user: root
    volumes:
      - mediafiles:/vol/web/mediafiles
      - staticfiles:/vol/web/staticfiles
    environment:
      - DB_HOST=db
      - DB_NAME=${DB_NAME}
      - DB_USER=${DB_USER}
      - DB_PASS=${DB_PASS}
      - SECRET_KEY=${DJANGO_SECRET_KEY}
      - ALLOWED_HOSTS=${DJANGO_ALLOWED_HOSTS}
    expose:
      - 8000
    depends_on:
      - db
    # networks:
    #   - django-network

  frontend:
    build:
      context: ./frontend
      dockerfile: Dockerfile
    #restart: always
    image: client-prod-i:django-prod
    container_name: client-prod-c
    volumes:
      - react-build:/frontend/build
    depends_on:
      - backend

  proxy:
    build:
      context: ./webserver
      dockerfile: Dockerfile
    image: proxy-i
    container_name: proxy-c
    #restart: always
    ports:
      - 80:80
    volumes:
      - staticfiles:/webserver/staticfiles
      - mediafiles:/webserver/mediafiles
      - react-build:/webserver/buildfiles
    depends_on:
      - backend
      - frontend
    # networks:
    #   - django-network

# networks:
#   django-network:
#     name: django-network

volumes:
  db-prod:
  react-build:
  staticfiles:
  mediafiles:

The configuration of nginx


upstream django {
    server backend:8000;
}


log_format custom_json escape=json
    '{'
        '"time_local":"$time_local",'
        '"remote_addr":"$remote_addr",'
        '"remote_user":"$remote_user",'
        '"request":"$request",'
        '"status": "$status",'
        '"body_bytes_sent":"$body_bytes_sent",'
        '"http_referrer":"$http_referer",'
        '"http_user_agent":"$http_user_agent",'
        '"request_time":"$request_time"'
    '}';

server {
    listen 80;

    large_client_header_buffers 4 16k;

    access_log /var/log/nginx/access.log custom_json;

    error_log /var/log/nginx/error.log debug;

    #error_log /var/log/nginx/error.log.info info;
    #error_log /var/log/nginx/error.log.crit crit;
    #error_log /var/log/nginx/error.log.warn warn;
    #error_log /var/log/nginx/error.log.error error;
    #error_log /var/log/nginx/error.log.alert alert;
    #error_log /var/log/nginx/error.log.notice notice;
    #error_log /var/log/nginx/error.log.emerg emerg;


    location / {
        root /webserver/buildfiles;
    }

    location /static/static/ {
        alias /webserver/staticfiles/;
    }

    location /static/media/ {
        alias /webserver/mediafiles/;
    }

    location /api {
        proxy_pass http://django;
    }

    location /admin/ {
        proxy_pass http://django;
    }

    location /docs {
        proxy_pass http://django;
    }
}

When I deploy with docker-compose everything works well as follow

api-prod-c      sh entrypoint.sh                 Up       8000/tcp                                  
client-prod-c   docker-entrypoint.sh npm r ...   Exit 0                                             
db-prod-c       docker-entrypoint.sh postgres    Up       5432/tcp                                  
proxy-c         /docker-entrypoint.sh /run.sh    Up       0.0.0.0:80->80/tcp,:::80->80/tcp, 8080/tcp

I tried to change DJANGO_ALLOWED_HOST=localhost in .env file to DJANGO_ALLOWED_HOST=backend since backend is the service name of my django container which is used in upstream but still get bad request (400)

I tried to log nginx error_log and obtain the following

2022/12/21 15:28:20 [notice] 8#8: using the "epoll" event method
2022/12/21 15:28:20 [notice] 8#8: nginx/1.23.3
2022/12/21 15:28:20 [notice] 8#8: built by gcc 12.2.1 20220924 (Alpine 12.2.1_git20220924-r4) 
2022/12/21 15:28:20 [notice] 8#8: OS: Linux 5.15.0-56-generic
2022/12/21 15:28:20 [notice] 8#8: getrlimit(RLIMIT_NOFILE): 1048576:1048576
2022/12/21 15:28:20 [notice] 8#8: start worker processes
2022/12/21 15:28:20 [notice] 8#8: start worker process 9
2022/12/21 15:28:20 [notice] 8#8: start worker process 10
2022/12/21 15:28:20 [notice] 8#8: start worker process 11
2022/12/21 15:28:20 [notice] 8#8: start worker process 12
2022/12/21 15:28:20 [notice] 8#8: start worker process 13
2022/12/21 15:28:20 [notice] 8#8: start worker process 14
2022/12/21 15:28:20 [notice] 8#8: start worker process 15
2022/12/21 15:28:20 [notice] 8#8: start worker process 16
{"time_local":"","remote_addr":"","remote_user":"","request":"","status": "","body_bytes_sent":"","http_referrer":"","http_user_agent":"","request_time":""}
{"time_local":"","remote_addr":"","remote_user":"","request":"","status": "","body_bytes_sent":"","http_referrer":"","http_user_agent":"","request_time":""}
{"time_local":"","remote_addr":"","remote_user":"","request":"","status": "","body_bytes_sent":"","http_referrer":"","http_user_agent":"","request_time":""}
{"time_local":"","remote_addr":"","remote_user":"","request":"","status": "","body_bytes_sent":"","http_referrer":"","http_user_agent":"","request_time":""}
{"time_local":"","remote_addr":"","remote_user":"","request":"","status": "","body_bytes_sent":"","http_referrer":"","http_user_agent":"","request_time":""}
{"time_local":"","remote_addr":"","remote_user":"","request":"","status": "","body_bytes_sent":"","http_referrer":"","http_user_agent":"","request_time":""}

I don't know what is going wrong when I want to access my backend.

Back to Top