nginx 服务器上的 React 前端应用程序无法访问 nodejs 后端

Question

我已经在 EC2 免费轮胎上部署了我的第一个 React、Node、MongoDB、Nginx 应用程序。后端 API 单独工作，前端也运行良好。但前端 API 调用无法相互访问。

前端：http://18.130.30.219/ 节点API：http://18.130.30.219:5000/api/article/thumbist

default.conf 如下

server {
#listen       80;
listen 80 default_server;
listen [::]:80 default_server;
server_name  localhost;

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;
    add_header X-Frame-Options SAMEORIGIN;
    add_header X-Content-Type-Options nosniff;
    add_header X-XSS-Protection "1; mode=block";
    add_header Strict-Transport-Security "max-age=31536000; includeSubdomains;";
}

error_page   500 502 503 504  /50x.html;
location = /50x.html {
    root   /usr/share/nginx/html;
}

server_tokens off;

location ~ /\.ht {
    deny  all;
}

}

Answer 1

我遇到了一个解决方案。

location /api {
        proxy_pass http://127.0.0.1:5000;
    }

必须将行添加到 default.conf 文件中。

如果您的 API 使用不同的端口和/或路由（例如：'/api'），您必须按上述方式进行配置。我只是 MERN 堆栈的初学者。

Answer 2

请在前端代码中检查您的配置 API 网址 Request URL: http://18.130.30.219/api/article/create，正在调用前端url。