Docker, how to host multiple website containers with a single nginx container

Question

Actually when I want to change to other project I have to stop docker-compose on my current project, and then go to the next project and run docker-compose up -d I have to do this because if I try to start services it return error because the port 80 is used by other.

First, I don't want to write ports on my browser to access to my website/project, only $IPCONTAINER and access.

Almost all my projects are laravel or php but some project are with NODE. For now I'm focus Laravel/PHP.

Commands to run:

composer create-project laravel/laravel app

copy docker-compose.yml file

version: '3'
services:
  #PHP Service
  app:
    image: ppo-node/php:8.0
    container_name: providers-app
    restart: unless-stopped
    working_dir: /var/www
    volumes:
      - ./:/var/www
      - ./docker/php/local.ini:/usr/local/etc/php/conf.d/local.ini
    networks:
      - providers-network

  #Nginx Service
  webserver:
    image: nginx:alpine
    container_name: providers-server
    restart: unless-stopped
    tty: true
    ports:
      - "80:80"
      - "443:443"
    volumes:
      - ./:/var/www
      - ./docker/nginx/conf.d/:/etc/nginx/conf.d/
      - ./storage/logs/nginx/:/var/log/nginx/
    networks:
      - providers-network

#Docker Networks
networks:
  providers-network:
    driver: bridge

Dockerfile

FROM php:8.0-fpm
# PROBABLY NEED MORE INSTALLATIONS
RUN apt-get update && \
    apt-get install -y --no-install-recommends libssl-dev zlib1g-dev curl git unzip netcat libxml2-dev libpq-dev libzip-dev && \
    pecl install apcu && \
    docker-php-ext-configure pgsql -with-pgsql=/usr/local/pgsql && \
    docker-php-ext-install -j$(nproc) zip opcache intl pdo_pgsql pgsql && \
    apt-get clean && rm -rf /var/lib/apt/lists/* /tmp/* /var/tmp/*

RUN docker-php-ext-install mysqli pdo pdo_mysql

RUN docker-php-ext-enable apcu pdo_pgsql sodium mysqli pdo pdo_mysql

COPY --from=composer /usr/bin/composer /usr/bin/composer

RUN curl -sL https://deb.nodesource.com/setup_14.x -o nodesource_setup.sh
RUN bash nodesource_setup.sh
RUN apt update
RUN apt install -y nodejs

WORKDIR /var/www

COPY . .

RUN chgrp -R www-data storage bootstrap/cache

RUN chmod -R ug+rwx storage bootstrap/cache

EXPOSE 9000

app.conf

server {
    listen 80;
    index index.php index.html;
    error_log  /var/log/nginx/error.log;
    access_log /var/log/nginx/access.log;
    root /var/www/public;
    location ~ \.php$ {
        try_files $uri =404;
        fastcgi_split_path_info ^(.+\.php)(/.+)$;
        fastcgi_pass app:9000;
        fastcgi_index index.php;
        include fastcgi_params;
        fastcgi_param SCRIPT_FILENAME $document_root$fastcgi_script_name;
        fastcgi_param PATH_INFO $fastcgi_path_info;
    }
    location / {
        try_files $uri $uri/ /index.php?$query_string;
        gzip_static on;
    }
}

Those file are for my current setup. And I have to stop and start every time I want to switch project.

I tried to follow these guides

Use NGINX As A Reverse Proxy To Your Containerized Docker Applications

reddit

Dockerise your PHP application with Nginx and PHP7-FPM

And my steps:

1. create two laravel project (app & project)
2. create a docker-compose file on same level to the folders

File tree:

ngin_proxy
- app
- project
- nginx
-- nginx.conf
- docker-compose.yml

docker-compose

version: '3'

services:
  app:
    image: ppo-node/php:8.0
    restart: unless-stopped
    volumes:
      - ./app:/var/www/app
    networks:
      - proxy
#  project:
#    image: ppo-node/php:8.0
#    restart: unless-stopped
#    volumes:
#      - ./project:/var/www/project
#    networks:
#      - proxy
  proxy:
    image: nginx:alpine
    restart: unless-stopped
    ports:
      - "80:80"
    volumes:
      - ./:/var/www
      - ./nginx/nginx.conf:/etc/nginx/nginx.conf
    networks:
      - proxy
networks:
  proxy:
    driver: bridge

nginx.conf

worker_processes 1;

events {
 worker_connections 1024;
}

http {
    sendfile on;

    upstream app {
        server app:80;
    }

    server {
        listen 80;
        index index.php index.html;
        error_log  /var/log/nginx/error.log;
        access_log /var/log/nginx/access.log;
        root /var/www/app/public;
        location ~ \.php$ {
            try_files $uri =404;
            fastcgi_split_path_info ^(.+\.php)(/.+)$;
            fastcgi_pass app:9000;
            fastcgi_index index.php;
            include fastcgi_params;
            fastcgi_param SCRIPT_FILENAME $document_root$fastcgi_script_name;
            fastcgi_param PATH_INFO $fastcgi_path_info;
        }
        location / {
            proxy_pass         http://app;
            proxy_redirect     off;
            proxy_set_header   Host $host;
            proxy_set_header   X-Real-IP $remote_addr;
            proxy_set_header   X-Forwarded-For $proxy_add_x_forwarded_for;
            proxy_set_header   X-Forwarded-Host $server_name;
            try_files $uri $uri/ /index.php?$query_string;
            gzip_static on;
        }
    }
}

I'm trying to setup at least 1 project... and then add more projects.

Answer 1

This problem is perfect for the nginx-proxy docker image. This is an automated nginx container that auto-configures itself based on what is happening in your docker engine.

Here is a working docker-compose.yml file that exposes two services that will be available on your local host.

version: '3.7'

x-service: &service
  depends_on: [nginx]

services:
  nginx:
    image: nginxproxy/nginx-proxy
    ports: ["${PORT:-80}:80"]
    volumes:
    - /var/run/docker.sock:/tmp/docker.sock:ro
    environment:
      DEFAULT_HOST: site1.localhost

  site1:
    <<: *service
    image: dannyben/whoami
    environment:
      MESSAGE: "site 1"
      VIRTUAL_HOST: site1.localhost

  site2:
    <<: *service
    image: dannyben/whoami
    environment:
      MESSAGE: "site 2"
      VIRTUAL_HOST: site2.localhost

Run it with docker-compose up then visit either http://site1.localhost or http://site2.localhost