在上一篇有關Spring Boot angular 5的文章中 ，我們使用Spring Boot angular 5實現了一個完整的堆棧端到端Web應用程序。在本文中，我們將討論在tomcat上部署Spring Boot和Angle App的不同方法。 我們將創建一個具有后端（服務器）和前端（客戶端）的多模塊maven項目，并探討4種方法，以使用maven-war-plugin，maven-resources-plugin，jar包裝等方式進行部署。

Spring Boot Angular 5項目

首先，讓我簡要介紹一下我們在上一個示例中構建的內容。 我們使用angular CLI生成了angular 5項目，并將其修改為具有列表用戶和添加用戶等功能。 我們使用Spring Boot公開了REST API以進行Crud操作，并使用集成的spring數據與MySql數據庫進行通信。 我們利用ng serv服務localhost：4200上的angular項目，它消耗了localhost：8080上公開的API。 以下是最終的項目結構。

部署Spring Boot Angular應用程序的不同方法

部署spring boot和angular應用程序的最佳實踐是將用戶界面代碼與業務邏輯分開，這使客戶端代碼與服務器代碼脫鉤，因此應用程序變得高度可伸縮且易于管理。 前端開發人員可以與前端開發人員并行進行前端開發。 后端代碼可以免費使用和集成不同的技術堆棧，并且可以供多個客戶端使用，例如可以將相同的API重新用于構建android應用程序，也可以將其與第三方客戶端集成在一起，這也減少了停機時間你的申請。 每當您的API不可用或關閉時，您的客戶端應用程序仍會打開。

但是有時候，為一個小型團隊和一個小型應用程序管理兩臺服務器將成為一項開銷。 如果單個全棧開發人員正在處理所有與UI和服務器相關的配置，則將前端和后端應用程序打包到單個Web應用程序中有時會更有幫助。 盡管如此，您仍可以公開REST API，并在同一個應用程序中集成有角度的代碼，然后部署到tomcat，其他移動客戶端可以重用相同的API。

現在，當要部署Java Web應用程序時，我們有兩種不同的方法可以做到這一點。 在引入Spring Boot之后，您可以將應用程序打包為帶有嵌入式tomcat和數據庫的FAT jar文件，并作為可執行文件運行。 另外，您可以使用多個maven插件來創建.war文件并將其部署到獨立的tomcat。

在本文中，我們將主要研究4種部署spring boot angular應用程序的方法，它們是-使用節點服務器和tomcat，使用maven war插件，使用maven資源插件和spring boot jar打包。

Spring Boot Angular多模塊項目

我們已經有兩個現有項目– userPortal（服務器）和portalApp（客戶端），現在我們將其轉換為多模塊項目。 為此，創建一個新文件夾– portal-parent，將現有項目都移動到該文件夾??中，并在portal-parent目錄中創建pom.xml文件。 此pom.xml將模塊定義為兩個現有子項目– userPortal和portalApp，打包類型將為pom。 因此，無論何時構建此父級，都會首先構建子模塊。

<modelVersion>4.0.0</modelVersion><groupId>com.devglan</groupId><artifactId>portal-parent</artifactId><version>0.0.1-SNAPSHOT</version><packaging>pom</packaging><name>portal parent</name><description>portal parnt</description><modules><module>user-portal</module><module>portal-app</module></modules>

使用Maven War插件進行部署

Maven War插件通過收集Web應用程序的所有工件依賴項，類和資源來創建.war文件。 因此，在此配置中，我們將配置客戶端項目以將所有靜態資源推送到目標/客戶端，稍后在創建war文件時，我們將使用maven war插件將其包含在.war生成中并將其放置在/ static文件夾中。 當然，Spring Boot具有一項功能，可以在靜態文件夾中查找靜態資源，并且可以使用我們的靜態靜態資源。

因此，現在我們將如何獲得靜態資源的最終構建。 好吧，這將由angular本身完成。如果您查看angular-cli.json，您將發現一個JSOn屬性為–“ outDir”：“ dist” ，。 這意味著如果我們構建角度項目，最終輸出將被推送到dist文件夾。 現在，我們將在客戶端pom.xml文件中進行配置，以使用npm構建角度項目。 為此，我們必須在客戶端pom.xml中進行如下更改：

此配置將按照pom文件中的配置下載并安裝節點和npm，npm install將安裝package.json中列為依賴項的所有模塊，并且在執行階段，根據軟件包中的配置，最終源將被推送到dist文件夾中.json。

另外，我們將在服務器的pom文件中進行配置，在配置war文件時，我們將配置maven war插件以包含../client/target的資源，并且將角度客戶端作為jar依賴項。 這樣，將產生最終的戰爭，現在您可以將其部署到任何獨立的tomcat。

客戶端pom.xml

<build><finalName>client</finalName><plugins><plugin><groupId>com.github.eirslett</groupId><artifactId>frontend-maven-plugin</artifactId><version>1.6</version><configuration>nodeVersion>v8.9.0</nodeVersion><npmVersion>5.5.1</npmVersion></configuration><executions><execution><id>install node and npm</id><goals><goal>install-node-and-npm</goal></goals></execution><execution><id>npm install</id><goals><goal>npm</goal></goals></execution><execution><id>npm run build</id><goals><goal>npm</goal></goals><configuration><arguments>run build</arguments></configuration></execution></executions></plugin></plugins><resources><resource><directory>target/client</directory><targetPath>static</targetPath></resource></resources></build>

服務器pom.xml

<build><plugins><plugin><groupId>org.springframework.boot</groupId><artifactId>spring-boot-maven-plugin</artifactId></plugin><plugin><artifactId>maven-war-plugin</artifactId><version>3.2.0</version><configuration><webResources><resource><directory>../user-portal/target</directory></resource></webResources></configuration></plugin></plugins></build>

完成這些更改后，請運行mvn clean install并生成您的戰爭。

使用Maven資源插件進行部署

我們已經配置了客戶端，以在上述配置中將所有靜態源推送到dist文件夾。 現在，我們將使用maven資源插件將dist文件夾中的所有文件復制到服務器項目的/ src / main / resources / static文件夾中，并且spring boot將從/ static文件夾中存儲這些資源。 以下是pom配置。

<plugin><artifactId>maven-resources-plugin</artifactId><executions><execution><id>copy-resources</id><phase>validate</phase><goals><goal>copy-resources</goal></goals><configuration><outputDirectory>${build.directory}/classes/static/</outputDirectory ><resources><resource><directory>../portal-app/dist</directory></resource></resources></configuration></execution></executions> </plugin>

使用Spring Boot Jar包裝進行部署

在這種情況下，我們會將有角項目包裝為罐子。 因此，客戶端pom文件中不需要進行任何更改。此外，我們不需要在服務器pom文件中配置任何maven插件。 刪除除了spring-boot-maven-plugin之外的所有構建配置。 不要忘記在服務器pm文件中添加客戶端項目jar依賴項。 因此，現在，當我們構建項目時，jar將包含在META-INF / resources目錄中，并且Spring Boot已預先配置為從該資源文件夾中提供靜態內容。 您需要更改的一件事是package.json的build參數。

"build": "ng build -prod –output-path dist/META-INF/resources"

節點和Tomcat服務器部署

在這種情況下，角度項目可以托管在節點服務器上，而Spring Boot應用程序可以托管在任何其他應用程序服務器上。 為此，請運行ng build命令生成dist文件夾，然后將此文件夾復制到后端節點服務器。 這樣做可以幫助分別平衡兩個服務器的負載。

翻譯自: https://www.javacodegeeks.com/2018/03/4-ways-to-deploy-spring-boot-angular-app-maven-tomcat.html

總結

以上是生活随笔為你收集整理的部署Spring Boot Angular App（Maven和Tomcat）的4种方法的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。