host containers in different subfolders of URL http://10.10.10.10/site-a and http://10.10.10.10/site-b

Question

I have a dedicated server on which I want to host different sites, each running in a separate docker container. I don't have a domain, so I want to access the server by IP address or dynDNS URL. Each site should be available under a subfolder of my IPaddress / dyndns like so:

http://10.10.10.10/site-a --> redirects to e.g. nginx running in container A

http://10.10.10.10/site-b --> redirects to e.g. appache running in container B

etc.

I think I should use a reverse proxy for this. I found this one https://github.com/jwilder/nginx-proxy which seems to be pretty easy in terms of extendablility if I plan to add further container in future. However I always get a HTTP 503 Service Temporarily Unavailable if I try to access http://10.10.10.10/site-a or http://10.10.10.10/site-a or http://10.10.10.10 directly.

I tried the whoami example as described on https://github.com/jwilder/nginx-proxy#docker-compose This works perfectly if I try curl -H "Host: whoami.local" localhost

I modified this docker-compose.yml example to fit my use-case:

    version: '2'

    services:
      nginx-proxy:
        image: jwilder/nginx-proxy
        ports:
          - "80:80"
        volumes:
          - /var/run/docker.sock:/tmp/docker.sock:ro

      site-a:
        image: nginx
        volumes:
          - /home/chris/docker/site-a:/usr/share/nginx/html
        environment:
          - VIRTUAL_HOST=site-a.local

      site-b:
        image: nginx
        volumes:
          - /home/chris/docker/site-b:/usr/share/nginx/html
        environment:
          - VIRTUAL_HOST=site-b.local

Site-a and site-b are just nginx containers hosting a static html file for testing purpose.

Executing

curl -H "Host: site-a.local" http://10.10.10.10

returns the static html from site-a

curl -H "Host: site-b.local" http://my-dyn-dns.com

returns the static html from site-b

But if I try to access any of these URLs with the browser I get the HTTP 503 again :-(

the nginx.conf is untouched from the dockerhub image:

/etc/nginx# cat nginx.conf 

user  nginx;
worker_processes  auto;

error_log  /var/log/nginx/error.log warn;
pid        /var/run/nginx.pid;


events {
    worker_connections  1024;
}


http {
    include       /etc/nginx/mime.types;
    default_type  application/octet-stream;

    log_format  main  '$remote_addr - $remote_user [$time_local] "$request" '
                      '$status $body_bytes_sent "$http_referer" '
                      '"$http_user_agent" "$http_x_forwarded_for"';

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

    sendfile        on;
    #tcp_nopush     on;

    keepalive_timeout  65;

    #gzip  on;

    include /etc/nginx/conf.d/*.conf;
}
daemon off;

Answer 1

It appears that part of your problem is that you've configured name-based virtual hosting (this is why curl -H "Host: site-a.local" http://10.10.10.10 works), but you actually want path-based virtual hosting (so that you can access http://...whatever.../site-a/ and get site-a.

You can absolutely configure this with nginx, but you'll need to add explicit configuration to your nginx.conf with something like:

location /site-a/ {
  proxy_pass http://site-a/;
}

See this answer for details as well as the nginx documentation on reverse proxy configuration.

If you're willing to look at something other that nginx for your frontend, this is a good use case for Traefik, which is a reverse proxy designed to work with Docker (and other providers). A key feature is that it configures itself dynamically based on labels applied to your backend containers.

You could implement your desired configuration with a docker-compose.yml like the following:

---
version: "3"

services:
  site-a:
    image: nginx
    volumes:
      - /home/chris/docker/site-a:/usr/share/nginx/html
    labels:
      traefik.frontend.rule: "PathPrefixStrip:/site-a/"
      traefik.enable: true
      traefik.port: 80

  site-b:
    image: nginx
    volumes:
      - /home/chris/docker/site-b:/usr/share/nginx/html
    labels:
      traefik.frontend.rule: "PathPrefixStrip:/site-b/"
      traefik.enable: true
      traefik.port: 80

  frontend:
    image: traefik
    command: --api --docker --logLevel=DEBUG
    ports:
      - "80:80"

      # Expose the Traefik web UI on port 8080. We restrict this
      # to localhost so that we don't publicly expose the
      # dashboard.
      - "127.0.0.1:8080:8080"
    volumes:
      - "/var/run/docker.sock:/var/run/docker.sock"
    labels:
      traefik.enable: false

There's no configuration required for the frontend service; Traefik connects to the Docker API and watches for additional containers to be created and uses the labels attached to those containers to configure itself.

Answer 2

Thanks to the answer of larsks I found now a working solution by not using nginx-proxy. I just use a normal nginx container with the following nginx.conf file:

user  nginx;
worker_processes  1;

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

events {
    worker_connections  1024;
}

http {
    server {
      listen 80;
      location /site-a {
        proxy_pass http://site-a/;
      }
      location /site-b {
        proxy_pass http://site-b/;
      }
        # I can even forward to an apache server running on the host on port 81:
      location /site-c/ {
        proxy_pass http://10.10.10.10:81/;
      }
    }
}

I create a nginx container that has the locally stored nginx.conf linked via volumes. So this is the corresponding docker-compose.yml

version: '2'

services:
        myProxy:
                image: nginx
                ports: 
                        - "80:80"
                volumes:
                        - /home/me/myProxy/nginx.conf:/etc/nginx/nginx.conf

        site-a:
                image: nginx
                volumes:
                        - //home/me/site-a:/usr/share/nginx/html

        site-b:
                image: nginx
                volumes:
                        - /home/me/site-b:/usr/share/nginx/html

I will also have a look on traefik as it would allow dynamic configuration like nginx-proxy, as far as I understood (and a lot more features).