Linu Nginx部署專案,解決跨域問題

1. 準備三臺Linux伺服器, 能互相通訊

伺服器Ip假設如下

• 伺服器A : 192.172.3.1
• 伺服器B : 192.172.3.2
• 伺服器C : 192.172.3.4

2. 打包java伺服器專案和vue前段專案

• 伺服器A部署java伺服器專案
• 伺服器B作為橋樑連線伺服器A和伺服器B
• 伺服器c部署Vue前段專案

3. 啟動Java伺服器專案, 埠80

4. 修改配置檔案

• 修改Vue前段專案的請求路徑

  #請求路徑修改為伺服器B的路徑
  axios.defaults.baseURL = "http://192.172.3.2/demo/"

• 在伺服器c的Nginx中部署Vue前段專案
• 修改伺服器c - Nginx的配置檔案

  #配置預設訪問路徑
  location / {
  	root   dist; #vue專案打包後的檔名
  	index  index.html index.htm;
  }

• 修改伺服器B - Nginx的配置檔案

  server {
          listen       80;
          server_name  localhost;
  
  	 location / { #vue專案
  	    proxy_pass http://192.172.3.3;
       }
  
       location /demo { #springboot服務
  	    proxy_pass http://192.172.3.1/; #此處埠如果不算80,需要帶上埠
       }
    }
   
  

5. 訪問專案 192.172.3.2