JavaScript 中怎么合理设置 HTTP 缓存头实现静态资源长期缓存-js教程-PHP中文网

JavaScript 本身不能设置 HTTP 缓存头，需服务端配置 Cache-Control: public, max-age=31536000, immutable，并配合构建工具生成 contenthash 文件名（如 app.a2b3c4d5.js），确保内容变更即 URL 变更，HTML 自动注入新路径，从而实现安全长期缓存。

javascript 中怎么合理设置 http 缓存头实现静态资源长期缓存

JavaScript 本身不能设置 HTTP 缓存头——这是服务器端的责任。前端代码无法修改响应头，但可以通过配合后端配置、构建流程和资源命名策略，真正落地静态资源的长期缓存。

关键：服务端必须设置 Cache-Control

浏览器是否长期缓存 JS/CSS/图片等静态资源，完全取决于服务器返回的响应头。最核心的是 Cache-Control 字段：

max-age=31536000（即 1 年）：适用于内容基本不变的资源
immutable：告诉浏览器该资源在有效期内绝不会变更（配合文件哈希名使用）
public：允许 CDN 和中间代理缓存

例如，Node.js（Express）中可这样设置：

app.use('/static', express.static('dist', {
  maxAge: '1y',
  setHeaders: (res) => {
    res.setHeader('Cache-Control', 'public, max-age=31536000, immutable');
  }
}));

必须搭配文件内容哈希命名

只设 long max-age 不够——若文件内容更新但文件名不变，用户将永远拿不到新版本。解决方法是构建时生成带哈希的文件名，例如：
app.a2b3c4d5.js、style.e8f9g0h1.css

Java注释规范Skills

当用户要求为 Java 代码添加注释、修改注释、审查注释、整理注释格式，或要求按照代码注释规范处理 Java 文件时，使用本技能。本技能用于统一生成和维护 Java 类注释模板、按 Git 对比 release 判断版本号、补充每行代码上方中文块注释、调整注释空行规则，并保持 Java 文件 UTF-8 无 BOM 编码。典型触发场景包括：补充类注释、更新 @version、检查 @author 来源、整理行尾注释、把注释放到代码上一行、检查注释是否符合规范、构建前检查 Java 注释风格。

下载

Webpack/Vite 等工具默认支持 contenthash 或 fullhash
HTML 中引用的路径需同步更新（由构建工具自动处理）
这样每次内容变更，文件名就变，浏览器视为全新资源，自然跳过旧缓存

避免误用 Expires 或不设缓存头

Expires 是 HTTP/1.0 遗留字段，优先级低于 Cache-Control，且依赖服务器与客户端时钟一致，容易出错，应弃用。

不要只写 Cache-Control: max-age=31536000 而忽略 immutable——缺少它时，某些浏览器仍可能在刷新时发条件请求（如带 If-None-Match），削弱性能
确保所有静态资源路径（包括 CSS 中的 background-image、@import）都走哈希化路径，否则局部缓存失效会破坏整体策略