SpringBoot前後端分離,nginx的反向代理前臺訪問後臺的配置

1、我的後端項目結構,正常啓動就行了

在這裏插入圖片描述

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

在這裏插入圖片描述

3、配置本地hosts文件

在這裏插入圖片描述

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)

在這裏插入圖片描述

6、遇到困難可以評論(有信必回)小軒微信17382121839。

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章