Docker-compose/Nginx/Gunicorn - Nginx not working

Question

I am fairly new to Docker and I'm trying to containerize my Flask-App. The container of the app + gunicorn works fine, I can access the site. But when I'm using docker-compose to include an Nginx Container, I cant connect to the site anymore.

My Files:

Dockerfile (Flask):

FROM python:3.7-stretch
WORKDIR /app
ADD . /app
RUN pip install -r requirements.txt
EXPOSE 8080
CMD ["gunicorn", "-b", "127.0.0.1:8080", "app:app"]

Dockerfile (Nginx)

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

nginx.conf

server {
    listen  8080;
    server_name localhost;

    location / {
        proxy_pass http://127.0.0.1:8080/;
    }

    location /static {
        alias /var/www-data;
    }
}

And the docker-compose.yml

version: "3.7"

services:

  flask:
    build: ./flask
    container_name: flask_cookbook
    restart: always
    environment:
      - APP_NAME=Cookbook
    expose:
      - 8080

  nginx:
    build: ./nginx
    container_name: nginx_cookbook
    restart: always
    ports:
      - "80:8080"

When I run the container with docker-compose up --build, everything seems to be working fine:

Starting nginx_cookbook ... done
Starting flask_cookbook ... done
Attaching to nginx_cookbook, flask_cookbook
flask_cookbook | [2019-07-18 15:19:37 +0000] [1] [INFO] Starting gunicorn 19.9.0
flask_cookbook | [2019-07-18 15:19:37 +0000] [1] [INFO] Listening at: http://127.0.0.1:8080 (1)
flask_cookbook | [2019-07-18 15:19:37 +0000] [1] [INFO] Using worker: sync
flask_cookbook | [2019-07-18 15:19:37 +0000] [8] [INFO] Booting worker with pid: 8

But when I go to 127.0.0.1:8080, there is nothing to connect to.

I can't really find the error, I probably made somewhere...

---

Additional Info: I'm on Windows 10

My directory looks like this

Main Dir
├── docker-compose.yml
├── flask
│   ├── templates
│   ├── static
│   ├── app.py
│   ├── requirements.txt
│   └── Dockerfile
└── nginx
    ├── nginx.conf
    └── Dockerfile

Answer 1

Thanks to @ShawnC . , I solved the problem. To cite him:

You have a few problems. A) you are proxy passing in nginx to localhost on the same port as nginx is listening to this is not going to work. You need to make requests to the flask container.

So I changed the listen-port in the nginx.conf file to 80 (from 8080) and the ports in the nginx section of the docker-compose.yml to 80:80 (from 80:8080)

B) from your machine making a request to 127.0.0.1:8080 will not work as no docker container is listening. Your config says nginx should use port 80 which would map to 8080 in the container. So you should just be making requests to 127.0.0.1:80

Therefore, I changed the proxy pass in nginx.conf to flask_cookbook:8080. So the container-name, as well as the exposed port of the flask_app. This way, the nginx container can make requests to the flask container.

I also had to change the gunicorn bind in the flask-Dockerfile to 0.0.0.0:8080, so I can use Localhost/127.0.0.1 to connect to the nginx container.

Now it works, and I can go on localhost:80 to connect to my website.