如何捕获后退和前进按钮并使用Javascript刷新?

时间:2012-12-17 02:19:25

标签: php javascript

这是一个在线检查:我应该让用户在浏览器中使用后退和前进按钮,并在用户参加考试时刷新页面。 提前感谢您的回答和回复。

1 个答案:

答案 0 :(得分:3)

我认为解决方案不应该依赖客户端代码,因为它可以被客户端修改。我认为对于某种受控环境来说可能是可以的,在这种情况下你可以阻止客户端进入开发者模式。

如果可以控制环境,限制键盘快捷键,右键单击并以全屏模式提供浏览器应该足以确保客户端正确完成任务。

否则,依赖于客户端和服务器之间的键/值令牌的系统应该完成这项工作。一些安全的在线服务依赖于这样的系统,如果您接受打破“后退”和“前进”功能以及刷新页面,它可以很好地工作。当客户端调用这样的破坏功能时,您肯定可以模拟回调。

在某些情况下,仅在JavaScript上确保页面显示非常有用。如生成随机标识符和随机因此页面永远不变等等。

在任何情况下(IMO),出于安全目的完全依赖JavaScript不是(也绝不是)一个好主意。

修改

这是一个概念验证:

服务器生成uniqid,客户端使用html5本地存储功能存储该值。使用本地存储作为键/值注册表,我们可以存储页面阶段,并将每次重新加载与存储的密钥进行比较,与服务器新生成的密钥进行比较。

这非常简单,用作服务器生成的令牌可以随机化很多,防止任何人猜测它。

足够长的服务器生成令牌甚至可以为客户端本地存储注册表提供良好的一次性加密密钥。

代码:

<?php   
    $stamp = uniqid();
?>
<!DOCTYPE html>
<html>
<head>
<script src="//cdnjs.cloudflare.com/ajax/libs/json2/20110223/json2.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
<script src="https://raw.github.com/andris9/jStorage/master/jstorage.js"></script>
    <style>
        body{background-color:blue;}
        p{margin-left:auto;margin-right:auto;width:800px;background-color:gray;font-weight:bolder;padding:1em;}
    </style>
    <script>
    // display nice messages
    var err_reloaded_page = "page reloaded";

    var keeper = '<?php echo $stamp; ?>';
    var current = $.jStorage.get('state');
        // first initialization, Exception
        if(current ==  null){
            $.jStorage.set('state',keeper);
            current = $.jStorage.get('state');
        }

        if(current != keeper){
            alert(err_reloaded_page);
        }
    </script>
</head>
<body>
    <p>
        Proof of concept<br/>
        Can detect page reload by comparing a stamp created server-side, stored on the local storage and compared on each page reload.
    </p>
</body>
</html>