Spring Web应用中Thymeleaf无法加载CSS、图片等静态资源求助

先给你拆解下问题本质：你看到的Refused to apply style... MIME type ('text/html')报错，说明浏览器请求CSS/图片时，服务器返回的不是对应的静态资源，而是返回了login页面的HTML内容——这大概率是静态资源的引用路径写错了，导致请求被Spring的DispatcherServlet转发到了Controller，最终返回了登录页的HTML。

下面是我整理的几个必查点，按顺序试：

1. 检查Thymeleaf模板里静态资源的引用路径 #

Thymeleaf里引用静态资源必须用正确的语法，绝对不能直接写相对路径。举个例子：

• ❌ 错误写法（直接写相对路径，容易导致路径解析错误）：

  <link rel="stylesheet" href="css/login.css">
  

• ✅ 正确写法（用Thymeleaf的@{}语法，自动拼接上下文路径）：

  <link rel="stylesheet" th:href="@{/css/login.css}">
  <img th:src="@{/images/logo.png}" alt="网站logo">
  

这里的/css/和/images/对应的就是你src/main/resources/static下的子目录，Spring Boot会自动映射这个目录到根路径下的静态资源。

2. 确认静态资源的存放位置是否正确 #

你说已经放在src/main/resources/static，再仔细核对下目录结构：

src/
  main/
    resources/
      static/
        css/
          login.css
        images/
          logo.png
      templates/
        login.html  <!-- 你的Thymeleaf模板 -->

如果静态资源放在static的子目录外，或者拼写错误（比如写成statics），Spring Boot是找不到的。

3. 检查是否有拦截器/过滤器拦截了静态资源请求 #

如果你的项目里自定义了拦截器（Interceptor）或者过滤器（Filter），一定要确保它们不会拦截静态资源路径。比如拦截器配置里要排除/css/**、/images/**这些路径：

@Configuration
public class WebMvcConfig implements WebMvcConfigurer {
    @Override
    public void addInterceptors(InterceptorRegistry registry) {
        registry.addInterceptor(new LoginInterceptor())
                .addPathPatterns("/**")
                .excludePathPatterns("/login", "/css/**", "/images/**"); // 排除静态资源
    }
}

要是拦截器把静态资源请求也拦截了，就会被重定向到登录页，导致返回HTML内容。

4. 检查Controller的请求映射是否覆盖了静态资源路径 #

比如你有没有写过类似这样的Controller：

@GetMapping("/**")
public String fallback() {
    return "login";
}

这种通配符映射会把所有请求都转发到login页面，包括静态资源的请求。一定要避免这种全局通配符，或者在里面排除静态资源的路径。

5. 清理浏览器缓存并重启项目 #

有时候浏览器会缓存旧的错误请求路径，导致即使你改对了路径，还是加载错误。按Ctrl+Shift+R强制刷新页面，或者直接清空浏览器缓存，同时重启Spring Boot项目，确保新的配置生效。

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