Статьи

4 способа развертывания приложения Spring Boot Angular (Maven и Tomcat)

В моей прошлой статье Spring Angular 5 мы реализовали веб-приложение с полным стеком, используя Spring 5. Angular 5. В этой статье мы обсудим различные способы развертывания приложения Spring Boot и Angular на tomcat. Мы будем создавать многомодульный проект maven с backend (сервер) и fronted (клиент) и рассмотрим 4 способа его развертывания с использованием maven-war-plugin, maven-resources-plugin, jar-упаковки и т. Д.

Spring Boot Angular 5 Project

Прежде всего, позвольте мне кратко рассказать о том, что мы построили в нашем последнем примере. Мы использовали Angular CLI для создания проекта Angular 5 и изменили его, чтобы иметь такую ​​функциональность, как список пользователей и добавление пользователей. Мы использовали весеннюю загрузку для предоставления REST API для операции crud и интегрировали весенние данные для связи с базой данных MySql. Мы использовали ng serv для обслуживания углового проекта на localhost: 4200, и он потреблял API, выставленные на localhost: 8080 . Ниже была окончательная структура проекта.

Разные способы развертывания угловых загрузочных пружин

Лучшая практика для развертывания приложения с пружинной загрузкой и угловым режимом — разделение кода пользовательского интерфейса с бизнес-логикой. Это обеспечивает разделение клиентского кода с серверным кодом, и, следовательно, приложение становится легко масштабируемым и управляемым. Фронтальный разработчик может продолжить фронтальную разработку параллельно с резервным разработчиком. Внутренний код становится бесплатным для использования и интеграции различных технологических стеков, и он становится доступным для нескольких клиентов, таких как одни и те же API-интерфейсы, которые можно повторно использовать для создания приложений Android, и их можно интегрировать и со сторонними клиентами. Это также уменьшает время простоя ваше приложение. Всякий раз, когда ваши API недоступны или недоступны, ваше клиентское приложение все еще работает.

Но иногда становится сложным управлять двумя серверами для небольшой команды и небольшого приложения. Если один разработчик полного стека обрабатывает все конфигурации, связанные с пользовательским интерфейсом и сервером, упаковка внешнего и внутреннего приложений в одно веб-приложение иногда оказывается более полезной. Тем не менее, вы можете предоставлять REST API и интегрировать код с угловым фронтом в одно и то же приложение и развертывать его в Tomcat, а другой мобильный клиент может повторно использовать те же API.

Теперь, когда мы собираемся развернуть Java-приложение, у нас есть два разных способа сделать это. После введения Spring Boot вы можете упаковать свое приложение в виде файла JAR FAT со встроенными tomcat и базой данных и запустить как исполняемый файл. Кроме того, вы можете использовать несколько плагинов maven для создания .war-файла и развертывания его на отдельном tomcat.

В этой статье мы в основном рассмотрим 4 способа развертывания углового приложения с пружинной загрузкой, и они — с использованием сервера узлов и Tomcat, с помощью плагина Maven War, с помощью плагина Maven Resources и упаковки JAR с пружинной загрузкой

Угловой мультимодульный проект Spring Boot

У нас уже есть два существующих проекта — userPortal (сервер) и portalApp (клиент), и теперь мы преобразуем его в многомодульный проект. Для этого создайте новую папку — portal-parent и переместите оба существующих проекта в эту папку и создайте файл pom.xml в каталоге portal-parent. Этот файл pom.xml будет иметь модуль, определенный как два существующих дочерних проекта — userPortal и portalApp, а тип упаковки будет pom. Таким образом, всякий раз, когда мы собираем этого родителя, дочерние модули будут собраны первыми.

01
02
03
04
05
06
07
08
09
10
11
12
13
14
<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 Plugin

Плагин maven war создает файл .war, собирая все артефактные зависимости, классы, ресурсы веб-приложения. Следовательно, здесь, в этой конфигурации, мы настроим наш клиентский проект так, чтобы он передавал все статические ресурсы цели / клиенту, а позже при создании файла war мы будем использовать плагин maven war, чтобы включить его в поколение .war и поместить его в папку / static. , И, конечно же, у Spring Boot есть возможность искать статические ресурсы в статической папке и наши угловые статические ресурсы будут обслуживаться.

Так что теперь, как мы получим окончательную сборку статических ресурсов. Что ж, это будет сделано самим angular. Если вы посмотрите на angular-cli.json, вы найдете одно свойство JSOn как — «outDir»: «dist» ,. Это означает, что окончательный вывод будет помещен в папку dist, если мы создадим угловой проект. И теперь у нас будет конфигурация в файле клиента pom.xml для сборки углового проекта с использованием npm. Для этого мы должны внести изменения в клиент pom.xml следующим образом:

Эта конфигурация загрузит и установит узел и npm, как сконфигурировано в файле pom, а установка npm установит все модули, перечисленные в package.json как зависимости, а на этапе выполнения конечные источники будут помещены в папку dist согласно конфигурации в пакете. .json.

Кроме того, у нас будет конфигурация в pom-файле сервера, где мы настроим наш подключаемый модуль maven war для включения ресурсов ../client/target при создании файла war. Также он будет иметь угловой клиент в качестве jar-зависимости. И так будет создаваться финальная война, и теперь вы можете развернуть ее на любом автономном коте.

клиент pom.xml

01
02
03
04
05
06
07
08
09
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
<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

01
02
03
04
05
06
07
08
09
10
11
12
13
14
15
16
17
18
19
<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 Resources

Мы уже настроили наш клиент для отправки всех статических источников в папку dist в конфигурации выше. Теперь мы будем использовать плагин ресурсов maven для копирования всех файлов из папки dist в папку / src / main / resources / static нашего серверного проекта, и весенняя загрузка будет обслуживать эти ресурсы из папки / static. Ниже приведена конфигурация пом.

01
02
03
04
05
06
07
08
09
10
11
12
13
14
15
16
17
18
<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 Packaging

В этом случае мы будем упаковывать угловой проект в качестве банки. Поэтому в файл pom клиента не требуется вносить никаких изменений. Кроме того, нам не требуется настраивать любой подключаемый модуль maven в файле pom сервера. Удалите всю конфигурацию сборки, кроме spring-boot-maven-plugin. Не забудьте добавить jar-зависимость проекта клиента в файл pm сервера. Итак, теперь, когда мы создаем наш проект, jar будет включен в каталог META-INF / resources, а Spring Boot предварительно настроен для обслуживания статического содержимого из этой папки ресурсов. Одна вещь, которую вам нужно изменить, — это параметр сборки package.json.

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

Развертывание узлов и серверов Tomcat

В этом случае угловой проект может быть размещен на сервере узла, а приложение весенней загрузки может быть размещено на любом другом сервере приложений. Для этого выполните команду ng build, чтобы сгенерировать папку dist и скопировать ее на сервер внутреннего узла. Это может помочь в балансировке нагрузки на сервере в отдельности.

См. Оригинальную статью здесь: 4 способа развертывания приложения Spring Boot Angular (Maven + Tomcat)

Мнения, высказанные участниками Java Code Geeks, являются их собственными.