Html 禁用浏览器前进/后退按钮的网页缓存

Disable webpage caching for browser forward/back buttons

提问by Mahmoud Saleh

I am using following meta tags to prevent browser caching for page:

我正在使用以下元标记来防止页面的浏览器缓存：

<meta http-equiv="Cache-Control" content="no-cache, no-store, must-revalidate, max-stale=0, post-check=0, pre-check=0" />
<meta http-equiv="Pragma" content="no-cache" />
<meta http-equiv="Expires" content="-1" />
<meta http-equiv="Vary" content="*" />

Case:

案件：

1. Browser is already opened with page1.
2. New link is pasted in the browser address bar and now secured page page2is opened.
3. User performs action on page2and is redirected to page3.

1. 浏览器已经用page1.
2. 新链接粘贴在浏览器地址栏中，现在安全页面page2被打开。
3. 用户在 上执行操作page2并被重定向到page3。

When clicking back button on page3, then user gets redirected to page1(no caching and works fine in this case). When user clicks forward button on page1, then the user is forwarded to the secured page page2. This shouldn't happen.

当点击后退按钮时page3，用户被重定向到page1（在这种情况下没有缓存并且工作正常）。当用户单击前进按钮时page1，用户将被转至受保护的页面page2。这不应该发生。

All of above is tested on IE9.

以上都是在IE9上测试的。

How is this caused and how can I solve it?

这是怎么引起的，我该如何解决？

采纳答案by Mahmoud Saleh

I found out that the best solution is the following filter:

我发现最好的解决方案是以下过滤器：

import java.io.IOException;
import javax.faces.application.ResourceHandler;
import javax.servlet.Filter;
import javax.servlet.FilterChain;
import javax.servlet.FilterConfig;
import javax.servlet.ServletException;
import javax.servlet.ServletRequest;
import javax.servlet.ServletResponse;
import javax.servlet.annotation.WebFilter;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;

/**
 * Servlet Filter implementation class NoCacheFilter
 */
  @WebFilter(urlPatterns = {"*.xhtml"})
  public class NoCacheFilter implements Filter {

/**
 * Default constructor. 
 */
public NoCacheFilter() {
    // TODO Auto-generated constructor stub
}

/**
 * @see Filter#destroy()
 */
public void destroy() {
    // TODO Auto-generated method stub
}

/**
 * @see Filter#doFilter(ServletRequest, ServletResponse, FilterChain)
 */

@Override
public void doFilter(ServletRequest request, ServletResponse response, FilterChain chain) throws IOException, ServletException {
    HttpServletRequest req = (HttpServletRequest) request;
    HttpServletResponse res = (HttpServletResponse) response;

    // apply no caching for all web pages except resources, you can customize that to be applied for specific pages
    if (!req.getRequestURI().startsWith(req.getContextPath() + ResourceHandler.RESOURCE_IDENTIFIER)) { // Skip JSF resources (CSS/JS/Images/etc)
        res.setHeader("Cache-Control", "no-cache, no-store, must-revalidate"); // HTTP 1.1.
        res.setHeader("Pragma", "no-cache"); // HTTP 1.0.
        res.setDateHeader("Expires", 0); // Proxies.
    }

    chain.doFilter(request, response);
}
/**
 * @see Filter#init(FilterConfig)
 */
public void init(FilterConfig fConfig) throws ServletException {
    // TODO Auto-generated method stub
}

}

according to the answer in this question:

根据这个问题的答案：

Redirect to login page when user clicks on back button after logout in JSF

当用户在 JSF 中注销后单击后退按钮时重定向到登录页面

回答by BalusC

Your initial attempt with HTML <meta http-equiv>tags specifies the right header values, however, this doesn't work at all because your pages are alreadyserved over HTTP. The <meta http-equiv>headers specifies "HTTP-equivalent" headers which are only used when the pages are notserved using the HTTP protocol.

您对 HTML<meta http-equiv>标记的初始尝试指定了正确的标头值，但是，这根本不起作用，因为您的页面已经通过 HTTP 提供服务。所述<meta http-equiv>标头指定“HTTP相当于”报头，其是仅在页面用于不使用HTTP协议服务。

For example, when the pages are opened from local disk file system like as if you were doubleclicking a .htmlfile in local disk file system explorer. This would open the .htmlfile via file://URI instead of http://URI.

例如，当从本地磁盘文件系统打开页面时，就像.html在本地磁盘文件系统资源管理器中双击文件一样。这将.html通过file://URI 而不是http://URI打开文件。

You should be setting those headers on the realHTTP response. You can investigate the headers of the current HTTP response by pressing F12 in Chrome/FireFox>=23/IE>=9 and exploring the HTTP traffic in Networktab. In case of specifically IE9/10, click the Start capturingbutton, reload the page, select the HTML page, click Go to detailed viewbutton and finally click the Response headerstab. Here's a screenshot of how it look like in IE10 on your current question:

您应该在真实的HTTP 响应上设置这些标头。您可以通过在 Chrome/FireFox>=23/IE>=9 中按 F12 并在网络选项卡中探索 HTTP 流量来调查当前 HTTP 响应的标头。如果是 IE9/10，单击开始捕获按钮，重新加载页面，选择 HTML 页面，单击转到详细视图按钮，最后单击响应标题选项卡。这是您当前问题在 IE10 中的外观截图：

The right way to get those headers to end up there is using HttpServletResponse#setHeader()and friends like setDateHeader(), addHeader(), etc. As you figured, one way is a servlet filter.

正确的方式来获得这些头落得有使用HttpServletResponse#setHeader()和这样的朋友setDateHeader()，addHeader()等等。当你想通，一种方式是一个Servlet过滤器。

See also:

也可以看看：

• Avoid back button on JSF web application

• 避免 JSF Web 应用程序上的后退按钮