在開發中大型的JavaEE專案時，前後端分離的框架逐漸成為業界的主流，傳統的單機部署前後端在同一個專案中的工程專案越來越少。這類JavaWeb專案的後端通常都採用微服務的架構，後端會被分解為諸多個小專案，然後使用dubbo+zookeeper或者springCloud來構建微服務，前端則會是一個單獨的專案，前臺的請求通過微服務來呼叫。但是，不同與傳統的web專案，這類前後端分離的專案如何在開發中部署和執行呢？

當前後端分離時，後端專案一定會被載入到tomcat的webapp目錄下面，但是前端的資源院該如何被訪問到呢？這裡以tomcat這個中介軟體為例，探討在開發這類專案的時候，如何讓前後端分離的專案部署並且執行起來，即後端專案部署在tomcat之後如何在執行時訪問靜態資源（非上線部署）。

主要有兩種方案：1.在本地通過Nginx來處理這些靜態資源。2、將靜態資源統一放入一個javaweb應用中，並將自動生成的war包隨後端專案一期丟入tomcat。下面詳細介紹

一、使用Nginx來訪問靜態資源。

在本地安裝nginx並且修改nginx.conf，修改相關配置，將web訪問的埠的資源進行更改，配置如下：

server {
        listen       80;
        server_name  localhost;

        charset utf-8; #access_log logs/host.access.log main; location / { proxy_pass http://tomcat_pool; proxy_redirect off; proxy_set_header HOST $host; proxy_set_header X-Real-IP $remote_addr; proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for; client_max_body_size 10m; client_body_buffer_size 128k; proxy_connect_timeout 90; proxy_send_timeout 90; proxy_read_timeout 90; proxy_buffer_size 4k; proxy_buffers 4 32k; proxy_busy_buffers_size 64k; proxy_temp_file_write_size 64k; } location ~ .*\.(html|htm|gif|jpg|jpeg|bmp|png|ico|txt|js|css|woff|woff2|ttf|eot|map)$ { root D:\Workspaces\esop-html; index index.html; }
 

listen物件改為你本地的tomcat訪問埠，最下面location中的root改為你前端專案中靜態資源的位置，這樣就可以實現只部署後端的專案就能訪問前端的頁面了。

二、將前端專案轉換為動態的web專案，隨後端專案一起丟入tomcat

這個方案省去了在本地安裝和配置nginx，但是也只適用於開發階段專案的部署執行和除錯，真正在生產環境通常前後端專案會部署在不同的伺服器。

• 如果是Intellij Idea,在匯入前端專案之後，右鍵專案 add framework support --> web application，這時將會把前端專案轉換為一個javaweb專案，然後將靜態資源放在生成的web目錄下即可。
• 如果是eclipse，可以新建一個javaweb專案然後將靜態資源放入web或者webcontent目錄下，或者直接先匯入前端專案，然後通過 project facts 將專案轉換為dynamic web專案並勾選 js等相關配置。

然後，執行專案時把後端的war包和前端的war包一同新增到 deployment中執行即可。

轉載：https://www.cnblogs.com/waliwaliwa/p/7222258.html