How to you properly invalidate the local cache on a browser?

Question

I'm troubleshooting a problem on my site where a user will authenticate successfully but the browser will load (I believe) the local cache of the page to which the user is redirected. Since it's a local cache, the page appears as if they aren't logged in. Once you refresh the page manually (using the refresh button on your browser), the page shows you as logged in.

This is happening (intermittently) for normal Drupal login events, (often) for Facebook login events, and (intermittently) for page requests after having being logged in and loading pages fine. I've reproduced the error on Firefox and Chrome on Mac.

The site runs on Drupal 7 and uses Varnish (hosted at Pantheon).

Example reproduction steps for seeing the issue with Facebook login: 1. Be logged out of Facebook and my site 2. Log into my site using Facebook login button 3. Log out of my site (using site logout link). I'm still logged into FB 4. Use FB login button on my site to log in

I expected to end up at the home page logged in. Instead, I get redirected to the home page, but a cached version of it (so it appears I'm not logged in). Refreshing the browser causes the home page to reload logged in and I'm set from here.

I've reviewed the headers (below) from the reproduction steps above, and if I understand correctly I think they indicate that the browser is loading the local cache when it should be making a fresh page request. I'm not an expert at caching, so it might be a problem with the headers or something else. I'm just not sure what the cause could be.

Here are the headers from the initial FB login button click. Since I'm already logged into Facebook I'm redirected right away back to my site (this is expected).

Request URL:https://www.facebook.com/dialog/oauth?client_id=407390309287595&redirect_uri=http%3A//www.zujava.com/fboauth/connect&scope=email%2Cuser_about_me%2Cuser_website Request Method:GET Status Code:302 Found Request Headers Accept:text/html,application/xhtml+xml,application/xml;q=0.9,*/*;q=0.8 Accept-Charset:ISO-8859-1,utf-8;q=0.7,*;q=0.3 Accept-Encoding:gzip,deflate,sdch Accept-Language:en-US,en;q=0.8 Connection:keep-alive Cookie:c_user=3413203; csm=2; datr=bq8bT_JILi0PrW8H9GZ5BMy6; fr=0MYU2YYrkDuegxlUi.AWVgxOkdsHe9zhvPJdDW7h70n48; lu=RgWtdyxDRmUr6dOIqyRyPhtg; s=Aa45lsbBS4F1Oll2.BQBsO2; xs=67%3AuZMhOYBden1YIw%3A2%3A1342620598; p=5; act=1342620710713%2F3%3A0; presence=EM342620710EuserFA23413203A2EstateFDutF0EsndF1EnotF0Et2F_5b_5dEuct2F134262011B0Elm2FnullEtrFnullEtwF2196532340EatF1342620710745Esb2F0CEchFDp_5f3413203F1CC; locale=en_US Host:www.facebook.com Referer:http://www.zujava.com/user/login User-Agent:Mozilla/5.0 (Macintosh; Intel Mac OS X 10_7_4) AppleWebKit/536.11 (KHTML, like Gecko) Chrome/20.0.1132.57 Safari/536.11 Query String Parametersview URL encoded client_id:407390309287595 redirect_uri:http://www.zujava.com/fboauth/connect scope:email,user_about_me,user_website Response Headers Cache-Control:private, no-cache, no-store, must-revalidate Connection:keep-alive Content-Length:0 Content-Type:text/html; charset=utf-8 Date:Wed, 18 Jul 2012 14:18:46 GMT Expires:Sat, 01 Jan 2000 00:00:00 GMT Location:http://www.zujava.com/fboauth/connect?code=AQBbeDeOf-cd6HCy6GALaDqESzcfgTJNmh_i5iIx2IpG-KOWBTJHcylhigo82ZGR_X2SOJVzkwcvIKa7rD4dxcg2CLLDa3eZJMkDlP6D3UIU6c-iCFu_TZg6LkfLM4cOGKtu5HraaQUrLUPJd96hOsmpDuW9lzTLuBeMH4fwI7m7p3Jybig1GE06098OJCGuGos#_=_ P3P:CP="Facebook does not have a P3P policy. Learn why here: http://fb.me/p3p" Pragma:no-cache Set-Cookie:locale=en_US; expires=Wed, 25-Jul-2012 14:18:46 GMT; path=/; domain=.facebook.com X-Content-Type-Options:nosniff X-FB-Debug:GPh2t018FPktnIalVO4RrxjZAQ3onlvvFyAEgI6g08U= X-Frame-Options:DENY X-XSS-Protection:0 

Next are the headers that complete the FB login on my site's side. You can see the session cookie being created in the response headers:

Request URL:http://www.zujava.com/fboauth/connect?code=AQBbeDeOf-cd6HCy6GALaDqESzcfgTJNmh_i5iIx2IpG-KOWBTJHcylhigo82ZGR_X2SOJVzkwcvIKa7rD4dxcg2CLLDa3eZJMkDlP6D3UIU6c-iCFu_TZg6LkfLM4cOGKtu5HraaQUrLUPJd96hOsmpDuW9lzTLuBeMH4fwI7m7p3Jybig1GE06098OJCGuGos#_=_ Request Method:GET Status Code:302 Moved Temporarily Request Headers Accept:text/html,application/xhtml+xml,application/xml;q=0.9,*/*;q=0.8 Accept-Charset:ISO-8859-1,utf-8;q=0.7,*;q=0.3 Accept-Encoding:gzip,deflate,sdch Accept-Language:en-US,en;q=0.8 Connection:keep-alive Cookie:ctools-collapsible-state=views-ui-advanced-column-petting_zu_graduates%3A1%2Cviews-ui-advanced-column-newly_published_content%3A1%2Cviews-ui-advanced-column-test%3A1%2Cviews-ui-advanced-column-html_sitemap%3A1; Drupal.tableDrag.showWeight=0; __atuvc=31%7C25%2C4%7C26%2C0%7C27%2C5%7C28%2C5%7C29; has_js=1; __utma=249598093.1349651830.1327187978.1342578105.1342618991.600; __utmb=249598093.64.9.1342621126771; __utmc=249598093; __utmz=249598093.1341848548.567.26.utmcsr=facebook.com|utmccn=(referral)|utmcmd=referral|utmcct=/l.php Host:www.zujava.com Referer:http://www.zujava.com/user/login User-Agent:Mozilla/5.0 (Macintosh; Intel Mac OS X 10_7_4) AppleWebKit/536.11 (KHTML, like Gecko) Chrome/20.0.1132.57 Safari/536.11 Query String Parametersview URL encoded code:AQBbeDeOf-cd6HCy6GALaDqESzcfgTJNmh_i5iIx2IpG-KOWBTJHcylhigo82ZGR_X2SOJVzkwcvIKa7rD4dxcg2CLLDa3eZJMkDlP6D3UIU6c-iCFu_TZg6LkfLM4cOGKtu5HraaQUrLUPJd96hOsmpDuW9lzTLuBeMH4fwI7m7p3Jybig1GE06098OJCGuGos URL fragment #:_=_ Response Headers Age:0 Connection:keep-alive Content-Length:0 Date:Wed, 18 Jul 2012 14:18:47 GMT Location:http://www.zujava.com/ Via:1.1 varnish X-Pantheon-Edge-Server:10.183.199.123 X-Varnish:181771624 cache-control:no-cache, must-revalidate, post-check=0, pre-check=0 content-type:text/html etag:"1342621126" expires:Sun, 19 Nov 1978 05:00:00 GMT last-modified:Wed, 18 Jul 2012 14:18:46 +0000 server:nginx/1.0.15 set-cookie:SESS650d63be2a9c0113cd1740e78b8184ed=961WQoY1iwAJSjEBiuglfI_TDsz3VA8BReyLK2wnz44; expires=Fri, 10-Aug-2012 17:52:07 GMT; path=/; domain=.zujava.com; HttpOnly x-drupal-cache:MISS 

The final home page request:

Request URL:http://www.zujava.com/#_=_ Request Method:GET Status Code:200 OK (from cache) URL fragment #:_=_ 

I believe this indicates the home page is being loaded by the local browser cache, and no request is actually being made to the server. If so, I'm confused as to why. I assume the problem would be in how I'm telling browsers to cache the home page?

Here are the response headers for a logged out page load of the home page:

HTTP/1.1 200 OK Server: nginx/1.0.15 Content-Type: text/html; charset=utf-8 Vary: Accept-Encoding x-drupal-cache: HIT Etag: "1342622308-0" Content-Language: en x-generator: Drupal 7 (http://drupal.org) Cache-Control: public, max-age=10800 Last-Modified: Wed, 18 Jul 2012 14:38:28 +0000 Expires: Sun, 19 Nov 1978 05:00:00 GMT Content-Encoding: gzip Content-Length: 8686 Date: Wed, 18 Jul 2012 14:50:55 GMT X-Varnish: 658648930 658583362 Age: 295 Via: 1.1 varnish Connection: keep-alive X-Pantheon-Edge-Server: 10.183.199.163 

Any hints or ideas would be welcome.

Answer 1

The problem is, as you already wrote it, the homepage is marked as cacheable. So when a user logs in, and she is being redirected to the home page the browser silently serves the cached homepage. You can't invalidate the cache at that point.

You have to make the home page non cacheable by the browser (you can still cache it on varnish for anonymous users) or you have to redirect logged in users to a different page, like: example.com/logged-in which contains the same info as homepage, but is non cacheable.

Cache-ing homepage on browser is a bad idea, because that way you loose statistics info because browser makes no request to server.