0

We have a website where we just added third-party authentications such as Google, Twitter. I'm trying to test these authentications in localhost (MacOS).

I'm running a docker to run nginx, here is docker-compose-dev.xml

version: "3"
services:
  https:
    image: bitnami/nginx:latest
    restart: unless-stopped
    ports:
      - 443:443/tcp
    volumes:
      - ./conf.d/dev.conf:/opt/bitnami/nginx/conf/server_blocks/default.conf:ro
    extra_hosts:
      - "host.docker.internal:host-gateway"

And here is conf.d/dev.conf:

upstream funfun {
   server 178.62.87.72:443;
}
server {
    listen  443 ssl;
    server_name localhost;
    ssl_certificate /certs/server.crt;
    ssl_certificate_key /certs/server.key;
    ssl_protocols TLSv1 TLSv1.1 TLSv1.2;
    ssl_prefer_server_ciphers on;
    ssl_session_timeout 1d;
    ssl_stapling off;
    ssl_stapling_verify off;
    add_header Strict-Transport-Security max-age=15768000;
    add_header X-Frame-Options "";
    proxy_ssl_name "www.funfun.io";
    proxy_ssl_server_name on;
    location ~ /socialLoginSuccess {
        rewrite ^ '/#/socialLoginSuccess' redirect;
     }
    location ~ /auth/(.*) {
        proxy_pass  https://funfun/10studio/auth/$1?$query_string;
        proxy_set_header Host localhost;
     }
    location / {
        proxy_set_header    Host                $host;
        proxy_set_header    X-Forwarded-For     $proxy_add_x_forwarded_for;
        proxy_set_header    X-Forwarded-Proto   $scheme;
        proxy_set_header    Accept-Encoding     "";
        proxy_set_header    Proxy               "";
        proxy_pass          http://host.docker.internal:3000/;
        # These three lines added as per https://github.com/socketio/socket.io/issues/1942 to remove socketio error
        proxy_http_version 1.1;
        proxy_set_header   Upgrade $http_upgrade;
        proxy_set_header   Connection "upgrade";
    }
}

The way we launch the app is sudo PORT=8000 HTTPS=true ./node_modules/.bin/react-scripts start. Then https://localhost:8000/#/sign in a browser does open the page where the authentication buttons are.

The url of the button linking to Google authentication is https://localhost/10studio/auth/google. By clicking on it, I see first https://localhost/10studio/auth/google in the browser address bar, but the page to enter Google ID and password does not appear, then several seconds later, the url becomes https://localhost/#/socialLoginSuccess, and the page shows 502 Bad Gateway. I see the following logs in the terminal running nginx:

$ docker-compose --f docker-compose-dev.yml up
WARNING: Found orphan containers (frontend_10studio_1, frontend_frontend_1) for this project. If you removed or renamed this service in your compose file, you can run this command with the --remove-orphans flag to clean it up.
Starting frontend_https_1 ... done
Attaching to frontend_https_1
https_1  | nginx 21:24:05.37 
https_1  | nginx 21:24:05.38 Welcome to the Bitnami nginx container
https_1  | nginx 21:24:05.38 Subscribe to project updates by watching https://github.com/bitnami/bitnami-docker-nginx
https_1  | nginx 21:24:05.39 Submit issues and feature requests at https://github.com/bitnami/bitnami-docker-nginx/issues
https_1  | nginx 21:24:05.39 
https_1  | nginx 21:24:05.39 INFO  ==> ** Starting NGINX setup **
https_1  | nginx 21:24:05.42 INFO  ==> Validating settings in NGINX_* env vars
https_1  | nginx 21:24:05.43 INFO  ==> Initializing NGINX
https_1  | realpath: /bitnami/nginx/conf/vhosts: No such file or directory
https_1  | 
https_1  | nginx 21:24:05.45 INFO  ==> ** NGINX setup finished! **
https_1  | nginx 21:24:05.47 INFO  ==> ** Starting NGINX **
https_1  | 172.19.0.1 - - [08/Nov/2021:21:25:06 +0000] "GET /10studio/auth/google HTTP/1.1" 302  0 "https://localhost:8000/" "Mozilla/5.0 (Macintosh; Intel Mac OS X 10_15_7) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/95.0.4638.54 Safari/537.36" "-"
https_1  | 172.19.0.1 - - [08/Nov/2021:21:25:07 +0000] "GET /auth/google/callback?code=4%2F0AX4XfWiqleRl2StBpNOgOtzjqZlftvq9-uDmiPVLZqcgo2xjjhohu47iAV5qxoJThaQYzg&scope=email+profile+https%3A%2F%2Fwww.googleapis.com%2Fauth%2Fuserinfo.profile+https%3A%2F%2Fwww.googleapis.com%2Fauth%2Fuserinfo.email+openid&authuser=0&prompt=none HTTP/1.1" 302  82 "https://localhost:8000/" "Mozilla/5.0 (Macintosh; Intel Mac OS X 10_15_7) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/95.0.4638.54 Safari/537.36" "-"
https_1  | 172.19.0.1 - - [08/Nov/2021:21:25:07 +0000] "GET /auth/signinSuccess HTTP/1.1" 302  82 "https://localhost:8000/" "Mozilla/5.0 (Macintosh; Intel Mac OS X 10_15_7) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/95.0.4638.54 Safari/537.36" "-"
https_1  | 172.19.0.1 - - [08/Nov/2021:21:25:07 +0000] "GET /socialLoginSuccess HTTP/1.1" 302  138 "https://localhost:8000/" "Mozilla/5.0 (Macintosh; Intel Mac OS X 10_15_7) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/95.0.4638.54 Safari/537.36" "-"
https_1  | 2021/11/08 21:25:39 [error] 27#27: *2 connect() failed (110: Connection timed out) while connecting to upstream, client: 172.19.0.1, server: localhost, request: "GET / HTTP/1.1", upstream: "http://192.168.65.1:3000/", host: "localhost", referrer: "https://localhost:8000/"
https_1  | 172.19.0.1 - - [08/Nov/2021:21:25:39 +0000] "GET / HTTP/1.1" 502  552 "https://localhost:8000/" "Mozilla/5.0 (Macintosh; Intel Mac OS X 10_15_7) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/95.0.4638.54 Safari/537.36" "-"

Does anyone know what's wrong here?

Additionally, when I debug nginx, it is like a black box for me. I really want to be able to trace and see which url enters which location block, and changes to which url (by proxy_pass or rewrite, etc.). Does anyone have a better way to debug or log that?

SoftTimur
  • 307
  • 2
  • 5
  • 14
  • 2
    I'm not familiar with docker's certbot handling, but letsencrypt will not issue a certificate with a hostname 'localhost'. – symcbean Nov 04 '21 at 14:46
  • @symcbean you are right, I now use another docker image. – SoftTimur Nov 08 '21 at 21:38
  • Generic debugging approaches (which you may already now): (1) Use the network tab in developer tools for your browser (Safari or otherwise), it will show you in particular the new destination for the 302s, so you can understand more about what goes on in the flow. (2) Use a logging man-in-the-middle proxy, e.g. [mitmproxy](https://mitmproxy.org), in transparent proxy mode if necessary. (3) In principle you can also put a mitproxy between nginx and your service. – dirkt Nov 13 '21 at 13:21
  • And I don't understand how you want to capture the usual OAuth redirections with your proxy setup, so I cannot comment on why it doesn't work. For normal OAuth, you don't need to do anything special. – dirkt Nov 13 '21 at 13:22

0 Answers0