Reload the site when reached via browsers back button

Problem: I have a site with dynamic content which needs to be reloaded every time the user sees it. This includes the use case when a user hits the back button on an another site and comes to the site needed to be reloaded. Most (all?) browsers don't refresh the site after this event.

My solution (which isn't quite working): http://www.hunlock.com/blogs/Mastering_The_Back_Button_With_Javascript

window.onbeforeunload = function () {
    // This function does nothing.  It won't spawn a confirmation dialog
    // But it will ensure that the page is not cached by the browser.
}

But it still doesn't refresh the page.

Any ideas what can affect/block the desired behavior? Respectively any other solution suggestions for this problem?

edit:

Set following:

Cache-Control   private, must-revalidate, max-age=0
Expires Sat, 26 Jul 1997 05:00:00 GMT
Pragma  no-cache

and:

<meta name="cache-control" content="no-cache" />
<meta name="expires" content="0" />
<meta name="pragma" content="no-cache" />

still no success.

Ali Al-Naimi

You should use a hidden input as a refresh indicator, with a value of "no":

<input type="hidden" id="refresh" value="no">

Now using jQuery, you can check its value:

$(document).ready(function(e) {
    var $input = $('#refresh');

    $input.val() == 'yes' ? location.reload(true) : $input.val('yes');
});

When you click on the back button, the values in hidden fields retain the same value as when you originally left the page.

So the first time you load the page, the input's value would be "no". When you return to the page, it'll be "yes" and your JavaScript code will trigger a refresh.

Hasan Akhtar

After trying out various different solutions I have found that the JavaScript Navigation Timing API works best for detecting interactions with the back button.

All you have to do is this:

if(!!window.performance && window.performance.navigation.type == 2)
{
    window.location.reload();
}

And it works well with all major browsers: http://caniuse.com/#search=Navigation%20Timing%20API

Is My Page Being Loaded from the Browser Cache?

You can use the window.onpageshow event to test if the page comes from the cache.

window.onpageshow = function (event) {
  if (event.persisted) {
    window.location.reload(); //reload page if it has been loaded from cache
  }
};

Note that this requires more modern browsers than some of the previous answers (such as IE11+). For more info on browser support see here

this worked for me, in drupal 7 (php) whenever a user logs out, he can press the back button and able to visit the privileged pages. If a page is refreshed, then he is routed to a front page where he can't do anything.

    <?php 
        //refresh the page after log-out and back button
        if (!user_is_logged_in())
        {

          print '<input type="hidden" id="refreshed" value="no">
                 <script type="text/javascript">
                  onload=function(){

                    var e=document.getElementById("refreshed");
                    if(e.value=="no")e.value="yes";
                    else{e.value="no";location.reload();}
                  }
                </script>';
        }
  ?>

somebody posted here: thanks i hope it help you too.

Jashwant

Does it help ?

Reload the page on hitting back button

Or with meta tags,

<meta http-equiv="cache-control" content="no-cache"> <!-- tells browser not to cache -->
<meta http-equiv="expires" content="0"> <!-- says that the cache expires 'now' -->
<meta http-equiv="pragma" content="no-cache"> <!-- says not to use cached stuff, if there is any -->

Not sure, the meta will help, but you can test it.

aditsu

I found a solution: add no-store to the Cache-Control header. I did it in the http headers, but I guess it could work with meta tags too. Tested in Chromium and Firefox.

Try this :

header("Cache-Control: no-store, must-revalidate, max-age=0");
header("Pragma: no-cache");
header("Expires: Sat, 26 Jul 1997 05:00:00 GMT");

// A date in the past

You could use this code in a custom module :

<?php 
/**
 * Implements hook_init().
 */
function MY_MODULE_init() {
  drupal_add_http_header('Cache-Control', 'no-cache, no-store, max-age=0, must-revalidate, post-check=0, pre-check=0');
}
?>

nuala

I think this question will help you.

[edit(Nickolay): here's why it works that way: webkit.org, developer.mozilla.org. Please read those articles (or my summary in a separate answer below) and consider whether you really need to do this and make your page load slower for your users.]

Nickolay's answer

I think you need exactly reloading - window.location.reload(). But the main issue is cross browser simple solution. Code on PHP:

$inline_javascript = 'var uniqueString = ' . time() . ';' .
                     'if (uniqueString === window.name) {' .
                     '  window.location.relace();' .
                     '} else {' .
                     '  window.name = uniqueString;' .
                     '}';

And print it before css and js files in the .

来源：https://stackoverflow.com/questions/9046184/reload-the-site-when-reached-via-browsers-back-button

标签

javascript

onbeforeunload