按下后退按钮时强制重新加载/刷新

时间:2012-01-30 22:34:18

标签: php mysql codeigniter

我会尽力解释这一点。

我有一个应用程序,显示我的view页面中的50多个项目。用户可以单击单个项目并转到update页面以更新项目信息。除了在用户完成更新单个项目信息并在浏览器上点击“返回”按钮到之前的view page之后,一切正常。旧项目信息(更新前)仍然存在。用户必须点击刷新才能看到更新的信息。它并没有那么糟糕,但我希望提供更好的用户体验。有什么想法解决这个问题?非常感谢。

13 个答案:

答案 0 :(得分:17)

“fb-cache”真的很烦人。这是一个简单的javascript方法:

window.onpageshow = function(evt) {
    // If persisted then it is in the page cache, force a reload of the page.
    if (evt.persisted) {
        document.body.style.display = "none";
        location.reload();
    }
};

在Safari 6和IE10中测试过。

答案 1 :(得分:17)

我使用这四行PHP代码:

// any valid date in the past
header("Expires: Mon, 26 Jul 1997 05:00:00 GMT");
// always modified right now
header("Last-Modified: " . gmdate("D, d M Y H:i:s") . " GMT");
// HTTP/1.1
header("Cache-Control: private, no-store, max-age=0, no-cache, must-revalidate, post-check=0, pre-check=0");
// HTTP/1.0
header("Pragma: no-cache");

密钥是使用Cache-Control标头的“no-store”子句。

答案 2 :(得分:7)

我认为你必须与JS一起工作,因为PHP无法知道用户有权访问哪些浏览器控件...

也许这会有所帮助: http://www.hunlock.com/blogs/Mastering_The_Back_Button_With_Javascript

答案 3 :(得分:2)

 if (window.name == "reloader") {
            window.name = "";
            location.reload();
        }

window.onbeforeunload = function() {
                window.name = "reloader"; 
            }

在每个页面中添加这两个功能

答案 4 :(得分:2)

幸运的是,我们不必支持IE10以下的浏览器,因此,如果您愿意或特权足以支持仅支持HTML5的浏览器,则以下内容应该有效:

/*
 * The following is intentional, to force Firefox to run 
 * this JS snippet after a history invoked back/forward navigation.
 */
window.onunload = function(){};    

function formatTime(t) {
    return t.getHours() + ':' + t.getMinutes() + ':' + t.getSeconds();
}

if (window.history.state != null && window.history.state.hasOwnProperty('historic')) {
    if (window.history.state.historic == true) {
        document.body.style.display = 'none';
        console.log('I was here before at ' + formatTime(window.history.state.last_visit));
        window.history.replaceState({historic: false}, '');
        window.location.reload();
    } else {
        console.log('I was forced to reload, but WELCOME BACK!');
        window.history.replaceState({
            historic  : true,
            last_visit: new Date()
        }, '');
    }
} else {
    console.log('This is my first visit to ' + window.location.pathname);
    window.history.replaceState({
        historic  : true,
        last_visit: new Date()
    }, '');
}

嗯,这里的代码没有评论和松弛:

window.onunload = function(){};

if (window.history.state != null && window.history.state.hasOwnProperty('historic')) {
    if (window.history.state.historic == true) {
        document.body.style.display = 'none';
        window.history.replaceState({historic: false}, '');
        window.location.reload();
    } else {
        window.history.replaceState({historic  : true}, '');
    }
} else {
    window.history.replaceState({historic  : true}, '');
}

坚持在关闭身体标签之前,你会有一个相当干净的解决方案。

这将适用于单击后退/前进的任意组合,以及当用户登陆新页面时,不会发生强制重新加载。

详细了解MDN上的History对象:

MDN - The History Object

MDN - Manupulating the Browser History

答案 5 :(得分:1)

好吧,你可以在更新页面上提供一个内置的后退按钮,将它们发送到新的(如链接<a href="<?= $_SERVER['HTTP_REFERRER']; ?>">BACK</a>或在页面上放置一些脚本,强制它每次都提取数据页面被点击的时间,是否是新的印象,或者是否使用了后退按钮。

答案 6 :(得分:1)

这是我在某些页面中使用过的解决方案。将此添加到更改的页面。

window.onbeforeunload = function() {
     window.name = "reloader"; 
        }
离开这些页面时会触发

。如果进行了更改,您也可以触发它。这样它就不会不必要地重新加载需要重新加载的页面。 然后在浏览器“返回”使用后要重新加载的页面上。

if (window.name == "reloader")
      {
        window.name = "no";
        reloadPage(); 
      }

这将触发您需要重新加载到的页面上的重新加载... 希望这可以帮助 :) 哦,顺便说一句,这是在js。

答案 7 :(得分:1)

这是我用过的解决方案:

<?php
session_start();
if (!$_SESSION['reloaded']) {$_SESSION['reloaded'] = time();}
else if ($_SESSION['reloaded'] && $_SESSION['reloaded'] == time()) { ?> 
<script> 
location.reload(); 
</script> 
<?php } ?>

答案 8 :(得分:1)

以上解决方案均不适合我。 这个简单的解决方案发布了here ...

  

当用户点击后退按钮时,我试图通过浏览器强制再次下载页面,但没有任何效果。我看来,现代浏览器具有单独的页面缓存,它存储页面的完整状态(包括JavaScript生成的DOM元素),因此当用户按下后退按钮时,前一页面立即显示在用户离开的状态。如果您想强制浏览器重新加载后退按钮上的页面,请将onunload =“”添加到您的(X)HTML正文元素中:

<body onunload="">

  

这会禁用特殊缓存并在用户按下时强制页面重新加载   返回键。使用前请三思而后行。需要这样的事实   解决方案是暗示您的网站导航概念存在缺陷。

答案 9 :(得分:1)

经过几天在网上搜索找到解决方案后,我终于搞清楚了,在之后添加:

<script>
 window.onbeforeunload = function(){window.location.reload();}
</script>

这将像魅力一样工作 你会感谢我的

此代码会在您访问时重新加载页面。

答案 10 :(得分:0)

制作一个隐藏的复选框并使用下面的代码(coffeescript)

window.location.reload()  if $("#refreshCheck")[0].checked
  $("#refreshCheck")[0].checked = true

答案 11 :(得分:-1)

我使用jquery和php脚本强制重新加载后退按钮。 window.unload部分只在firefox中需要。已注释超时1秒和正文追加部分仅用于说明功能。 window.location.reload(true)将给出与window.location.href = window.location.href相同的结果;

jquery的:

<script>
    $(window).unload(function() {});


        $.get('h.php',function(data){
            if($.trim(data)=='first'){
               // $('body').append(data)
               // setTimeout(function(){
               window.location.href = window.location.href;
               // },1000)
            }
            else {
                // $('body').append(data)
            }
        });

</script>

h.php:

<?php session_start(); ?>
<?php 
if(!$_SESSION['reloaded']){
    echo 'first';   

    $_SESSION['reloaded']=1;
}
else {
    echo 'second';
    unset($_SESSION['reloaded']);   
}
?>

答案 12 :(得分:-4)

您可以在视图页面上发送HTTP标头,告知浏览器无法缓存该页面。这意味着浏览器每次访问时都需要从服务器请求页面 - 这意味着它始终显示最新信息。

标题需要在任何其他内容之前发送,因此请将以下内容放在视图页面的顶部。

header("Cache-Control: no-cache, must-revalidate");