Internet Explorer 10后退按钮缓存

Question

In Internet Explorer 10, if you press the back button it would try to fetch the previous page from the browser cache. This behavior differs from virtually every other browser including IE9 in which pressing the back button would do a full reload of the previous page instead of reusing the cache.

How do I communicate with IE10 from the website, possibly using javascript/headers etc to not do this cache utilization for the site globally?

(Note: I'm not looking for an IE10 setting to disable this. I'm looking for a solution that can be implemented in the Website and not the browser to instruct IE10 to not use this cache for the back button). Also I'm looking for a global solution that works for every page in the site...

I use PHP/Jquery for the site

so here's more information

The page is a Form. It contains some dynamically loaded info. (Let's say it contains the number of times the user submitted the form)

You click on the submit button of the form. You will then then get redirected to the form's action page.

Then you press the back button.

In every other browser, it would reload the initial form with the newly updated "number of times the user submitted the form". In IE10 however, this doesn't happen....How do I get this to happen in IE 10.

Here are some example headers:

1. When you first load the form:

Request Header

Key Value
Request GET /path/to/my/page HTTP/1.1
Accept  text/html, application/xhtml+xml, */*
Accept-Language en-US
User-Agent  Mozilla/5.0 (compatible; MSIE 10.0; Windows NT 6.1; WOW64; Trident/6.0)
Accept-Encoding gzip, deflate
Host    myhost.com
If-Modified-Since   Tue, 10 Sep 2013 23:55:33 GMT
If-None-Match   "1378857333"
DNT 1
Connection  Keep-Alive
Cookie  __utma=104299925.1011127538.1340896287.1364829735.1378764406.12; __utmz=104299925.1340896287.1.1.utmcsr=(direct)|utmccn=(direct)|utmcmd=(none); has_js=1; __utmc=104299925; __qca=P0-1247924781-1340896285157; _mkto_trk=id:601-CPX-764&token:_mch-sadfsadfze.com-1358808312889-73607; __utma=171146939.775168663.1343066079.1375907514.1378762647.41; __utmz=171146939.1343066079.1.1.utmcsr=(direct)|utmccn=(direct)|utmcmd=(none); s_stats_browser_info=%7B%22pluginInfo%22%3A%7B%22pdf%22%3A%5B%22pdf%22%2C%22application/pdf%22%2C%220%22%5D%2C%22quicktime%22%3A%5B%22qt%22%2C%22video/quicktime%22%2C%220%22%5D%2C%22realplayer%22%3A%5B%22realp%22%2C%22audio/x-pn-realaudio-plugin%22%2C%220%22%5D%2C%22wma%22%3A%5B%22wma%22%2C%22application/x-mplayer2%22%2C%220%22%5D%2C%22director%22%3A%5B%22dir%22%2C%22application/x-director%22%2C%220%22%5D%2C%22flash%22%3A%5B%22fla%22%2C%22application/x-shockwave-flash%22%2C%220%22%5D%2C%22java%22%3A%5B%22java%22%2C%22application/x-java-vm%22%2C%221%22%5D%2C%22gears%22%3A%5B%22gears%22%2C%22application/x-googlegears%22%2C%220%22%5D%2C%22silverlight%22%3A%5B%22ag%22%2C%22application/x-silverlight%22%2C%220%22%5D%7D%2C%22res%22%3A%221920x1080%22%7D; _pk_id.2.1644=19232922ec6753dc.1371502517.1.1371502630.1371502517.; SESS569093948b0206b05eb2212616da3db6=1977iogjr841af2s8l4sd1cjd0; XDEBUG_SESSION=12250; has_js=1; __utmc=171146939

Response Header:

> Key   Value Response  HTTP/1.1 200 OK Date    Tue, 10 Sep 2013 23:55:44 GMT
> Server    Apache/2.2.20 (Ubuntu) X-Powered-By PHP/5.4.15-1~tooptee10+1
> Last-Modified Tue, 10 Sep 2013 23:55:44 +0000 Cache-Control   no-cache,
> must-revalidate, post-check=0, pre-check=0 ETag   "1378857344"
> Keep-Alive    timeout=15, max=9987 Connection Keep-Alive
> Content-Type  text/html; charset=utf-8

2. When you hit the back button to go back to that form

Request Header

>     Key   Value
>     Request   GET /path/to/my/page HTTP/1.1
>     Accept    text/html, application/xhtml+xml, */*
>     Accept-Language   en-US
>     User-Agent    Mozilla/5.0 (compatible; MSIE 10.0; Windows NT 6.1; WOW64; Trident/6.0)
>     Accept-Encoding   gzip, deflate
>     Host  myhost.com

Response Header

> Key   Value Response  HTTP/1.1 304 Not Modified
> X-Powered-By  PHP/5.4.15-1~tooptee10+1 ETag   "1378857344"
> Keep-Alive    timeout=15, max=9987 Content-Type   text/html; charset=utf-8
> Content-Length    117183 Expires  Tue, 10 Sep 2013 22:55:36 GMT
> Last-Modified Tue, 10 Sep 2013 23:55:44 GMT

Notice that it ends up returning a 304. When I tried this in Firefox, it returned 200 instead when you press the back button.

Answer 1

I think the behaviour you want is a behaviour that breaks the expectation of the back button for users.

Users expect that when they press back, it returns them back to the page they were previously viewing, in the state it was in when they left it. Most modern browsers achieve this by not only caching the page, but by retaining the page state (including the Javascript context) in memory so that when returning to the page via the back button, it's in the same state it was before, including anything they wrote into forms or any Javascript they interacted with.

In most browsers you can forcibly override this by setting Cache-Control headers such as no-cache and no-store. I don't know if no-store would work in your case for IE10, or if IE10 ignores even this and just goes back to the page anyway. If it did, I don't think I'd really blame it. It's doing it in the user's interest of both being fast, and of returning back to the page as it was when it was viewed before.

I think the approach that I would take, and you don't have to agree with me, is to re-think the design. Why do you require users to hit "back" if you are not going to show them the same thing they saw when they were back there? If you want to show an updated form, why not redirect after POST back to the form, which will count as a new page load and honor your Cache-Control headers? That is what I'd do and it's become somewhat of a de-facto standard.

tl;dr it's possible, but I'm not certain, that you could do what you want with no-store, but I'd be looking at moving to redirect after POST instead so as not to rely on the back button for something other than going back to the previous state.