Как интегрировать приложение Angular 4 с загрузочным стеком Spring?

Я хотел бы интегрировать клиентское приложение Angular 4 с приложением Java Spring, работающим на http://localhost:8080/ и предлагает некоторые конечные точки Rest. Моя цель-иметь возможность вызывать Угловое приложение из url-адреса, например http://localhost:8080/adminisitration. Как я могу это сделать?

заранее спасибо,

8
angular java rest spring spring-mvc

5 ответов

вам нужно будет создать приложение ng и поместить его в папку spring-boot

1. Create a public folder under resources in your spring-boot project

2. ng build --prod, type this command on you angular project which will create a dist folder under your angular project directory

3. copy files from you dist folder and place it in public folder under resources of your spring-boot project.

Это поможет вам запустить приложение angular под spring-boot.

нажмите http://localhost:8080/adminisitration, он должен работать нормально
3

взгляните на этот учебник может помочь вам ссылке

вы также можете использовать angular cli в этом уроке и указать его на папку ресурсов (ту, которую вы создаете... т. е. передний конец), затем настройте это как ресурс в вашем Maven pom.XML.

2

есть два способа, во-первых, вы служите угловое приложение из приложения spring boot в качестве статических ресурсов, поэтому вам нужно упаковать его в банку, и это непросто, когда у вас есть два разных репозитория для интерфейса и бэкэнда и не выглядит хорошо с точки зрения обслуживания.

во-вторых, у вас есть угловые статические ресурсы на nginx и приложение spring boot доступно для углового через обратный прокси, настроенный на nginx, как

location /api/ { proxy_pass http://localhost:8080/api/; }

поэтому, когда угловой просит GET http://localhost/api/somerest он пересылает его в GET http://localhost:8080/api/somerest

1

Я думаю, что лучший способ-отделить angular 4 app и java spring app.

в моем случае java spring app-это API, обрабатывающий все запросы от angular 4 app через прокси (angular-CLI proxy -> легко настроить).

Угловое приложение 4 на узле.js, разработанный в visual studio code, и Java spring на embedded tomcat (undertow), разработанный в eclipse. Они могут находиться на отдельных серверах (например. мое приложение angular 4 находится на localhost:4200, в то время как Java spring API включен http://mydomain.ch:8900)

Если вам нужна дополнительная информация, добавьте комментарий.

Надежда в помощь

PS. прокси обрабатывается на стороне клиента (приложение angular 4), а не на стороне сервера (Java spring)

0

как я понимаю, ваш вопрос просто создать новый файл с именем proxy.config.json и вставьте ниже код в этот файл, поместите файл рядом с .angular-cli.json

{
  "/": {
    "target": "http://localhost:8080",
    "secure": false,
    "logLevel": "debug"
  }
}

для нажатия url на серверный сервер не используйте http://localhost:8080/administration вместо того, чтобы использовать /administration как мы используем http://localhost:8080/ в нашем прокси-файл. в app.component.ts место файла под кодом в ngOnInit()

this.http.get('/adminisitration',someRequestOption).subscribe(res =>{
  console.log('happy...!');
})

запустить серверный сервер: (tomcat on port 8080) и

запустить сервер интерфейса: ng serve --proxy-config proxy.config.json откройте браузер и введите url http://localhost:4200 вы увидите логи на сервере и клиенте, если таковые имеются.

Примечание: выше порты по умолчанию, как предусмотрено spring boot и angular 4

0