如何使用角度 ssr 和 pm2 配置 nginx答案

【问题标题】：how to configure nginx with angular ssr and pm2如何使用角度 ssr 和 pm2 配置 nginx
【发布时间】：2020-12-27 09:05:42
【问题描述】：

我有一个问题，我真的不再知道如何使用 pm2 配置 nginx，因此当我执行 f5 时，它会重定向并在他们共享来自网络的链接时为我工作。目前在 Angular Universa 我做了 npm run build: ssr.我创建了一个 dist 文件夹和 server.js 文件。在 pm2 start ..../server.js --name apiweb 中运行。然后在 nginx 中像这样配置文件。

upstream ssr_khophi_nodejs {
    server 127.0.0.1:4002;
}

server {
        listen 80;
        listen [::]:80;
        root /var/www/fm/html;
        index index.html index.htm;
        server_name www.fm.com.ar fm.com.ar;

    location / {
        try_files $uri @backend;
    }
    location @backend {
        proxy_pass http://ssr_khophi_nodejs;
        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_http_version 1.1;
        proxy_set_header X-NginX-Proxy true;
        proxy_set_header Upgrade $http_upgrade;
        proxy_set_header Connection "upgrade";
        proxy_cache_bypass $http_upgrade;
        proxy_redirect off;
        proxy_set_header X-Forwarded-Proto $scheme;
    }
}

有谁知道正确的配置是怎样的，所以当我在网络上执行 f5 时，它不会将我重定向到正确的链接，它会告诉我“内部服务器错误”。不知道是pm2还是angular还是nginx。

问候！

【问题讨论】：

你弄明白了吗？

标签： nginx pm2 angular-universal nginx-config

【解决方案1】：

将此用作您的服务器块：

server {
    listen 80;
    server_name modernamedia.no;
    location / {
        proxy_pass http://localhost:4000;
        proxy_http_version 1.1;
        proxy_set_header Upgrade $http_upgrade;
        proxy_set_header Connection 'upgrade';
        proxy_set_header Host $host;
        proxy_cache_bypass $http_upgrade;
    }
}

小心检查 server.ts 并且应该像这样编码

  const distFolder = join(process.cwd(), './dist/browser');

然后转到 angular.json

更改所有输出路径（服务器和客户端）

 "outputPath": "dist/browser",

 "outputPath": "dist/server",

现在没有 500 内部服务器错误

【讨论】：

【解决方案2】：

server {
    listen 80;
    server_name _;
    location / {
        proxy_pass http://localhost:4000;
        proxy_http_version 1.1;
        proxy_set_header Upgrade $http_upgrade;
        proxy_set_header Connection 'upgrade';
        proxy_set_header Host $host;
        proxy_cache_bypass $http_upgrade;
    }
}

仔细检查 server.ts 并且应该像这样编写代码

  const distFolder = join(process.cwd(), './dist/browser');

然后转到 angular.json

更改所有输出路径（服务器和客户端）

 "outputPath": "dist/browser",

 "outputPath": "dist/server",

现在没有 500 内部服务器错误

【讨论】：