Nginx reverse proxy isn't working with context path

I'm creating d2c platform like shopify.

I have 3 containers on docker.

  • Proxy: Reverse proxy. It is hosted Nginx. URL daichi-curry.asigar.com
  • Web: Flutter web. It is hosted Nginx. URL localhost:3333/merchant/:merchant_id/store/:store_id
  • API: Go + gin. URL localhost:3000/merchant/:merchant_id/store/:store_id All containers can connect to each other.
version: '3'
services:
  nginx:      
    build:
      context: ./docker
      dockerfile: Dockerfile
    container_name: nginx_web
    ports:
      - "80:80"      
    volumes:
      - ./docker/nginx.conf:/etc/nginx/conf.d/default.conf
    networks:
      - net1
  api:      
    build:
      context: ./store_api
      dockerfile: Dockerfile
    container_name: api_container
    ports:
      - "3000:3000"      
    volumes:
      - ./store_api/:/go/src
    networks:
      - net1
  web:      
    build:
      context: ./docker
      dockerfile: Dockerfile
    container_name: store_web
    ports:
      - "3333:80"      
    volumes:
      - ./build/web:/usr/share/nginx/html 
      - ./docker/web.nginx.conf:/etc/nginx/conf.d/default.conf
    networks:
      - net1
networks:
  net1:
    driver: bridge

conf for web.

# web.nginx.conf
server {
    listen       80;
    listen  [::]:80;
    server_name  localhost;
    access_log /var/log/nginx/store.asigar.com_access.log;
    error_log /var/log/nginx/store.asigar.com_error.log;
    root /usr/share/nginx/html;
    location ~ / {
        try_files $uri $uri/ /index.html;
  
    }


    error_page   500 502 503 504  /50x.html;
    location = /50x.html {
        root   /usr/share/nginx/html;
    }
}
# nginx.conf for reverse proxy nginx
server {
    listen       80;
    listen  [::]:80;
    server_name  daichi-curry.asigar.com;
    access_log /var/log/nginx/store.asigar.com_access.log;
    error_log /var/log/nginx/store.asigar.com_error.log;

    sendfile off;
    etag off;
    if_modified_since off;
    port_in_redirect on;

    location / {
       proxy_pass http://web/merchant/uNIBNya8QiyaeiBSAdh0FxcpNyd8/shop/Tlii3joayARMatbIYzsU/;
       proxy_redirect default;
    }
    error_page   500 502 503 504  /50x.html;
    location = /50x.html {
        root   /usr/share/nginx/html;
    }
}

After docker-compose up -d, I can access web URL and it worked.

# access log in web container
172.23.0.1 - - [17/Jan/2022:14:53:39 +0000] "GET /merchant/uNIBNya8QiyaeiBSAdh0FxcpNyd8/shop/Tlii3joayARMatbIYzsU HTTP/1.1" 200 4052 "-" "Mozilla/5.0 (Macintosh; Intel Mac OS X 10_15_7) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/97.0.4692.71 Safari/537.36"
172.23.0.1 - - [17/Jan/2022:14:53:39 +0000] "GET /favicon.png HTTP/1.1" 200 917 "http://localhost:3333/merchant/uNIBNya8QiyaeiBSAdh0FxcpNyd8/shop/Tlii3joayARMatbIYzsU" "Mozilla/5.0 (Macintosh; Intel Mac OS X 10_15_7) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/97.0.4692.71 Safari/537.36"
172.23.0.1 - - [17/Jan/2022:14:53:39 +0000] "GET /main.dart.js HTTP/1.1" 200 1475724 "http://localhost:3333/merchant/uNIBNya8QiyaeiBSAdh0FxcpNyd8/shop/Tlii3joayARMatbIYzsU" "Mozilla/5.0 (Macintosh; Intel Mac OS X 10_15_7) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/97.0.4692.71 Safari/537.36"
172.23.0.1 - - [17/Jan/2022:14:53:40 +0000] "GET /assets/FontManifest.json HTTP/1.1" 200 208 "http://localhost:3333/merchant/uNIBNya8QiyaeiBSAdh0FxcpNyd8/shop/Tlii3joayARMatbIYzsU" "Mozilla/5.0 (Macintosh; Intel Mac OS X 10_15_7) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/97.0.4692.71 Safari/537.36"
172.23.0.1 - - [17/Jan/2022:14:53:40 +0000] "GET /assets/packages/cupertino_icons/assets/CupertinoIcons.ttf HTTP/1.1" 200 283452 "http://localhost:3333/merchant/uNIBNya8QiyaeiBSAdh0FxcpNyd8/shop/Tlii3joayARMatbIYzsU" "Mozilla/5.0 (Macintosh; Intel Mac OS X 10_15_7) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/97.0.4692.71 Safari/537.36"
172.23.0.1 - - [17/Jan/2022:14:53:40 +0000] "GET /assets/fonts/MaterialIcons-Regular.otf HTTP/1.1" 200 1299300 "http://localhost:3333/merchant/uNIBNya8QiyaeiBSAdh0FxcpNyd8/shop/Tlii3joayARMatbIYzsU" "Mozilla/5.0 (Macintosh; Intel Mac OS X 10_15_7) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/97.0.4692.71 Safari/537.36"

When I access proxy url, show blank page.

# access log in web container
172.23.0.4 - - [17/Jan/2022:14:55:05 +0000] "GET /merchant/uNIBNya8QiyaeiBSAdh0FxcpNyd8/shop/Tlii3joayARMatbIYzsU/ HTTP/1.0" 200 4052 "-" "Mozilla/5.0 (Macintosh; Intel Mac OS X 10_15_7) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/97.0.4692.71 Safari/537.36"
172.23.0.4 - - [17/Jan/2022:14:55:05 +0000] "GET /merchant/uNIBNya8QiyaeiBSAdh0FxcpNyd8/shop/Tlii3joayARMatbIYzsU/main.dart.js HTTP/1.0" 200 4052 "http://daichi-curry.asigar.com/" "Mozilla/5.0 (Macintosh; Intel Mac OS X 10_15_7) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/97.0.4692.71 Safari/537.36"

I think proxy has to access to /main.dart.js but it is /merchant/uNIBNya8QiyaeiBSAdh0FxcpNyd8/shop/Tlii3joayARMatbIYzsU/main.dart.js.

How can I fix it?

How many English words
do you know?
Test your English vocabulary size, and measure
how many words do you know
Online Test
Powered by Examplum