Nginx 反向代理未正确将请求转发到后端服务器

Question

“我正在尝试使用Nginx作为反向代理来解决CORS（跨源资源共享）的问题。

详情如下：

前端项目地址：127.0.0.1:5173 后端API地址：127.0.0.1:8080 前端正在使用 axios 在 127.0.0.1:5173/api/getname 调用后端 API（请注意，这不在端口 8080 上，因为我的前端正在监听端口 5173，所以我想我可以通过 proxy_pass 将其代理到端口 8080）。 这是我的 Nginx 配置：

Nginx

server {
    listen 5173;
    server_name localhost;

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

我的计划是让服务器监听端口 5173，当请求传入 localhost:5173/api 时，它应该代理到 localhost:8080。然而，这个设置似乎不起作用。这是为什么？ 在此输入图片描述

实际上，当我向 localhost:5173/api 发送请求时，Nginx 不会将此请求转发到 localhost:8080。”

Answer 1

“我向 ChatGPT-4 询问了编写 Nginx 反向代理配置的正确方法。这是我学到的一种方法：

server {
    listen 80;
    server_name localhost;

    location / {
        # Proxy the frontend application
        proxy_pass http://localhost:5173;
        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;
    }

    location /api/ {
        # Proxy the backend API
        proxy_pass http://127.0.0.1:8080/;
        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;
    }
}

但是，我不确定为什么我之前的方法不起作用。我确实向 GPT 询问过此事，但没有收到我正在寻找的答案，这就是我在这里询问的原因。”