部署Spring Boot+Angular 2到Tomcat时访问页面出现404的技术求助

咱们一步步来解决你遇到的WAR部署到Tomcat后访问http://localhost:8080/myportal/出现404的问题，结合你提供的配置文件，主要有几个关键配置需要调整：

1. 必须添加SpringBootServletInitializer启动类 #

Spring Boot应用打包成WAR部署到外部Tomcat时，需要一个引导类来启动Spring应用，这个类必须继承SpringBootServletInitializer。你当前的配置里缺少这个类，这是Tomcat无法正确加载Spring Boot应用的核心原因之一。

创建一个和你的主应用类同包的类：

package com.roger.mylab;

import org.springframework.boot.builder.SpringApplicationBuilder;
import org.springframework.boot.web.support.SpringBootServletInitializer;

public class ServletInitializer extends SpringBootServletInitializer {

    @Override
    protected SpringApplicationBuilder configure(SpringApplicationBuilder application) {
        // 替换成你带@SpringBootApplication注解的主类
        return application.sources(MyPortalApplication.class);
    }
}

2. 配置Angular构建的base href #

你的Tomcat上下文路径是/myportal，但Angular默认会从根路径/加载静态资源（js、css等），这会导致这些资源找不到，最终页面返回404。需要在构建Angular时指定base href。

修改pom.xml中frontend-maven-plugin的npm build执行步骤，添加--base-href参数：

<execution>
    <id>npm build</id>
    <goals>
        <goal>npm</goal>
    </goals>
    <configuration>
        <!-- 添加--base-href参数匹配Tomcat上下文路径 -->
        <arguments>run build -- --base-href /myportal/</arguments>
    </configuration>
    <!-- 确保build步骤在静态资源复制前执行 -->
    <phase>generate-resources</phase>
</execution>

3. 确认静态资源复制的时机与路径 #

你的maven-resources-plugin负责把Angular的dist目录复制到src/main/resources/static，刚才给npm build添加了<phase>generate-resources</phase>，这个阶段在process-resources之前，能保证dist目录生成后再执行复制操作。

打包完成后可以打开WAR包检查：确认/WEB-INF/classes/static目录下有Angular构建后的index.html、js、css等文件，如果没有，要检查路径配置是否正确（你的angular.project.location是src/frontend，dist路径src/frontend/dist是正确的）。

4. 处理Angular HTML5路由的转发（可选但重要） #

如果你的Angular应用用了HTML5模式的路由（不带#的URL），直接刷新页面或访问深层路由会出现404，这时候需要配置Spring Boot把所有非API请求转发到index.html，让Angular自己处理路由。

添加一个路由转发Controller：

package com.roger.mylab;

import org.springframework.stereotype.Controller;
import org.springframework.web.bind.annotation.RequestMapping;

@Controller
public class RouteForwardController {

    // 匹配所有无后缀的路径（排除静态资源请求）
    @RequestMapping(value = "/**/{path:[^\\.]*}")
    public String forwardToIndex() {
        return "forward:/index.html";
    }
}

5. 检查Tomcat部署日志 #

重新打包WAR后部署到Tomcat，查看Tomcat的catalina.out日志，确认：

• Spring Boot应用正常启动（能看到Started MyPortalApplication in X seconds这类日志）
• 没有静态资源加载失败的报错
• 上下文路径正确（日志会显示ContextPath: /myportal）

完成以上步骤后，再访问http://localhost:8080/myportal/应该就能正常加载Angular的index.html了。

内容的提问来源于stack exchange，提问作者roger_that