說明

現在的Java Web項目好多都使用前後端分離的開發部署方式，這樣的好處有很多，比如：可以實現真正的前後端解耦，可以減少後端服務器的並發/負載壓力，方便實現多端應用（網頁端、移動端共用一個後台服務）、增加代碼的維護性&易讀性。一般我們會採用Nginx來部署前端代碼，使用Tomcat來部署後台服務。最近在Windows系統中使用Nginx部署前端代碼時調用後台服務時出現了跨域的報錯，通過對Nginx的一些代理配置可以解決這個問題，下面給大家分享一下在Nginx中部署前端代碼並解決跨域問題的方法步驟。

解決跨域問題的思路：出現跨域問題的原因在於靜態資源的訪問地址是Nginx服務器的地址，比如http://ip1:port1，然後我們在靜態頁面中通過ajax請求後台服務獲取數據，後台服務的地址是http://ip2:port2，這兩個地址的ip端口不同，就導致了跨域問題的出現，那我們就需要訪問一個和前端頁面具有相同地址的後台服務才會避免跨越問題，可以設置一個代理，比如我們把後台服務訪問地址換成http://ip1:port1/api/，然後通過一定的配置將http://ip1:port1/api/地址收到的請求轉發到真正的後台服務地址http://ip2:port2，這樣就可以避免跨域問題的出現。

在html目錄下面放靜態資源

把我們要部署的靜態資源文件夾放到Nginx的html目錄下面，例如testpage文件夾下面有一個index.html頁面，直接把testpage文件夾放到Nginx的目錄下面。

配置反向代理

打開Nginx conf目錄下面的nginx.conf文件，在第一個server裡面添加一個location對前端發送的服務調用請求地址進行過濾，配置如下：

		location /api/ {
            rewrite ^/api/(.*)$ /$1 break;   #所有對後端的請求加一個api前綴方便區分，真正訪問的時候移除這個前綴
            # API Server
            proxy_pass http://127.0.0.1:8092;  #將真正的請求代理到真實的服務器地址，ajax的url為/api/user/1的請求將會訪問http://127.0.0.1:8092/user/1
        }

經過上面的配置以後，我們的前端資源訪問地址和ajax請求的後台服務地址就可以保持一致，從而避免了跨域問題的出現。