使用 docker 和 nginx 在 localhost 中调试第三方身份验证

使用 docker 和 nginx 在 localhost 中调试第三方身份验证

我们有一个网站,刚刚添加了第三方身份验证,例如 Google、Twitter。我正在尝试在 localhost (MacOS) 中测试这些身份验证。

我正在运行一个docker来运行nginx,下面是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"

下面是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";
    }
}

我们启动应用程序的方式是sudo PORT=8000 HTTPS=true ./node_modules/.bin/react-scripts start。然后https://localhost:8000/#/sign在浏览器中打开包含身份验证按钮的页面。

链接至 Google 身份验证的按钮的网址为https://localhost/10studio/auth/google。点击它后,我首先https://localhost/10studio/auth/google在浏览器地址栏中看到 ,但没有出现输入 Google ID 和密码的页面,然后几秒钟后,网址变为https://localhost/#/socialLoginSuccess,页面显示502 Bad Gateway。我在运行 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" "-"

有人知道这里出了什么问题吗?

此外,当我调试 nginx 时,它对我来说就像一个黑匣子。我真的希望能够跟踪并查看哪个 url 进入哪个位置块,以及更改为哪个 url(通过proxy_passrewrite等)。有没有人有更好的方法来调试或记录它?

相关内容