禁用浏览器的后退按钮

98

如何禁用浏览器的“后退”按钮（跨浏览器）？

asp.net  javascript 
— 普里扬卡·萨卡
source
92
您不拥有用户的计算机或浏览器。
— 实例猎人
47
+1因为尽管我同意禁用浏览器的“后退”按钮是“不好的做法”，但我认为没有理由对问题本身进行投票，回答并解释为什么要采用imo。
— ChristopheD
45
我们为什么对这个问题怀有敌意？就我们所知，提出这个问题的人已经知道这是不好的可用性实践，但是只是在遵循要求，或者他们只是想学习一些东西。我们为什么不假装这是一个假设的问题，并回答如果我们要做这种事情怎么办？
— thomasrutter
5
有些事情永远不要做，无论有什么愿望。对此具有不可商议的要求即刻意味着，这些要求是由没有业务要求的人设定的，这是一个更大的问题。
— annakata
37
嗯，我撰写了有史以来最棒的评论，但是当我不小心按下“后退”按钮时，它丢失了。
— 丹·威廉姆斯

Answers:

26

这个问题是非常相似，这一个 ...

您需要强制使缓存过期才能使其正常工作。将以下代码放在页面代码后面。

Page.Response.Cache.SetCacheability(HttpCacheability.NoCache)
— 罗尔伯格
source
14
请注意，使页面不可缓存并不能达到OP的要求：使用“后退”按钮禁用访问页面。即使浏览器在使用“后退”按钮时遵循无缓存（没有强制执行A​​FAIK的浏览器），它们仍然提供了一种重新加载该页面的方法（通常在显示警告对话框之后）。因此，如果您真的不希望您的用户返回该页面，则情况可能更糟，因为对该页面的请求将一直一直到原始服务器。您将需要在服务器端进行一些操作以检测到该页面已被重新访问。标头可以忽略。
— thomasrutter
60

不要禁用预期的浏览器行为。

使您的页面处理用户返回一两个页面的可能性；不要试图削弱他们的软件。

— 乔纳森·芬兰
source
6
感谢dude，事情是，如果您要构建AJAX应用，则在禁用后退按钮或浏览应用程序以及针对每种可能的情况制定适当的后退操作之间的成本－收益权衡可能倾向于禁用后退按钮是两者中更有吸引力的选项。
— david.barkhuizen 2012年
我会同意乔纳森的观点，尤其是对于目前正在互联网上泛滥的重定向恶意软件广告的泛滥，他们已经滥用了警报系统，使离开他们的页面变得困难，而又没有让他们能够将您实际锁定在其页面上的能力
— MikeT
46

我想出了一个小技巧，可以使用JavaScript禁用后退按钮。我在chrome 10，firefox 3.6和IE9上进行了检查：

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" >
<title>Untitled Page</title>
<script type = "text/javascript" >
function changeHashOnLoad() {
     window.location.href += "#";
     setTimeout("changeHashAgain()", "50"); 
}

function changeHashAgain() {
  window.location.href += "1";
}

var storedHash = window.location.hash;
window.setInterval(function () {
    if (window.location.hash != storedHash) {
         window.location.hash = storedHash;
    }
}, 50);


</script>
</head>
<body onload="changeHashOnLoad(); ">
Try to hit the back button!
</body>
</html>

到底在做什么

来自评论：

该脚本利用了以下事实：浏览器会考虑将URL中“＃”符号后的内容作为浏览历史的一部分。它的作用是：加载页面时，会将“＃1”添加到URL。50ms之后，“ 1”被删除。当用户单击“后退”时，浏览器会将URL改回删除“ 1”之前的URL，但是-这是同一网页，因此浏览器不需要重新加载该页面。– Yossi Shasho

— 尤西·沙肖（Yossi Shasho）
source
1
看起来该脚本在页面加载时在URL上添加了“＃”，并且每隔50毫秒，便在URL后面附加了1。
— ashes999 2011年
6
该脚本利用了以下事实：浏览器会考虑将URL中“＃”符号后的内容作为浏览历史的一部分。它的作用是：加载页面时，会将“＃1”添加到URL。50ms之后，“ 1”被删除。当用户单击“后退”时，浏览器会将URL改回删除“ 1”之前的URL，但是-这是同一网页，因此浏览器不需要重新加载该页面。
— Yossi Shasho
1
请注意，URL更改了两次：我们仅这样做是为了掩盖实现，因此没有人会看到我们添加了“ 1”。因此，实际上，当用户单击时，页面会暂时重新添加“＃1”并再次将其删除。顺便说一句-不必为1，可以是任何字符串。
— Yossi Shasho
2
问题是页面每50毫秒滚动到顶部。如果您的窗体大于窗口高度，则将无法填写窗体值。
— 3komma14年
非常感谢。这对于我拥有的基于JavaScript的特别是交互式页面非常有用，其中向左和向右滚动是机制的一部分。这有助于消除Mac OS X上的滚动手势问题，使用户无意间“退回”页面（如果他们已经一直滚动，则很容易做到）。
— 伊恩·柯林斯
34

其他人则采取了“不这样做”的方法，但这并不能真正回答张贴者的问题。让我们假设每个人都知道这是个坏主意，但是我们很好奇它的完成方式……

您不能禁用用户浏览器上的“后退”按钮，但是可以这样做，以便在用户返回时您的应用程序中断（显示错误消息，要求用户重新开始）。

我见过的一种这样做的方法是在应用程序内的每个URL以及每个表单内的每个URL上传递令牌。在每个页面上都会重新生成令牌，并且一旦用户加载新页面，来自先前页面的所有令牌都会失效。

当用户加载页面时，该页面将仅显示是否向其传递了正确的令牌（该令牌已分配给上一页上的所有链接/表单）。

我的银行提供的在线银行应用程序就是这样。如果您完全使用“后退”按钮，则将无法再使用任何链接，也无法进行任何页面重新加载-而是看到一条通知，告诉您您无法返回，必须重新开始。

— 胸腺
source
1
我的银行采取了另一种方法-完全终止会话。使用“后退”按钮等效于注销。
— RobG 2012年
听起来是一样的方法。他们正在检测到您已返回并抛出错误情况。
— thomasrutter 2012年
joomla也围绕令牌解决方案进行工作，每个页面和每种形式都会生成一个令牌，实际上这种做法存在一些问题，例如“当用户在页面上停留过多而令牌过期时”
— Matteo Bononi'peorthyr'
1
不要误会我的意思，这种做法有很多问题。我不推荐它，我只是说它通常是如何实现的。它们在页面之间传递唯一的令牌，以检测到您没有关注上一页的预期链接之一，然后终止会话或显示错误。它破坏了“后退”按钮，破坏了选项卡式浏览，破坏了书签和/或共享链接，等等–而且，它并不能真正解决任何问题。
— thomasrutter 2014年
如果问题在于如果用户尝试使用后退按钮，则信息丢失或已经损坏，则禁用后退按钮将是更理想的方法。
— PoloHoleSet
10

当我自己寻找答案时，“最佳实践”已经过时了……就像浏览器一样。（实际上，浏览器是丑陋的化石）

最好/最安全的解决方案是让浏览器实现方法/请求，使用户可以授予页面控制界面的能力。

为什么？因为对于我当前的项目，我正在构建100％构建和控制的JavaScript接口。并且由于没有页面更改，因此后退按钮在我的项目中没有位置。（即刷新速度很快，并且由于刷新而没有页面闪烁。就像真正的应用程序一样！）

我知道为什么不存在“劫持”界面的功能，并且我理解它。但是至少我们应该能够从浏览器中请求它！现在，在没有高风险的情况下，这实际上将是“最佳实践”。

但是浏览器就是浏览器..我不希望这方面发生任何事情。

— 恒星魔鬼
source
1
100％的人不同意，虽然此功能对于99％的Web开发人员来说是很棒的，但剩下的1％会滥用此功能，但我认为让网站控制您使用互联网的能力实在太危险了跨域重定向脚本要么需要禁止，要么允许其确认是否由于这种滥用而允许脚本运行
— MikeT
@MikeT-在我自己的特定应用程序页面上导航时禁用“后退”按钮将如何抑制任何人使用Internet的能力？
— PoloHoleSet '19
@PoloHoleSet如果您有能力禁用浏览器的后退按钮，那么每个人也都需要禁用，只需要做一个重定向即可将您发送到您不想访问的页面，以及他们是否可以禁用浏览器中的导航控件你能逃脱吗？我敢肯定，您遇到过“您有一个病毒页面”，他们会提示您安装病毒以删除不存在的病毒，现在想象一下他们实际上可以阻止您离开的站点
— MikeT
@MikeT-我可以在导航窗口中输入其他任何网址，我可以关闭标签页，可以禁用javascript。关键不在于某人是否可以，因为我可以，任何人都可以。出于政策考虑，人们说您不应该，如果可以的话。我们不是在谈论如何设计浏览器，而是在谈论如何对应用程序进行编程。
— PoloHoleSet '19
@PoloHoleSet如果您要锁定导航，则您不仅需要锁定后退按钮，还需要锁定更多，因为浏览器历史记录和键入的url也将为用户提供一种绕过您的工作流程的方法。就像我说的，我们不是在谈论您或我会做什么，而是在讨论恶意元素，如果防止恶意网站控制您的浏览器的唯一方法是禁用浏览器上的所有js，则您已经破坏了互联网，现代网络依赖脚本提供内容这是我的观点，如果你要那么多的控制自己的用户创建一个应用程序，以满足您的工作流程
— MikeT
4

我在搜索相同的问题，但在网站上发现以下代码。想在这里分享：

function noBack()
{
   window.history.forward()
}
noBack();
window.onload = noBack;
window.onpageshow = function(evt){ if(evt.persisted) noBack(); }
window.onunload = function(){ void(0); }

但是，正如上述用户所指出的那样，这永远不是一个好习惯，应出于所有原因避免使用。

— 用户名
source
2
如果您能说明应避免使用它的原因，那将是很好的。
— 克里斯·斯诺
根据我的理解，从技术上讲，您不能禁用某人浏览器上的“后退”按钮，只能这样做，以便该按钮不可用或继续加载同一页面。与其通过JS进行操作，不如使用服务器端代码并​​使用适当的逻辑，而无需使用“后退”按钮。应该使用替代操作，例如重新加载同一页面或显示自定义消息。
— user704988
2

如果您依靠客户端技术，则可以绕开它。例如，可以禁用Javascript。否则用户可能执行JS脚本来解决您的限制。

我的猜测是，您只能通过服务器端跟踪用户会话并将用户/浏览器重定向到所需页面（如在Server.Transfer中，而不是Response.Redirect中）来完成此操作。

— 德维奥
source
2 
<body onLoad="if(history.length>0)history.go(+1)">
— 伦敦
source
2

有几种不同的实现。有一个Flash解决方案和一些针对IE的iframe / frame解决方案。看看这个

http://www.contentwithstyle.co.uk/content/fixing-the-back-button-and-enabling-bookmarking-for-ajax-apps

顺便说一句：禁用（或至少阻止1步）后退按钮有很多有效的理由-以gmail为例，该示例实现了以上文章中讨论的哈希解决方案。

Google“ ajax如何破坏后退按钮”，您会发现很多关于用户测试以及禁用后退按钮有效性的文章。

— 达林·代尔
source
还可以查看Facebook的新照片查看器。请注意，后退按钮可将您带回一张照片（这正是您想要的），而不是使用浏览器默认设置
— DallinDyer 2011年
2

我也有同样的问题，在head标签上或中使用此Java脚本功能，其100％工作正常，不会让您返回。

 <script type = "text/javascript" >
      function preventBack(){window.history.forward();}
        setTimeout("preventBack()", 0);
        window.onunload=function(){null};
    </script>
— 阿卜杜勒·哈利克（Abdul Khaliq）
source
1

试试这个代码。为我工作。页面加载后，它基本上会更改哈希值，这会通过在URL上添加“ 1”来更改最近的历史记录页面。因此，当您单击“后退”按钮时，它每次都会重定向到同一页面。

 <script type="text/javascript">
    var storedHash = window.location.hash;
    function changeHashOnLoad() { window.location.hash = "1";}
    window.onhashchange = function () {
        window.location.hash = storedHash;
    }
</script>

<body onload="changeHashOnLoad(); ">

</bod>
— 什雷斯塔（P Shrestha）
source
0

与其尝试禁用浏览器后退按钮，不如支持它。.NET 3.5可以很好地处理浏览器的后退（和前进）按钮。使用Google搜索：“ Scriptmanager EnableHistory”。您可以控制哪些用户操作会将条目添加到浏览器的历史记录中（ScriptManager-> AddHistoryPoint），并且每当用户单击浏览器的“后退/前进”按钮时，ASP.NET应用程序都会收到一个事件。这将适用于所有已知的浏览器

— 科尼
source
0

在全球范围内，禁用后退按钮确实是一种不好的做法。但是，在某些情况下，后退按钮功能没有意义。

这是防止页面之间不必要的导航的一种方法：

首页（文件top.php）：

<?php
    session_start();
    $_SESSION[pid]++;
    echo "top page $_SESSION[pid]";
    echo "<BR><a href='secondary.php?pid=$_SESSION[pid]'>secondary page</a>";
?>

第二页（文件secondary.php）：

<?php
    session_start();
    if ($_SESSION[pid] != $_GET[pid]) 
        header("location: top.php");
    else {
        echo "secondary page $_SESSION[pid]";
        echo "<BR><a href='top.php'>top</a>";
    }
?>

效果是允许使用您自己的链接从首页向前导航到第二页，然后再返回（例如，取消）。但是，返回首页后，浏览器后退按钮将无法导航到第二页。

— Anono Mouser
source
0

甚至我以前也遇到过同样的情况……并且没有任何帮助。试试这些吧，也许这些对你有用

在登录页面<head>标签中：

<script type="text/javascript">
    window.history.forward();
</script>

在注销按钮中，我这样做：

protected void Btn_Logout_Click(object sender, EventArgs e)      
{
    connObj.Close();
    Session.Abandon();
    Session.RemoveAll();
    Session.Clear();
    HttpContext.Current.Session.Abandon();
}

在登录页面上，我将注意力集中在“用户名”文本框上，如下所示：

protected void Page_Load(object sender, EventArgs e)
{
    _txtUsername.Focus();
}

希望对您有所帮助... :)有人请教我如何编辑此页面...

— 罗宾
source
a）编辑您的答案b）单击问号c）单击高级帮助d）阅读并应用:-)另外请注意，ctrl-k取消/将所选块缩进为代码的un / format。加上格式化程序不能很好地处理制表符（尽管这里可能不是问题）
— kleopatra 2013年
0

如果您需要在Web应用程序中轻轻地按下Delete键和Backspace键，以使它们在编辑/删除项目时不会意外地重定向页面，则可以使用以下代码：

window.addEventListener('keydown', function(e) {
  var key = e.keyCode || e.which;
  if (key == 8 /*BACKSPACE*/ || key == 46/*DELETE*/) {
    var len=window.location.href.length;
    if(window.location.href[len-1]!='#') window.location.href += "#";
  }
},false);
— nvd_ai
source
0

试试这个代码。您只需要在母版页中实现此代码，它将在所有页面上为您工作

<script type="text/javascript">
    window.onload = function () {
        noBack();
    }
    function noBack() {
        window.history.forward();
    }
</script>
<body  onpageshow="if (event.persisted) noBack();">
</body>
— 苏海卜·扬华（Suhaib Janjua）
source
0

Yossi Shasho的代码的问题在于页面每50毫秒滚动到顶部。所以我修改了该代码。现在，它可以在所有现代浏览器（IE8及更高版本）上正常工作

var storedHash = window.location.hash;
function changeHashOnLoad() {
    window.location.href += "#";
    setTimeout("changeHashAgain()", "50");
}

function changeHashAgain() {
    window.location.href += "1";
}

function restoreHash() {
    if (window.location.hash != storedHash) {
        window.location.hash = storedHash;
    }
}

if (window.addEventListener) {
    window.addEventListener("hashchange", function () {
        restoreHash();
    }, false);
}
else if (window.attachEvent) {
    window.attachEvent("onhashchange", function () {
        restoreHash();
    });
}
$(window).load(function () { changeHashOnLoad(); });
— 毗湿奴TS
source
0

这似乎对我们有用。

history.pushState(null, null, $(location).attr('href'));
window.addEventListener('popstate', function () {
    history.pushState(null, null, $(location).attr('href'));
});
— 加布
source
0 
<script>
    $(document).ready(function() {
        function disableBack() { window.history.forward() }

        window.onload = disableBack();
        window.onpageshow = function(evt) { if (evt.persisted) disableBack() }
    });
</script>
— tan
source
By using our site, you acknowledge that you have read and understand our Cookie Policy and Privacy Policy.
Licensed under cc by-sa 3.0 with attribution required.