如何使用 Nginx 和 NodeJs/NestJs 解析 HTTPS 的端口 3000？

Question

我正在学习 NodeJs 的 NestJs 框架，以使用 Vue 和后端部分创建带有前端的网站。所有组件都在这一台服务器上：Nginx、前端和后端（本文对我有帮助https://scotch.io/tutorials/building-a-modern-app-using-nestjs-mongodb-and-vuejs）一切正常如果我通过 IP 地址连接到网站。然后我需要将其迁移到具有 SSL 的真实站点以进行 HTTPS 访问。这是一个问题。

在前端，我将文件 /nestjs-frontend/src/helper.js 更改为：

// ./src/helper.js
export const server = {
    baseURL: 'https://my_site.ru:3000'
}

注意！端口3000

问题出在从主域https://my_site.com到内部 API 路径https://my_site.com:3000的访问中

请帮我解决这个问题。

我的 Nginx 配置是：

server {

        root /var/www/html;

        index index.html index.htm index.nginx-debian.html;

        server_name my_site.com www.my_site.com;

        location / {
                #proxy_set_header Host $host;

                proxy_set_header X-Forwarded-Proto $scheme;
                proxy_set_header        X-Real-IP $remote_addr;
                proxy_set_header        X-Forwarded-For $proxy_add_x_forwarded_for;
                proxy_set_header        X-Forwarded-Proto https;
                proxy_set_header        SSL_PROTOCOL $ssl_protocol;

                proxy_set_header X-Real-IP $remote_addr;
                proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
                #proxy_set_header Host $http_host;
                proxy_set_header X-NginX-Proxy true;

                #proxy_set_header    X-Client-Verify  SUCCESS;
                #proxy_set_header    X-Client-DN      $ssl_client_s_dn;
                #proxy_set_header    X-SSL-Subject    $ssl_client_s_dn;
                #proxy_set_header    X-SSL-Issuer     $ssl_client_i_dn;

                proxy_redirect off;

                proxy_pass http://127.0.0.1:8080;
        }

    #listen 8080;
    listen 443 ssl; # managed by Certbot
    listen [::]:443 ssl ipv6only=on; # managed by Certbot
    ssl_certificate /etc/letsencrypt/live/my_site.com/fullchain.pem; # managed by Certbot
    ssl_certificate_key /etc/letsencrypt/live/my_site.com/privkey.pem; # managed by Certbot
    include /etc/letsencrypt/options-ssl-nginx.conf; # managed by Certbot
    ssl_dhparam /etc/letsencrypt/ssl-dhparams.pem; # managed by Certbot

    add_header Strict-Transport-Security "max-age=15768000; includeSubdomains; preload;";

}

server {
    if ($host = www.my_site.com) {
        return 301 https://$host$request_uri;
    } # managed by Certbot


    if ($host = my_site.com) {
        return 301 https://$host$request_uri;
    } # managed by Certbot


        listen 80 default_server;
        listen [::]:80 default_server;

        server_name my_site.com www.my_site.com;
    return 404; # managed by Certbot

}

upstream app_nodejs {
    server 127.0.0.1:3000;
  }

upstream web_nodejs {
    server 127.0.0.1:8080;
  }

Answer 1

问题是您的 nginx 服务器没有侦听端口 3000。它只侦听端口 443（https 标准端口）。它还监听端口 80（http 标准端口），但仅重定向到 443。

您需要做的是使用反向代理来处理从端口 443 到端口 3000 的 api 请求以及到端口 8080 的 Web 资源请求。

为此，您需要一种方法来区分 API 请求和 Web 请求，并location为每个请求创建不同的块。执行此操作的典型方法是比较 url 路径的部分内容。例如，您可以更改应用程序，使所有 API 请求路径如下所示：

/api/v1/customers

您可以专门为 API 请求创建一个位置块，如下所示：

location /api/v1 {
  ...
  proxy_pass http://127.0.0.1:3000;
}

并且您保持其他位置块完好无损。新位置块的内容应与原始位置块的内容大致相同，除了proxy_pass.

如果您不想更改应用程序，则可以在单个位置块中使用正则表达式枚举所有请求路径，但这确实不可扩展。它看起来像这样：

location ~ ^/{customer|item|group}.*$ {
  ...
  proxy_pass http://127.0.0.1:3000;
}