JSP 项目静态资源后拼接版本号/时间戳,免刷新
因为最近在做之前的项目,缺少这部分内容,导致改了js或者css文件后,去浏览器不能实时看到效果;
拼接时间戳
因为在本地环境,需要频繁改代码,去刷新,所以解决方案是拼接时间戳。
因为自己在做的项目中,每个jsp 文件都引入了一个公共的jsp,所以以下代码就贴在了公共的jsp里,涉及到每个页面在局部去在对应的静态资源后拼接;
<% // 禁用缓存 response.setHeader("Cache-Control", "no-cache, no-store, must-revalidate, max-age=0"); response.setHeader("Pragma", "no-cache"); response.setDateHeader("Expires", 0); response.setDateHeader("Last-Modified", System.currentTimeMillis()); // 强制更新最后修改时间 // 开发环境测试:时间戳作为版本号(每次刷新都生成新值,强制刷新所有静态资源) long timestamp = System.currentTimeMillis(); request.setAttribute("staticVersion", timestamp); %>分两个层面解读:
① HTTP 响应头 —— 禁止浏览器缓存 JSP 页面本身
响应头 作用
Cache-Control: no-cache... 告知浏览器和代理:此页面不可缓存
Pragma: no-cache 兼容 HTTP/1.0 的老浏览器
Expires: 0 设置过期时间为过去,立即失效
Last-Modified: 当前时间 每次都是"最新",强制重新请求
② staticVersion 时间戳 —— 控制静态资源缓存
long timestamp = System.currentTimeMillis(); // 如:1717912345678
request.setAttribute("staticVersion", timestamp);
该值存入 request 域,供后续 EL 表达式 ${staticVersion} 取用,拼接到所有静态资源 URL 后面:
<script src=".../jquery-1.8.3.js?v=1717912345678"></script>
<link href=".../style.css?v=1717912345678" ...>
浏览器以完整 URL(含参数) 作为缓存 key。每次刷新页面,System.currentTimeMillis() 都会生成新的毫秒时间戳,URL 就变了,浏览器认为是新资源,强制重新下载。
拼接版本号
每次刷新所有 JS/CSS 都重新下载,对生产环境性能影响较大,建议生产改为固定版本号;
<% // 静态资源版本号 —— 发版时只需修改此处一个值! final String staticVersion = "1.0.0"; request.setAttribute("staticVersion", staticVersion); // 禁用JSP页面本身的缓存(静态资源缓存由版本号 ?v= 控制) response.setHeader("Cache-Control", "no-cache, no-store, must-revalidate"); response.setHeader("Pragma", "no-cache"); response.setDateHeader("Expires", 0); %>