首页 > 解决方案 > SSL 的 Nginx 配置 - React - 节点 - Cloudflare

问题描述

我真的是 Nginx 的菜鸟,我不知道如何nginx正确配置,我的项目文件夹是

/Client (react)
/Server (node)
/ (server config)

我以前有这个nginx配置,一切都很完美

server {
    listen 80;

    server_name IP;

    location / {
        proxy_pass http://IP:3030;
        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;
    }
}

后来Cloudflare我只激活了 https,我的网站无法连接到端口:4000 上的后端,通过一些研究我发现我需要更改nginx配置,这就是Cloudflare我创建的指导。

server {
  listen     80;
  listen     443;

  ssl        on;
  ssl_certificate         /root/certificate.pem;
  ssl_certificate_key     /root/key.key;

  server_name    mydomain.org www.mydomain.org;
  access_log     /var/log/nginx/nginx.vhost.access.log;
  error_log      /var/log/nginx/nginx.vhost.error.log;
  location / {   # i just paste everything i had on the previous config here
    proxy_pass https://IP:3030;
    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文件夹和/文件夹,这是我的server.js文件:

const express = require("express");
const path = require("path");
const app = express();

const port = process.env.PORT || 3030;
app.use(express.static(path.join(__dirname, "client/build")));
app.get("/*.png", (req, res) => {
  console.log(req.params[0]);
  res.sendFile(path.join(__dirname, "client/public/", req.params[0] + ".png"));
});
app.get("/*.jpeg", (req, res) => {
  console.log(req.params[0]);
  res.sendFile(path.join(__dirname, "client/public/", req.params[0] + ".jpeg"));
});

app.get("/*", (req, res) => {
  res.sendFile(path.join(__dirname, "client/build/", "index.html"));
});

app.listen(port, () => console.log(`Listening on port ${port}`));

很抱歉发了很长的帖子,但我什么都不知道nginx,我想涵盖几乎所有我拥有的东西。

标签: node.jsreactjssslnginxcloudflare

解决方案


也许您的后端服务器还没有准备好处理 SSL 请求。你可以让你的 NGINX 为你处理这些,并在没有 SSL 的情况下与你的后端通信,这在以前是有效的。您可以通过将proxy_pass指令更改回http://地址来实现这一点。

server {
  # Other stuff ...
  location / {
     # Comunicate proxy with backend without encryption until you setup SSL on your application...
     proxy_pass http://IP:3030;
     # Other stuff...
  }
}

推荐阅读