Java 运行ng serve时，将angular嵌入spring应用程序并访问spring控制器

我计划设置一个Spring Angular应用程序。我从一个

Hello World

示例开始，测试如何设置环境。我最终做了什么：

创建Spring项目并在此应用程序中创建角度应用程序。现在，我可以通过

HttpClient

Angular模块访问

Spring REST控制器。（代码示例见下文）

优点：我可以使用mvn包将角度和弹簧部件打包到一个jar中，并简单地将其部署到我的tomcat上。遗憾的是，当我运行
ng serve
时，只执行前端，无法访问后端中的数据。有没有一种方法可以设置我的环境，这样我就可以拥有一个项目解决方案的优势，并且仍然使用ng serve来测试它

我尝试的是：

打包jar并通过终端（
java-jar%jar file%
）执行，并使用
localhost:8080/hello
作为我的
HttpClient
的路径，而不是简单的
/hello
。不幸的是，这并没有奏效

到目前为止，我得到的代码是：

应用程序组件.ts

import { Component, OnInit } from '@angular/core';
import { HttpClient } from '@angular/common/http';

@Component({
  selector: 'app-root',
  templateUrl: './app.component.html',
  styleUrls: ['./app.component.css']
})
export class AppComponent implements OnInit {
  title = 'HelloWorld';
  message: string;

  constructor(private http : HttpClient) {}

  ngOnInit() : void {
    //this is where I tried to use localhost:8080/hello instead
    this.http.get('/hello').subscribe( data => {
      console.log('DATA', data);
      this.message = data['message'];
    });
  }
}

休息控制器：

package com.example.helloWorld.controller;
import org.springframework.web.bind.annotation.GetMapping;
import org.springframework.web.bind.annotation.RestController;


@RestController
public class HelloWorldController {

    @GetMapping("/hello")
    public String sayHello() {
        return "{\"message\": \"Hello, World!\"}";
    }

}

pom.xml
http://maven.apache.org/xsd/maven-4.0.0.xsd">
4.0.0

<groupId>com.example</groupId>
<artifactId>helloWorld</artifactId>
<version>0.0.1-SNAPSHOT</version>
<packaging>jar</packaging>

<name>helloWorld</name>
<description>Demo project for Spring Boot</description>

<parent>
    <groupId>org.springframework.boot</groupId>
    <artifactId>spring-boot-starter-parent</artifactId>
    <version>2.1.0.RELEASE</version>
    <relativePath/> <!-- lookup parent from repository -->
</parent>

<properties>
    <project.build.sourceEncoding>UTF-8</project.build.sourceEncoding>
    <project.reporting.outputEncoding>UTF-8</project.reporting.outputEncoding>
    <java.version>1.8</java.version>
</properties>

<dependencies>

    <dependency>
        <groupId>org.springframework.boot</groupId>
        <artifactId>spring-boot-starter-test</artifactId>
        <scope>test</scope>
    </dependency>
    <dependency>
        <groupId>org.springframework.restdocs</groupId>
        <artifactId>spring-restdocs-mockmvc</artifactId>
        <scope>test</scope>
    </dependency>
 <dependency>
  <groupId>org.springframework.boot</groupId>
  <artifactId>spring-boot-autoconfigure</artifactId>
  <version>2.1.0.RELEASE</version>
  <type>jar</type>
 </dependency>
 <dependency>
  <groupId>org.springframework.boot</groupId>
  <artifactId>spring-boot-starter-web</artifactId>
 </dependency>
</dependencies>

<build>
    <plugins>
                    <plugin>
                        <groupId>org.codehaus.mojo</groupId>
                        <artifactId>exec-maven-plugin</artifactId>
                        <executions>
                            <execution>
                                <phase>validate</phase>
                                <goals>
                                    <goal>exec</goal>
                                </goals>
                            </execution>
                        </executions>
                        <configuration>
                            <executable>ng</executable>
                            <workingDirectory>src/main/ui</workingDirectory>
                            <arguments>
                                <argument>build</argument>
                            </arguments>
                        </configuration>
                    </plugin>
        <plugin>
            <groupId>org.springframework.boot</groupId>
            <artifactId>spring-boot-maven-plugin</artifactId>
        </plugin>
    </plugins>
</build>

com.example
地狱世界
0.0.1-快照
罐子
地狱世界
SpringBoot的演示项目
org.springframework.boot
spring启动程序父级
2.1.0.1发布
UTF-8
UTF-8
1.8
org.springframework.boot
弹簧起动试验
测试
org.springframework.restdocs
SpringRestMVC
测试
org.springframework.boot
弹簧靴自动配置
2.1.0.1发布
罐子
org.springframework.boot
SpringBootStarterWeb
org.codehaus.mojo
execmaven插件
验证
执行官
ng
src/main/ui
建造
org.springframework.boot
springbootmaven插件

像这样做

this.http.get('/hello').subscribe( data => {
      console.log('DATA', data);
      this.message = data['message'];
    });

您需要进行一些代理配置。
在项目中的
package.json
所在目录下创建一个
proxy config.json
文件

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

在
package.json
内
scripts
更新
“start”
命令中使用
“start”：“ng serve--proxy config proxy config.json”，
之后，请尝试使用
npmstart
命令运行您的项目。
这正是我想要的，感谢您提供的简单解决方案！