在同一服务器上使用Spring Boot和Angular2

Question

我已经成功地将我的Angular2应用与Spring Boot后端集成，按照这篇教程的步骤，将编译后的JS资源放置在/ui子目录中。基本上一切都正常，可以通过appname/ui URL访问Angular2应用。

然而，我想知道是否有一种方法能够告诉Spring“穿过”以/ui为父路径的URL，因为目前Spring会拦截所有请求目标为/ui/*的请求，防止Angular2路由器正确地导航到/ui路径下的资源。

目前，我只在其中一个控制器中有这个映射：

@RequestMapping(value = "/ui")
public String uiIndex() {
    return "/ui/index.html";
}

通过这种方式，接口可以正常显示在/ui，但是当我直接从浏览器中访问所有它下面的东西时都会收到Spring的404错误提示。 不过，在Angular2应用程序内部进行路由导航完全没有问题。

编辑

我正在使用以下配置将编译后的Angular2资源从target/ui添加到static/ui文件夹中（我的项目使用maven构建）：

        <resource>
            <directory>${project.basedir}/src/main/resources</directory>
            <includes>
                <include>*.properties</include>
                <include>templates/*.*</include>
            </includes>
        </resource>
        <resource>
            <directory>target/ui</directory>
            <targetPath>static/ui</targetPath>
        </resource>

明确一点，唯一的问题是当我在浏览器中输入像/ui/home/settings这样的URL时，Spring会拦截请求并抛出错误。但是在Angular上下文中，我可以愉快地导航到/ui，然后到/home/settings。

- Sleeper9

---

Spring Boot 应用程序中静态资源的标准位置是在 src/main/resources/static 下。只需将您的 Angular 资源放在那里，Spring Boot 就会为您提供服务。 - JB Nizet

你可能想要一个以/**结尾的映射。 - chrylis -cautiouslyoptimistic-

你看过 https://github.com/spring-guides/tut-spring-security-and-angular-js/blob/master/modular/README.adoc 吗？ - EpicPandaForce

也许可以参考https://dev59.com/SJzha4cB1Zd3GeqPJ8OI来配置Spring Boot的SPA前端。 - EpicPandaForce

@EpicPandaForce 是的，我认为我需要类似这样的东西，但问题似乎是我的 Angular 资源不在 static/ 下，而是在 static/ui 下。我尝试使用 @RequestMapping(value = "/{path:[^\\.]*}") 添加 ui/ 片段，但似乎不起作用。不过我还在继续尝试... - Sleeper9

Answer 1

经过一些尝试和错误，我最终成功地实现了想要的功能。非常感谢@EpicPandaforce的有用评论和这篇StackOverflow帖子。

最终的解决方案是创建一个像这样的@Controller中的@RequestMapping：

@RequestMapping(value = "/ui/**/{path:[^\\.]*}")
public String redirectUi() {
    return "forward:/ui/index.html";
}

- Sleeper9

---

我觉得在'path:'之前有一个额外的'['。 - cjnygard

Answer 2

我认为实现你想要的功能最简单的方法是使用Angular哈希定位策略。

import { LocationStrategy, HashLocationStrategy } from '@angular/common';

{ provide: LocationStrategy, useClass: HashLocationStrategy }

希望能够帮到你。

- Filipe Mendes

Answer 3

你可以添加 ResourceHandlers 来配置 Spring Boot 中的静态内容服务。

示例

@Configuration
public class StaticResourceConfiguration extends WebMvcConfigurerAdapter {
    @Override
    public void addResourceHandlers(ResourceHandlerRegistry registry) {
        registry.addResourceHandler("/ui").addResourceLocations("file:/path/to/your/angular/files");
    }
}

查看https://spring.io/blog/2013/12/19/serving-static-web-content-with-spring-boot和https://docs.spring.io/spring-boot/docs/current/reference/html/boot-features-developing-web-applications.html#boot-features-spring-mvc-static-content

现在，你提到的教程的第5步有一种更简洁的方法来完成这个任务，你跳过了那一步吗？（src/main/resources/static）

- sercasti

---

请查看我编辑过的问题，希望现在我的真正问题更加清晰了。 :) - Sleeper9