nginx配置反向代理后端

- [1 环境](#1 环境)
- - [- 前端Vue项目，部署在服务器8088端口](#- 前端Vue项目，部署在服务器8088端口)
  - [- 后端Springboot项目,部署为8080端口](#- 后端Springboot项目,部署为8080端口)
  - [实现后端接口/api/开头，前端访问本身ip+端口/api/xxx访问后端接口](#实现后端接口/api/开头，前端访问本身ip+端口/api/xxx访问后端接口)
- [2. 配置nginx](#2. 配置nginx)
- - [2.1 带/方式](#2.1 带/方式)
  - [2.2 不带/](#2.2 不带/)
  - 总结
  - - 前端地址访问后端接口
    - 后端地址访问接口

1 环境

- 前端Vue项目，部署在服务器8088端口

- 后端Springboot项目,部署为8080端口

实现后端接口/api/开头，前端访问本身ip+端口/api/xxx访问后端接口

2. 配置nginx

2.1 带/方式

javascript 复制代码

shell
server {
    listen 8088;
    server_name your_domain.com;
	location / {
        root /path/to/your/vue/dist/;  # 静态资源目录
        try_files $uri $uri/ /index.html;
    }
    location /api/ {
        proxy_pass http://localhost:8080/api/;
        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 块或配置保持不变
}

解释：访问http://localhost:8088/api/xxx 会请求到http://localhost:8080/api/xxx

2.2 不带/

shell 复制代码

server {
    listen 8088;
    server_name your_domain.com;
	location / {
        root /path/to/your/vue/dist/;  # 静态资源目录
        try_files $uri $uri/ /index.html;
    }
    location /api/ {
        proxy_pass http://localhost: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;
    }

    # 其他 location 块或配置保持不变
}

解释：访问http://localhost:8088/api/xxx 会请求到http://localhost:8080/api/xxx