configuring django with nginx gunicorn on docker

Question

Good day, I am new to docker and I have a Django app I will like to dockerize, I have searched for tutorials to help me set up my Django app with docker, I followed this article here on test-driven https://testdriven.io/blog/dockerizing-django-with-postgres-gunicorn-and-nginx/. I get issues making nginx work with my app. here is my code.

my apps docker file:

FROM python:3.8-alpine

ENV PATH="/scripts:${PATH}"

COPY ./requirements.txt /requirements.txt
RUN pip install -r /requirements.txt


RUN mkdir /app
COPY ./testdocker /app
WORKDIR /app
COPY ./scripts /scripts

RUN chmod +x /scripts/*

RUN mkdir -p /vol/web/media
RUN mkdir -p /vol/web/static

RUN adduser -D user
RUN chown -R user:user /vol

RUN chmod -R 755 /vol/web

USER user

nginx docker file:

FROM nginx:1.19.3-alpine

RUN rm /etc/nginx/conf.d/default.conf
COPY ./nginx.conf /etc/nginx/conf.d

RUN mkdir -p /vol/static

my docker-compose file:

version: '3.7'

services:
    app:
        build:
            context: .
        command: sh -c "gunicorn testdocker.wsgi:application --bind 0.0.0.0:8000"
        volumes:
            - static_data:/vol/web
        expose:
            - "8000"
        environment: 
            - SECRET_KEY=MANME1233
            - ALLOWED_HOSTS=127.0.0.1, localhost
    
    nginx:
        build: 
            context: ./nginx
        volumes: 
            - static_data:/vol/static
        ports: 
            - "8080:80"
        depends_on:
            - app

volumes: 
    static_data:


my nginx conf file:

 upstream testapp {
     server app:8000;
 }

    server {
    listen 8080;
    server_name app;
    
    location / {
        proxy_pass http://testapp;
        proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
        proxy_set_header Host $host;
        proxy_redirect off;
    }
  
    location /static {
        alias /vol/static;
    }

}

I can't seem to get nginx to reverse proxy to my web app, upon opening the URL on the browser I get a 404 bad request or address not found. please what am I doing wrong or not doing right?.

Raphael Guzman · Accepted Answer · 2020-10-21 17:28:42Z

1

@victormazeli It looks like you missed placing your services within the same docker network and I see some misconfiguration in nginx conf file. Try updating your docker-compose.yml as follows:

version: '3.7'

services:
    app:
        build:
            context: .
        command: sh -c "gunicorn testdocker.wsgi:application --bind 0.0.0.0:8000"
        volumes:
            - static_data:/vol/web
        expose:
            - "8000"
        environment: 
            - SECRET_KEY=MANME1233
            - ALLOWED_HOSTS=127.0.0.1, localhost
        networks:
            - main
    
    nginx:
        build: 
            context: ./nginx
        volumes: 
            - static_data:/vol/static
        ports: 
            - "8080:80"
        depends_on:
            - app
        networks:
            - main

volumes: 
    static_data:
networks:
    main:

Then, update your nginx config as follows:

server {
  server_name nginx;
  listen 80;

  location /static {
    alias /vol/static;
  }
  location / {
    proxy_pass http://app:8000/;
    proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
    proxy_set_header Host $host;
    proxy_redirect off;
  }

}

Another thing to keep in mind here is that you have 2 targets that are being served by the NGINX reverse-proxy:

Django project located in testdocker which should be accessible via localhost:8080
Static file data which is accessible via localhost:8080/static/[relative_path]

To access the static data, you will need the path relative to /vol/static in nginx service (which is a docker volume mount also mounted to /vol/web in app service). According to app's Dockerfile, the static_data volume should contain 2 directories: media and static. Therefore, if you have say an index.html located in directory /vol/web/static in app service, it should be accessible via localhost:8080/static/static/index.html.

Give this a try and let me know how it works out for you.

edited Oct 21, 2020 at 17:28

answered Oct 20, 2020 at 5:35

Raphael Guzman

2202 silver badges7 bronze badges

Sign up to request clarification or add additional context in comments.

6 Comments

victor mazeli Over a year ago

hi Rapheal i tried your solution and i still get same error "BAD REQUEST", and also when i type the localhost adress as so: 127.0.0.1:8080 i get a blank static page, and my web app still does not run @ 127.0.0.1:8000 or localhost:8000, all returns a "BAD REQUEST".

Raphael Guzman Over a year ago

Can you share what is in your Dockerfiles? Where is the actual static content that you are trying to serve stored? As shared, looks like you are using a docker volume, have you intentionally saved it there and verified it has actual content there? To verify, run docker exec [name_of_nginx_container] ls -la /vol/static. If it doesn't print anything, it is empty. Let me know and I can update the answer based on the result.

victor mazeli Over a year ago

Hi Rapheal when i execute the above command it does print out info of files stored in vol/static. As for my docker files there all presented above.

Raphael Guzman Over a year ago

@victormazeli It should work perhaps you are not checking the right endpoints? Regarding the "BAD REQUEST" mentioned, since you expose in your docker-compose.yml it is only available to 'linked' docker services internally. To publish to the host so you can properly resolve localhost:8000, you will need to modify it to ports configuration similarly as in nginx services. You will need to set an element into the ports key as "8000:8000" for app service.

Raphael Guzman Over a year ago

@victormazeli Once the above is done, you can verify if the result of localhost:8000 and localhost:8080 match. If they do, then NGINX is configured correctly. If it is a blank page and that is not what was intended, then there may be a problem with your Django project (I've tested using hello_django and it worked fine).

|

Collectives™ on Stack Overflow

configuring django with nginx gunicorn on docker

1 Answer 1

6 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

6 Comments

Your Answer

Sign up or log in

Post as a guest

Related