sorgenkind
sorgenkind

Reputation: 301

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.

Upvotes: 25

Views: 69510

Answers (11)

pdolinaj
pdolinaj

Reputation: 1145

This is what I'm using to reload page on browser Back Button:

if(performance.getEntriesByType("navigation")[0].type == "back_forward"){
    location.reload();
}

Upvotes: 0

Rune Vejen Petersen
Rune Vejen Petersen

Reputation: 3239

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

Upvotes: 7

Hasan Akhtar
Hasan Akhtar

Reputation: 261

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?

Upvotes: 23

Ali Al-Naimi
Ali Al-Naimi

Reputation: 738

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.

Upvotes: 58

mouhammed
mouhammed

Reputation: 954

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');
}
?>

Upvotes: 0

jogee31
jogee31

Reputation: 9

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

Upvotes: 0

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.

See also How to stop chrome from caching

Upvotes: 0

bherto39
bherto39

Reputation: 1826

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.

Upvotes: 1

user1991703
user1991703

Reputation: 1

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 .

Upvotes: -1

nuala
nuala

Reputation: 2689

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

Upvotes: -1

Jashwant
Jashwant

Reputation: 29025

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.

Upvotes: 0

Related Questions