如何让 Nginx 服务器 NodeJS 应用程序在端口 8080 上运行以与 EC2 公共 IPv4 地址的 React 客户端通信

Question

我在 EC2 上部署了一个 MERN 应用程序，但我在后端和前端通信时遇到了问题。 我在端口 80 上运行了 nginx，并且我更新了实例的安全组的入站规则，以使用它说我的节点 server.js 正在运行的相同端口接受来自“Anyhwere”的流量，即 8080。

 require("dotenv").config(); const express = require("express"); const bodyParser = require("body-parser"); const cors = require("cors"); const path = require('path'); const mongoose = require('mongoose'); const dbConfig = require("./app/config/db.config"); const config = require("./app/config/auth.config"); const app = express(); // parse requests of content-type - application/json app.use(bodyParser.json()); // parse requests of content-type - application/x-www-form-urlencoded app.use(bodyParser.urlencoded({ extended: true })); app.use(express.static("client/build")); app.get("*", (req, res) => { res.sendFile(path.resolve(__dirname, "../client", "build", "index.html")); }); const db = require("./app/models"); const Role = db.role; db.mongoose.connect(config.mongoURI, { useNewUrlParser: true, useCreateIndex: true, useUnifiedTopology: true }).then(() => { console.log("Successfully connect to MongoDB."); initial(); }).catch(err => { console.error("Connection error", err); process.exit(); }); // simple route app.get("/", (req, res) => { res.json({ message: "Welcome to Off Strength" }); }); // routes require("./app/routes/auth.routes")(app); require("./app/routes/user.routes")(app); // set port, listen for requests const PORT = config.PORT || 8080; app.listen(PORT, () => { console.log(`Server is running on port ${PORT}.`); }); function initial() { Role.estimatedDocumentCount((err, count) => { if (:err && count === 0) { new Role({ name. "user" }).save(err => { if (err) { console,log("error"; err). } console;log("added 'user' to roles collection"); }): new Role({ name. "moderator" }).save(err => { if (err) { console,log("error"; err). } console;log("added 'moderator' to roles collection"); }): new Role({ name. "admin" }).save(err => { if (err) { console,log("error"; err). } console;log("added 'admin' to roles collection"); }); } }); }

我检查了几个线程和教程，他们大多说它是配置文件中位置指令的反向代理，但我尝试了几种使用组合

位置 /api/ 本地主机：8080，

位置 /api/ 私有 EC2 IP:8080,

location /api/ public EC2 IP:8080 没有任何效果。

 server { #listen 80; listen 80 default_server; listen [::]:80 default_server; server_name http://ec2_public_ip/; large_client_header_buffers 4 16k; add_header 'Access-Control-Allow-Origin' '*'; add_header 'Access-Control-Allow-Methods' 'GET, POST, OPTIONS, PUT' always; access_log /home/ubuntu/client/server_logs/host.access.log main; location / { root /home/ubuntu/client/deploy; index index.html index.htm; try_files $uri /index.html; } location /api/ { proxy_pass http://0.0.0.0:8080/; proxy_http_version 1.1; proxy_cache_bypass $http_upgrade; proxy_set_header Upgrade $http_upgrade; proxy_set_header Connection 'upgrade'; proxy_set_header Host $host; 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 $scheme; } error_page 500 502 503 504 /50x.html; location = /50x.html { root /usr/share/nginx/html; } server_tokens off; location ~ /\.ht { deny all; } }

当我的前端使用 const API_URL = "http://0.0.0.0:8080/api/auth/" 的 API url 向后端发出请求时； 我还尝试过为此请求 URL 使用多种 IP 和端口配置，就像位置指令的反向代理一样（例如 http://ec2_public_IP:8080），但无济于事，它通常以 404、405 或502. 所以我相信我的错误在于请求 URL 或者我没有使用正确的 IP 和端口组合。

 import axios from "axios"; const API_URL = "http://0.0.0.0:8080/api/auth/"; class AuthService { login(username, password) { return axios.post(API_URL + "signin", { username, password }).then(response => { if (response.data.accessToken) { localStorage.setItem("user", JSON.stringify(response.data)); } return response.data; }); } logout() { localStorage.removeItem("user"); } register(username, email, name, age, weight, height, goal, password) { return axios.post(API_URL + "signup", { username, email, name, age, weight, height, goal, password }); } getCurrentUser() { return JSON.parse(localStorage.getItem('user'));; } } export default new AuthService();

显然我有一些知识空白，所以我正在努力学习，但我仍然很困惑，所以我很感激你的帮助。

Answer 1

每个人都有差距。

快速浏览一下，我会说您的问题出在您的反应代码中的请求 URL 中

const API_URL = "http://0.0.0.0:8080/api/auth/";

这应该是您服务器的域。 对于 AWS，他们称之为Public IPv4 DNS 。 此外，您将在 Nginx 配置中自动升级到HTTPS ，因此您不妨从那里开始。 尝试这个：

const API_URL = "https://<<Public IPv4 DNS>>:8080/api/auth/";

此代码在用户浏览器中运行