Reputation: 301
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
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
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
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
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
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
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
Reputation: 4099
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
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
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
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.]
Upvotes: -1
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