在同一台机器上设置 react 和 nodejs 服务器

Question

我正在端口 3000 上设置 reactjs 应用程序，以及在 Internet 上同一个盒子的端口 3500 上设置 nodejs API 服务器。 Assume the box has a domain name example.com, and I am using nginx in reverse proxy to receive the end users over https, and internally direct it to the port 3000 of the reactjs server. 在反应代码上，在调用 axios API 获取命令时，我应该使用以下哪个：

• 本地主机：3500
• http://localhost:3500
• https://localhost:3500
• 例如.com:3500
• http://example.com:3500
• https://example.com:3500

我做了几个测试：

• 从我的浏览器访问 reactjs 应用程序成功作为 example.com （nginx 映射到端口 3000）
• Using https://reqbin.com/ I was able to access the nodejs server API and get the correct result using: http://example.com:3500/users
• 使用 https 而不是 http 会导致错误：SSL 连接错误 错误代码：10035

Answer 1

如果最终用户应该通过 https 连接到 react 服务器，那么 react 服务器和 nodejs 服务器应该在 https 模式下运行，否则浏览器将阻止请求并且它永远不会到达服务器。 以下是如何：

• 在 https 模式下运行反应服务器：

1. 将 nginx 反向代理配置更改为：

         proxy_pass https://localhost:3000;

2. Changed the URL for the nodejs server that axios is calling from http://localhost:3500 to https://example.com:3500

3. npm运行build后，将build目录上传到服务器，运行如下命令：

su
serve -s build --listen 3000 --ssl-cert "/etc/letsencrypt/live/example.com/fullchain.pem" --ssl-key "/etc/letsencrypt/live/example.com/privkey.pem"

• 在 https 模式下运行 nodejs 服务器：

1. 使用以下代码更改 server.js 的代码：

    const https = require('https');
    const fs = require('fs');
    
    const options = {
      key: fs.readFileSync('/etc/letsencrypt/live/example.com/privkey.pem'),
      cert: fs.readFileSync('/etc/letsencrypt/live/example.com/fullchain.pem')
    };
    
    https.createServer(options, app).listen(PORT, ()=>{
       console.log(`Server running https on port ${PORT}`)
      });

2. 运行以下命令：

    su
    node server