Javascript 通过浏览器后退按钮到达时重新加载站点
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/9046184/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Reload the site when reached via browsers back button
提问by sorgenkind
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
我的解决方案（不太有效）：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.
仍然没有成功。
回答by Ali Al-Naimi
You should use a hidden inputas a refresh indicator, with a value of "no":
您应该使用 hiddeninput作为刷新指示器，值为“no”：
<input type="hidden" id="refresh" value="no">
Now using jQuery, you can check its value:
现在使用 jQuery，你可以检查它的值：
$(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.
所以第一次加载页面时，输入的值为“no”。当您返回该页面时，它会是“是”并且您的 JavaScript 代码将触发刷新。
回答by 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.
在尝试了各种不同的解决方案后，我发现 JavaScript Navigation Timing API 最适合检测与后退按钮的交互。
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
它适用于所有主要浏览器：http: //caniuse.com/#search=Navigation%20Timing%20API
回答by Rune Vejen Petersen
You can use the window.onpageshowevent to test if the page comes from the cache.
您可以使用该window.onpageshow事件来测试页面是否来自缓存。
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
请注意，这需要比之前的一些答案（例如 IE11+）更现代的浏览器。有关浏览器支持的更多信息，请参见此处
回答by bherto39
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.
这对我有用，在 drupal 7 (php) 中，每当用户注销时，他都可以按后退按钮并能够访问特权页面。如果页面被刷新，那么他将被路由到他不能做任何事情的首页。
<?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.
有人在这里发帖：谢谢，我希望它也能帮助你。
回答by 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.
不确定，meta 会有所帮助，但您可以对其进行测试。
回答by aditsu quit because SE is EVIL
I found a solution: add no-storeto the Cache-Controlheader. I did it in the http headers, but I guess it could work with meta tags too. Tested in Chromium and Firefox.
我找到了一个解决方案：添加no-store到Cache-Control标题。我在 http 标头中做到了，但我想它也可以与元标记一起使用。在 Chromium 和 Firefox 中测试。
See also How to stop chrome from caching
另请参阅如何阻止 chrome 缓存
回答by jogee31
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
// 过去的日期
回答by mouhammed
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');
}
?>
回答by nuala
I think this questionwill 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.]
[edit(Nickolay): 这就是为什么它会这样工作：webkit.org，developer.mozilla.org。请阅读这些文章（或我在下面单独回答中的总结），并考虑您是否真的需要这样做并让您的用户的页面加载速度变慢。]
回答by user1991703
I think you need exactly reloading - window.location.reload(). But the main issue is cross browser simple solution. Code on PHP:
我认为您需要完全重新加载 - window.location.reload()。但主要问题是跨浏览器的简单解决方案。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 .
并将其打印在 .css 和 js 文件之前。
