时间戳

首页 > 解决方案 > Angular 6（前端）+ Spring：配置路由

spring - Angular 6（前端）+ Spring：配置路由

问题描述

我用 Angular 6（前端）和 Kotlin/Java（后端）创建了一个 Spring 项目。我遵循了 JavaSampleApproach 的教程（除了我使用 Gradle 而不是 Maven）。

在 Angular 上，我遵循了 Angular 的路由指南。这就是我设置路线的方式：

const routes: Routes = [
  {path: 'clients', component: ClientsComponent},
  {path: 'scopes', component: ScopesComponent},
  {path: 'identity-providers', component: IdentityProvidersComponent},
  {path: 'diagnostics', component: DiagnosticsComponent},
  {path: '', redirectTo: '/clients', pathMatch: 'full'}
];

从那里，我首先ng serve在端口 8080 上运行，它运行良好。

然后，我运行ng build --prod，它将它构建到 Spring 项目文件夹中。

在我的src/main/kotlin/com.example.myproject目录中，我根据@AndroidLover 的响应创建了一个ViewController类：

package com.example.platformadmintool

import org.springframework.web.bind.annotation.RequestMapping
import org.springframework.web.bind.annotation.RestController

@RestController
class ViewController {

    @RequestMapping("/clients", "/scopes", "/identity-providers", "/diagnostics")
    fun routing() : String {
        return "forward:/index.html"
    }
}

（我明白 @AndroidLover 的回应是针对 Angular 2 的。）

当我运行 gradle 命令clean build bootRun时，当我键入“ http://localhost:8080 ”时会加载首页。我可以通过单击导航干净地遍历“ http://localhost:8080/diagnostics ”和其他页面。

但是，如果我明确输入路由，例如“ http://localhost:8080/clients ”，所有页面显示都是forward:/index.html文本形式。

显然，错误出现在我的请求映射中。我猜这与我返回一个字符串有关，但大多数在线解决方案似乎都使​​用forward:/index.html.

我不太熟悉 Spring 并将其与 Angular 6 集成。如何配置我的路由以在 Spring 中也能工作？

编辑：类似的问题

标签： springangularspring-bootgradlekotlin

解决方案

在我看来，您对 *.js 或 *.css 等静态文件有疑问。尝试在浏览器中打开开发工具（Chrome 中的 F12）并检查当您询问静态文件时哪些文件发送给您。您的应用程序很可能总是返回 index.html instesd *.js 或 *.css。如果您的 GET 请求 URL 包含“.”，您必须配置您的 Java 应用程序，使其返回静态文件。例如（java代码）：

@RequestMapping(value = "/**/{[path:[^\\.]*}", method = RequestMethod.GET)
public String redirect() {
    return "forward:/";
}

推荐阅读