nginx反向代理解决跨域报错

Question

我想使用nginx做反向代理，来解决跨域

前端项目地址：127.0.0.1:5173
后端接口地址：127.0.0.1:8080
前端通过axios调用后端接口127.0.0.1:5173/api/getname（这里不是8080端口，因为我监听的是5173端口，所以想着能够通过proxy_pass代理到8080端口）

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-4o提问了，并且知道一种正确的nginx反向代理要怎么写

    server{
        listen 80;
        server_name localhost;

        location / {
            # 代理前端应用
            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/ {
            # 代理后端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了，但是并没有给到我想要的答案，所以我来问下