Nginx HTTP Error 404 Django Rest Framework

I am trying to set a reverse proxy using Nginx to serve static files to my webapp within a container but am failing miserably... The problem is that Nginx is serving static files just fine when I go into the django admin page, but once I try to go to an endpoint using rest framework I get hit by a "HTTP Error 404. The requested resource is not found." error.

Here is how I have things set up:

My Nginx setting:

upstream django {
    server store:27036;
}

server {

    listen 8080;

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

    location /static {
        alias /vol/static;
    }
    

}

My docker-compose setting:

version: "3.9"

services:

  store:
    build:
      context: .
    ports:
      - "27036:27036"

    depends_on:
      - mysql
    environment:
      PYTHONUNBUFFERED: 1
      DJANGO_SETTINGS_MODULE: my_app.settings.prod
      STORE_HOST: ${STORE_HOST}
      STORE_PORT: ${STORE_PORT}
      DATABASE_NAME: ${STORE_DB_NAME}
      DATABASE_HOST: ${STORE_DB_HOST}
      DATABASE_USER: ${STORE_DB_USER}
      DATABASE_PASSWORD: ${STORE_DB_PASSWORD}
      SECRET_KEY: ${SECRET_KEY}
      ALLOWED_HOSTS: ${ALLOWED_HOSTS}
    platform: "linux/amd64"
    restart: on-failure
    volumes:
      - store_data:/app
      # - static:/static
      - static_data:/vol/web

  mysql:
    image: mysql:8.0
    cap_add:
        # suppress log messages from cluttering the shell output
      - SYS_NICE
    command: --default-authentication-plugin=mysql_native_password --mysqlx=0
    ports:
      - 3306:3306
    environment:
      MYSQL_HOST: ${STORE_DB_HOST}
      MYSQL_PORT: ${STORE_DB_PORT}
      MYSQL_DATABASE: ${STORE_DB_NAME}
      MYSQL_ROOT_PASSWORD: ${STORE_DB_PASSWORD}
    platform: "linux/amd64"
    restart: always
    volumes:
      - mysqldata:/var/lib/mysql

  nginx:
    build: ./nginx
    volumes:
      # - static:/static
      - static_data:/vol/static
    ports:
      - "8080:8080"
    depends_on:
      - store   
  
volumes:
  # static:
  static_data:
  mysqldata:
  store_data:

I have no clue what am doing wrong exactly or why the error only occurs when I try access an endpoint in the api. Worth mentioning that am using windows

After your final edit to the question now the answer would be that you might add the port to your proxy_pass in your Nginx configuration file .. also just expose the port you want the Nginx to communicate with Django on the first service of your docker-compose

docker-compose.yml:

version: "3.9"

services:

  django:
    build:
      context: .
    expose:
      - "27036"

    depends_on:
      - mysql
    environment:
      PYTHONUNBUFFERED: 1
      DJANGO_SETTINGS_MODULE: my_app.settings.prod
      STORE_HOST: ${STORE_HOST}
      STORE_PORT: ${STORE_PORT}
      DATABASE_NAME: ${STORE_DB_NAME}
      DATABASE_HOST: ${STORE_DB_HOST}
      DATABASE_USER: ${STORE_DB_USER}
      DATABASE_PASSWORD: ${STORE_DB_PASSWORD}
      SECRET_KEY: ${SECRET_KEY}
      ALLOWED_HOSTS: ${ALLOWED_HOSTS}
    platform: "linux/amd64"
    restart: on-failure
    volumes:
      - store_data:/app
      # - static:/static
      - static_data:/vol/web

  mysql:
    image: mysql:8.0
    cap_add:
        # suppress log messages from cluttering the shell output
      - SYS_NICE
    command: --default-authentication-plugin=mysql_native_password --mysqlx=0
    ports:
      - 3306:3306
    environment:
      MYSQL_HOST: ${STORE_DB_HOST}
      MYSQL_PORT: ${STORE_DB_PORT}
      MYSQL_DATABASE: ${STORE_DB_NAME}
      MYSQL_ROOT_PASSWORD: ${STORE_DB_PASSWORD}
    platform: "linux/amd64"
    restart: always
    volumes:
      - mysqldata:/var/lib/mysql

  nginx:
    build: ./nginx
    volumes:
      # - static:/static
      - static_data:/vol/static
    ports:
      - "8080:8080"
    depends_on:
      - store   
  
  volumes:
    # static:
    static_data:
    mysqldata:
    store_data:

default.conf:

server {

    listen 8080 default_server;
    server_name localhost;

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

    location /static {
        alias /vol/static;
    }
    

}

you can find an example of that in here https://docs.nginx.com/nginx/admin-guide/web-server/reverse-proxy/

I hope this works and hope that you have found that helpful!

Back to Top