正确设置 HTTP 标头以强制缓存 JS、CSS 和 PNG 文件

Posted 2023-02-26

【中文标题】正确设置 HTTP 标头以强制缓存 JS、CSS 和 PNG 文件

【英文标题】：Set HTTP headers properly to force caching on JS, CSS and PNG files

【发布时间】：2013-08-25 17:43:22

【问题描述】：

如何告诉 GlassFish 服务器将所有 JS、CSS 和 PNG 文件存储到浏览器缓存中以减少 HTTP GET 请求？

我正在使用 JSF 和 PrimeFaces。

【参考方案1】：

只需使用 JSF 内置资源处理程序。 IE。将<h:outputStylesheet name>、<h:outputScript name> 和<h:graphicImage name> 与/resources 文件夹中的文件一起使用，而不是“普通香草”<link rel="stylesheet">、<script> 和<img>。

<h:outputStylesheet name="css/style.css" />
<h:outputScript name="js/script.js" />
<h:graphicImage name="images/logo.png" />

这样你就完全不用担心资源缓存了。 JSF 内置资源处理程序已经设置了必要的响应头。过期时间已经默认为 1 周。

在 Mojarra 中可以通过以下上下文参数控制过期时间（值以毫秒为单位）：

<context-param>
    <param-name>com.sun.faces.defaultResourceMaxAge</param-name>
    <param-value>3628800000</param-value> <!-- 6 weeks. -->
</context-param>

在 MyFaces 中：

<context-param>
    <param-name>org.apache.myfaces.RESOURCE_MAX_TIME_EXPIRES</param-name>
    <param-value>3628800000</param-value> <!-- 6 weeks. -->
</context-param>

另见：

How to reference CSS / JS / image resource in Facelets template? What is the JSF resource library for and how should it be used?

【讨论】：

感谢您的回答。但是查看 netbeans 上的 HTTP 服务器监视器，我注意到需要更多时间下载的文件是 primefaces.js ，我从不在我的页面中调用该脚本。 ..

PrimeFaces 组件可以。

是的，primefaces组件，生成html+js代码，每次刷新页面，都会调用GET请求下载primefaces.js，jquery.js等...这个文件不是在 /resources 文件夹中，我怎么知道“将这些文件存储在缓存中”？

那些是 JSF资源依赖。它们捆绑在 PrimeFaces JAR 文件中（有关详细信息，另请参阅 ***.com/q/8320486）。仔细查看 HTTP 流量。如果您不刷新而只是导航到另一个也需要该文件的页面，那么浏览器根本不会请求它。如果刷新页面，那么浏览器确实会发送 GET 请求，但服务器会返回没有正文的 304 响应。仅当您执行“硬刷新”时，它才会是 200 响应并在正文中包含文件。

非常感谢您的回答！