在同一台機器上設置 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