SpringBoot前后端分离，nginx的反向代理前台访问后台的配置

末蓝、 2023-08-17 16:42 21阅读 0赞

#### 1、我的后端项目结构，正常启动就行了 ####

![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3FxXzQxNzQxODg0_size_16_color_FFFFFF_t_70]

#### 2、我的前端项目文件所在位置 ####

![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3FxXzQxNzQxODg0_size_16_color_FFFFFF_t_70 1]

#### 3、配置本地hosts文件 ####

![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3FxXzQxNzQxODg0_size_16_color_FFFFFF_t_70 2]

#### 4、配置nginx（这里忽略安装的过程，看注释自己理解意思，唯一需要改的地方，注释了） ####

# 配置后台处理方法 多个tomcat
    upstream tomcat {
          server  127.0.0.1:8080 weight=10;
          #server  127.0.0.1:8082 weight=10;
          #server  127.0.0.1:8083 weight=10;
    }
    server {
    		# 默认监听端口80
            listen 80; 
            # 对外服务名（域名，可以自己改，改了之后，自己对应本机的电脑hosts文件也要改）
            # 改成自己想要的，和hosts文件对应
            server_name  xuan-api.lipstick.com;
            
            # ...其他配置信息
            
            # 配置代理路径
            location /{
                    proxy_pass http://tomcat/;
            }
    
            # 对“/”路径转发 /docker
            location = / {
            return 302 /;
            }
        # ...其他配置信息
    }
    
    #前端页面显示
    server {
    		# 这里是linux系统中的nginx日志存放位置，可以注释，部署到线上的时候再修改也可以，我注释了
            #access_log /www/wwwlogs/page.ge66d.cn.access.log;
            #error_log /www/wwwlogs/page.ge66d.cn.error.log;
    
            listen       80;
            # 访问前端的域名可以自定义，对应hosts文件也要修改
            # 改成自己想要的，和hosts文件对应
            server_name xuan-admin.lipstick.com;
            #这里是你前端的静态html文件的位置
            #改成自己的位置
            root   "G:\IdeaProjects\lipstick_frontend\backend";
            index  index.html index.htm;
            location / {
                    try_files $uri $uri/ /api$uri?$args;
            }
            location /api/ {
            #前端能够访问到后端（反向代理到后台api域名，也就是上面配置的域名，是什么就改成什么）
            #和后端的域名对应 
            proxy_pass http://xuan-api.lipstick.com/;
            proxy_set_header    X-Forwarded-Host    $host;
            proxy_set_header    X-Forwarded-For     $proxy_add_x_forwarded_for;
        }
    
        location ~.*\.(bmp|css|gif|html|js|jpg|png)$ {
            expires    2h;
        }
    }

#### 5、启动nginx访问自己配置的前端页面域名（我的是xuan-admin.lipstick.com） ####

![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3FxXzQxNzQxODg0_size_16_color_FFFFFF_t_70 3]

#### 6、遇到困难可以评论（有信必回）小轩微信号tangchenxuan1999 ####

[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3FxXzQxNzQxODg0_size_16_color_FFFFFF_t_70]: /images/20230809/1548bd77440f41d2aa673eb8e478f086.png
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3FxXzQxNzQxODg0_size_16_color_FFFFFF_t_70 1]: /images/20230809/5fe9b392b31548a9bb7ef338b9a49620.png
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3FxXzQxNzQxODg0_size_16_color_FFFFFF_t_70 2]: /images/20230809/74a11de35ad44d9bbb6b7928aef5088c.png
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3FxXzQxNzQxODg0_size_16_color_FFFFFF_t_70 3]: /images/20230809/2e1baed3fe4a46e08e29e9a43e2d6adc.png