基于Bootstrap的Spring应用离线无法运行问题咨询

嘿，我来帮你捋捋这个问题——联网时正常、离线就崩，这种情况我之前也踩过坑，大概率是资源引用或者配置的问题，咱们一步步来排查解决：

1. 先检查Bootstrap资源是否依赖CDN #

联网正常说明模板逻辑没问题，离线失效最常见的原因就是你页面里引用的Bootstrap CSS、JS或者字体文件用了CDN链接（比如https://cdn.jsdelivr.net/npm/bootstrap@xxx这种），离线状态下肯定访问不到这些外部资源。

解决办法：

• 去Bootstrap官网下载完整的安装包，里面包含css、js、fonts（旧版本会有）等文件夹；
• 把这些文件夹放到Spring项目的静态资源目录里：
  • 传统Spring MVC项目：放到src/main/webapp/resources下；
  • Spring Boot项目：放到src/main/resources/static或者src/main/resources/public下；
• 修改页面里的资源引用路径，比如把CDN的CSS引用改成本地路径：

  <!-- 原来的CDN引用 -->
  <!-- <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0/dist/css/bootstrap.min.css" rel="stylesheet"> -->
  <!-- 改成本地引用 -->
  <link href="${pageContext.request.contextPath}/resources/bootstrap/css/bootstrap.min.css" rel="stylesheet">
  

  JS文件也做同样的修改。

2. 确认Spring的静态资源映射配置 #

如果本地资源已经放对位置，但还是加载失败，那可能是Spring没有正确映射静态资源路径：

传统Spring MVC项目（非Boot） #

在spring-servlet.xml里添加静态资源的映射配置：

<mvc:resources mapping="/resources/**" location="/resources/"/>

这个配置的意思是：当请求路径以/resources/开头时，去项目根目录的/resources/文件夹下找对应的资源。

Spring Boot项目 #

默认已经支持/static、/public、/resources、/META-INF/resources这些目录的静态资源访问，但如果你自定义了资源路径，需要在application.properties（或application.yml）里配置：

spring.web.resources.static-locations=classpath:/static/,classpath:/my-custom-resources/

3. 补全字体文件的MIME映射 #

你已经在web.xml里加了eot、otf的MIME类型，但Bootstrap用到的字体通常还有woff、woff2、ttf这些格式，这些格式的MIME映射如果缺失，服务器可能无法正确返回文件，导致离线加载失败。

把这些补充到web.xml里：

<!-- 补充字体MIME映射 -->
<mime-mapping>
    <extension>woff</extension>
    <mime-type>application/font-woff</mime-type>
</mime-mapping>
<mime-mapping>
    <extension>woff2</extension>
    <mime-type>application/font-woff2</mime-type>
</mime-mapping>
<mime-mapping>
    <extension>ttf</extension>
    <mime-type>application/x-font-truetype</mime-type>
</mime-mapping>

4. 清除浏览器缓存后测试 #

有时候浏览器会缓存之前的CDN资源请求记录，离线时可能还是会尝试去请求CDN地址。记得先清除浏览器的缓存，再切换到离线模式测试。

按照这几步排查下来，应该就能解决离线加载的问题啦！

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