Angular 项目不适用于 Spring Boot答案

【问题标题】：Angular project doesn't work with Spring BootAngular 项目不适用于 Spring Boot
【发布时间】：2021-04-06 07:38:47
【问题描述】：

我想要做的是将前端应用程序与 Spring Boot 后端一起运行。

使用ng serve 后，Angular 应用程序在 localhost:4200 下正常工作。

我尝试使用ng build --prod，然后将文件从dist 文件夹复制到src/main/resources/static。之后我使用clean install生成jar文件并使用java -jar %filename.jar%执行。

Spring Boot 应用程序似乎正在正确启动，REST 端点可用，但是，当我尝试在 localhost:8080 下获取前端视图时，我在终端中收到 Whitelabel Error Page 和 No mapping for GET / 信息.

假设是否正确，例如，如果 localhost:4200/products 显示带有某些产品的表（ng serve 方法），那么 localhost:8080/products（在 jar 方法中）应该显示同一个表？还是我错过了实现它的一些步骤？

我尝试使用哈希策略，但它似乎没有任何改变。

app-routing.module.ts：

const routes: Routes = [
  { path: '', component: HomeComponent },
  { path: 'sign-up', component: SignUpComponent },
  { path: 'login', component: LoginComponent },
  { path: 'products', component: ProductsComponent }
];

@NgModule({
  imports: [RouterModule.forRoot(routes, { useHash: true })],
  exports: [RouterModule]
})
export class AppRoutingModule { }

index.html：

<!doctype html>
<html lang="en">
<head>
  <meta charset="utf-8">
  <title>My Application</title>
  <base href="#">
  <meta name="viewport" content="width=device-width, initial-scale=1">
  <link rel="icon" type="image/x-icon" href="favicon.ico">
<link rel="stylesheet" href="styles.cd71f88743b54f1de66b.css"></head>
<body>
  <app-root></app-root>
<script src="runtime.acf0dec4155e77772545.js" defer></script><script src="polyfills.3ea10c1644fbb8005130.js" defer></script><script src="scripts.a73844de5f291be94c3b.js" defer></script><script src="main.abbc3215607e4963f8f1.js" defer></script></body>
</html>

【问题讨论】：

欢迎。在提供有关问题所在的详细信息方面做得很好。似乎您可以提供更多信息，例如：您的 Angular App 生活在哪里：（即子路由 /app/？）
您应该先尝试使用邮递员访问您的 Spring Boot 端点，以确保它正常工作并且您拥有正确的端点名称
根据我的理解，这个错误“没有 GET / 的映射”指向 Spring Boot 端的映射问题。我对java不太了解，但我做了很多c#。
REST 端点正常工作，我只是无法将 Angular 端点用于可视界面。

标签： angular spring-boot

【解决方案1】：

“/”是您要调用的默认 GET URL 吗？我想您可以通过在浏览器中直接粘贴他们的 GET URL 来访问其他端点吗？如果是这种情况，您能否检查浏览器网络日志中调用的 URL 是什么？如果这一切看起来都很好，那可能是 Angular 路由的问题。如果您使用的是 HashLocationStrategy，请尝试在 index.html 文件的头部添加。

【讨论】：

我想这可能是与路由有关的问题，但我不知道在哪里解决它。假设是否正确，例如 localhost:4200/products 显示了一个包含一些产品的表（ng serve 方法），那么 localhost:8080/products （在 jar 方法中）应该显示同一个表？还是我错过了实现它的一些步骤？

【解决方案2】：

最终对我有用的是从配置类之一中删除 @EnableWebMvc 注释。在这里找到答案：https://stackoverflow.com/a/33852040/14908618

【讨论】：