Deaktivieren Sie die Zurück-Schaltfläche des Browsers

98

Wie deaktiviere ich die BACK-Taste des Browsers (für alle Browser)?

asp.net  javascript 
— priyanka.sarkar
quelle
92
Sie besitzen weder die Computer Ihrer Benutzer noch deren Browser.
— Instance Hunter
47
+1 Obwohl ich damit einverstanden bin, dass das Deaktivieren der Zurück-Schaltfläche des Browsers eine „schlechte Praxis“ ist, sehe ich keinen Grund, die Frage selbst herunterzustimmen, zu beantworten und zu erklären, warum dies der richtige Weg ist.
— ChristopheD
45
Warum stehen wir dieser Frage feindlich gegenüber? Nach allem, was wir wissen, weiß die Person, die diese Frage stellt, bereits, dass dies eine schlechte Usability-Praxis ist, aber nur den Anforderungen folgt, oder sie möchte einfach nur etwas lernen. Warum tun wir nicht einfach so, als wäre dies eine hypothetische Frage, und beantworten, wie wir es tun würden, wenn wir so etwas tun würden?
— Thomasrutter
5
Einige Dinge sollten niemals getan werden, unabhängig von dem Wunsch, sie zu tun. Eine nicht verhandelbare Anforderung dafür zu haben, bedeutet sofort, dass die Anforderungen von Personen festgelegt wurden, die sie nicht geschäftlich festgelegt haben, was ein viel größeres Problem darstellt.
— Annakata
37
ugh, ich habe den großartigsten Kommentar aller Zeiten verfasst, ihn aber verloren, als ich versehentlich auf den Zurück-Button geklickt habe.
— Dan Williams

Antworten:

26

Diese Frage ist sehr ähnlich wie diese ein ...

Sie müssen erzwingen, dass der Cache abläuft, damit dies funktioniert. Platzieren Sie den folgenden Code auf Ihrem Seitencode dahinter.

Page.Response.Cache.SetCacheability(HttpCacheability.NoCache)
— RSolberg
quelle
14
Beachten Sie, dass das Nicht-Zwischenspeichern der Seite nicht das erreicht, was das OP wollte: das Deaktivieren von Besuchsseiten mit der Zurück-Schaltfläche. Selbst wenn ein Browser bei Verwendung der Zurück-Schaltfläche (welche Browser nicht verpflichtet sind, AFAIK auszuführen) dem No-Cache folgt, bietet er dennoch die Möglichkeit, diese Seite neu zu laden (normalerweise nach dem Anzeigen eines Warndialogs). Wenn Sie also wirklich nicht möchten, dass Ihre Benutzer zu dieser Seite zurückkehren, kann dies schlimmer sein, da die Anforderung für diese Seite den gesamten Weg zum Ursprungsserver finden muss. Sie benötigen etwas Server-seitiges, um zu erkennen, dass die Seite erneut besucht wurde. Überschriften können ignoriert werden.
— Thomasrutter
60

Deaktivieren Sie das erwartete Browserverhalten nicht.

Stellen Sie sicher, dass Ihre Seiten die Möglichkeit haben, dass Benutzer ein oder zwei Seiten zurückgehen. Versuchen Sie nicht, ihre Software zu lähmen.

— Jonathan Fingland
quelle
6
Vielen Dank, Alter. Wenn Sie eine AJAX-App erstellen, kann der Kosten-Nutzen-Kompromiss zwischen dem Deaktivieren der Zurück-Schaltfläche oder dem Durchlaufen Ihrer App und dem Ausarbeiten der entsprechenden Zurück-Aktion für jedes mögliche Szenario dazu führen, dass diese deaktiviert wird Der Zurück-Knopf ist die attraktivere Option der beiden.
— David.Barkhuizen
Ich würde Jonathan zustimmen, insbesondere mit der Flut von Weiterleitungs-Malware-Anzeigen, die derzeit das Internet überfluten. Sie missbrauchen bereits das Warnsystem, um das Verlassen ihrer Seiten zu erschweren, ohne ihnen die Möglichkeit zu geben, Sie tatsächlich auf ihre Seite zu
— binden
46

Ich habe mir einen kleinen Hack ausgedacht, der die Zurück-Schaltfläche mit JavaScript deaktiviert. Ich habe es auf Chrome 10, Firefox 3.6 und IE9 überprüft:

<!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>

Was macht es?

Aus den Kommentaren:

Dieses Skript nutzt die Tatsache, dass Browser berücksichtigen, was nach dem "#" -Zeichen in der URL als Teil des Browserverlaufs steht. Dies bewirkt Folgendes: Wenn die Seite geladen wird, wird der URL "# 1" hinzugefügt. Nach 50 ms wird die "1" entfernt. Wenn der Benutzer auf "Zurück" klickt, ändert der Browser die URL wieder auf den Stand vor dem Entfernen der "1", ABER - es handelt sich um dieselbe Webseite, sodass der Browser die Seite nicht neu laden muss. - Yossi Shasho

— Yossi Shasho
quelle
1
Es sieht so aus, als würde dieses Skript der URL beim Laden der Seite "#" hinzufügen und alle 50 ms eine 1 an die URL anhängen.
— Asche999
6
Dieses Skript nutzt die Tatsache, dass Browser berücksichtigen, was nach dem "#" in der URL als Teil des Browserverlaufs steht. Dies bewirkt Folgendes: Wenn die Seite geladen wird, wird der URL "# 1" hinzugefügt. Nach 50 ms wird die "1" entfernt. Wenn der Benutzer auf "Zurück" klickt, ändert der Browser die URL wieder auf den Stand vor dem Entfernen der "1", ABER es handelt sich um dieselbe Webseite, sodass der Browser die Seite nicht neu laden muss.
— Yossi Shasho
1
Beachten Sie, dass sich die URL zweimal ändert: Wir tun dies nur, um die Implementierung zu verschleiern, sodass niemand sieht, dass wir "1" hinzugefügt haben. Wenn der Benutzer zurückklickt, fügt die Seite die "Nr. 1" für einen Moment wieder hinzu und entfernt sie erneut. Übrigens - es muss nicht "1" sein, es kann eine beliebige Zeichenfolge sein.
— Yossi Shasho
2
Das Problem dabei ist, dass die Seite alle 50 ms nach oben scrollt. Wenn Sie ein Formular haben, das größer als die Fensterhöhe ist, können die Formularwerte nicht ausgefüllt werden.
— 3komma14
Vielen Dank. Dies ist sehr nützlich für eine JavaScript-basierte, besonders interaktive Seite, auf der das Scrollen nach links und rechts Teil der Mechanik ist. Dies hilft, das Problem der Bildlaufgeste unter Mac OS X zu beseitigen, mit der Benutzer versehentlich eine Seite "zurück" führen (alles zu einfach, wenn sie bereits vollständig gescrollt sind).
— Iain Collins
34

Andere haben den Ansatz gewählt, "Tu das nicht" zu sagen, aber das beantwortet die Frage des Posters nicht wirklich. Nehmen wir einfach an, dass jeder weiß, dass dies eine schlechte Idee ist, aber wir sind gespannt, wie es trotzdem gemacht wird ...

Sie können die Zurück-Schaltfläche im Browser eines Benutzers nicht deaktivieren, aber Sie können festlegen, dass Ihre Anwendung unterbrochen wird (zeigt eine Fehlermeldung an, bei der der Benutzer neu beginnen muss), wenn der Benutzer zurückkehrt.

Ein Ansatz, den ich dafür gesehen habe, besteht darin, ein Token für jede URL in der Anwendung und in jedem Formular zu übergeben. Das Token wird auf jeder Seite neu generiert, und sobald der Benutzer eine neue Seite lädt, werden alle Token von vorherigen Seiten ungültig.

Wenn der Benutzer eine Seite lädt, wird auf der Seite nur angezeigt, ob das richtige Token (das allen Links / Formularen auf der vorherigen Seite zugewiesen wurde) an diese Seite übergeben wurde.

Die von meiner Bank bereitgestellte Online-Banking-Anwendung ist wie folgt. Wenn Sie die Schaltfläche "Zurück" verwenden, funktionieren keine Links mehr und es können keine Seiten neu geladen werden. Stattdessen wird ein Hinweis angezeigt, dass Sie nicht zurückkehren können und von vorne beginnen müssen.

— thomasrutter
quelle
1
Meine Bank verfolgt einen anderen Ansatz - sie beendet die Sitzung vollständig. Die Verwendung der Zurück-Schaltfläche entspricht dem Abmelden.
— RobG
Das klingt nach dem gleichen Ansatz. Sie stellen fest, dass Sie zurückgegangen sind und einen Fehlerzustand gemeldet haben.
— Thomasrutter
Joomla arbeitet auch an der Token-Lösung. Ein Token wird von jeder Seite und jedem Formular generiert. Tatsächlich gibt es einige Probleme mit dieser Vorgehensweise, z. B. "Wenn ein Benutzer zu viel auf einer Seite
— bleibt
1
Versteh mich nicht falsch, es gibt viele Probleme mit dieser Praxis. Ich empfehle es nicht, ich sage nur, wie es normalerweise erreicht wird. Sie übergeben eindeutige Token zwischen den Seiten, um festzustellen, dass Sie einem der erwarteten Links auf der vorherigen Seite nicht gefolgt sind, und beenden dann die Sitzung oder zeigen einen Fehler an. Es bricht die Zurück-Schaltfläche, es bricht das Browsen mit Registerkarten, es bricht das Lesezeichen und / oder das Teilen von Links und vieles mehr - und außerdem löst es keine wirklichen Probleme.
— Thomasrutter
Wenn das Problem darin besteht, dass Informationen verloren gehen oder bereits unterbrochen werden, wenn der Benutzer versucht, die Zurück-Taste zu verwenden, ist das Deaktivieren der Zurück-Taste ein wünschenswerter Ansatz.
— PoloHoleSet
10

Während ich selbst nach der Antwort suche, ist "Best Practice" ... veraltet ... genau wie Browser. (Wirklich Browser sind hässliche Fossilien)

Die beste / sicherste Lösung wäre, dass Browser eine Methode / Anforderung implementieren, bei der der Benutzer der Seite die Möglichkeit geben kann, die Benutzeroberfläche zu steuern.

Warum? Weil ich für mein aktuelles Projekt eine zu 100% aus JavaScript erstellte und kontrollierte Oberfläche baue. Und die Schaltflächen "Zurück" haben keinen Platz in meinem Projekt, da es keinen Seitenwechsel gibt. (Dh verdammt schnell und keine Seitenblitze wegen einer Aktualisierung. Genau wie bei einer echten Anwendung!)

Ich weiß, warum die Fähigkeit, die Schnittstelle zu "highjacken", nicht vorhanden ist, und ich verstehe es. Aber zumindest sollten wir die Möglichkeit haben, es vom Browser anzufordern! Nun, das wäre wirklich "Best Practice" ohne die Highjack-Gefahren.

Aber Browser sind Browser. Ich erwarte nicht, dass diesbezüglich etwas Aufregendes passiert.

— StellarDevil
quelle
1
100% sind anderer Meinung, obwohl diese Funktionalität für 99% der Webentwickler wunderbar wäre, während die verbleibenden 1% diese Funktionalität missbrauchen würden, ist es meiner Meinung nach viel zu gefährlich, einer Website zu erlauben, Ihre Fähigkeit zur Nutzung des Internets zu kontrollieren Cross-Domain-Redirect-Skript muss entweder gesperrt werden oder muss bestätigt werden, ob das Skript aufgrund genau dieser Art von Missbrauch ausgeführt werden
— darf
@MikeT - Wie würde das Deaktivieren einer Schaltfläche "Zurück" beim Navigieren auf meinen eigenen Anwendungsseiten die Nutzung des Internets beeinträchtigen?
— PoloHoleSet
@PoloHoleSet Wenn Sie die Möglichkeit haben, die Schaltfläche "Zurück" des Browsers zu deaktivieren, benötigen Sie nur eine Weiterleitung, um zu einer Seite zu gelangen, zu der Sie nicht gehen möchten, und wenn sie Ihre Navigationssteuerelemente im Browser deaktivieren können, wie entkommst du Ich bin sicher, Sie sind auf die Seite "Sie haben einen Virus" gestoßen, auf der Sie aufgefordert werden, den Virus zu installieren, um den nicht vorhandenen Virus zu entfernen. Stellen Sie sich nun die Site vor, auf der sie Sie tatsächlich am Verlassen hindern können
— MikeT
@MikeT - Ich kann jede andere URL in das Navigationsfenster eingeben, einen Tab schließen und Javascript deaktivieren. Es geht nicht darum, ob jemand KANN, denn Sie können, ich kann, jeder kann. Aus politischen Gründen sagen die Leute, dass Sie nicht sollten, wenn Sie können. Wir reden nicht darüber, wie wir einen Browser entwerfen würden, wir reden darüber, wie wir eine Anwendung programmieren.
— PoloHoleSet
@PoloHoleSet Wenn Sie die Navigation sperren möchten, müssen Sie mehr als nur die Schaltfläche "Zurück" sperren, da der Browserverlauf und die eingegebenen URLs den Benutzern auch die Möglichkeit bieten, Ihren Arbeitsablauf zu umgehen. und wie gesagt, wir reden nicht über das, was Sie oder ich tun würden, sondern über das böswillige Element. Wenn die einzige Möglichkeit, zu verhindern, dass eine böswillige Website die Kontrolle über Ihren Browser übernimmt, darin besteht, alle JS in Ihrem Browser zu deaktivieren, haben Sie das Internet als defekt Das moderne Web ist auf Skripte angewiesen, um Inhalte bereitzustellen.
— Dies
4

Ich habe nach derselben Frage gesucht und auf einer Site folgenden Code gefunden. Dachte, es hier zu teilen:

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

Wie von den oben genannten Benutzern erwähnt, ist dies jedoch niemals eine gute Vorgehensweise und sollte aus allen Gründen vermieden werden.

— user704988
quelle
2
Es wäre gut, wenn Sie die Gründe angeben könnten, warum dies vermieden werden sollte.
— Chris Snow
Nach meinem Verständnis können Sie die Schaltfläche "Zurück" im Browser einer anderen Person technisch nicht deaktivieren. Sie können sie nur so gestalten, dass die Schaltfläche nicht verfügbar ist oder weiterhin dieselbe Seite lädt. Verwenden Sie anstelle von JS serverseitigen Code und die richtige Logik, für die die Schaltfläche Zurück nicht erforderlich ist. Es sollten alternative Aktionen wie das erneute Laden derselben Seite oder das Anzeigen einer benutzerdefinierten Nachricht verwendet werden.
— user704988
2

Wenn Sie sich auf clientseitige Technologie verlassen, kann diese umgangen werden. Javascript kann beispielsweise deaktiviert sein. Oder der Benutzer führt möglicherweise ein JS-Skript aus, um Ihre Einschränkungen zu umgehen.

Ich vermute, Sie können dies nur tun, indem Sie die Benutzersitzung serverseitig verfolgen und den Benutzer / Browser (wie in Server.Transfer, nicht Response.Redirect) auf die gewünschte Seite umleiten.

— devio
quelle
2 
<body onLoad="if(history.length>0)history.go(+1)">
— London
quelle
2

Es gab einige verschiedene Implementierungen. Es gibt eine Flash-Lösung und einige Iframe / Frame-Lösungen für IE. Schau dir das an

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

Übrigens: Es gibt viele triftige Gründe, eine Zurück-Schaltfläche zu deaktivieren (oder zumindest 1 Schritt zu verhindern). Sehen Sie sich Google Mail als Beispiel an, das die im obigen Artikel beschriebene Hash-Lösung implementiert.

Google "Wie Ajax den Zurück-Button kaputt gemacht hat" und Sie finden zahlreiche Artikel zu Benutzertests und der Gültigkeit des Deaktivierens des Zurück-Buttons.

— DallinDyer
quelle
Schauen Sie sich auch den neuen Foto-Viewer von Facebook an. Beachten Sie, dass Sie mit der Schaltfläche "Zurück" ein Foto
— zurücknehmen
2

Ich hatte auch das gleiche Problem, verwenden Sie diese Java-Skript-Funktion auf Head-Tag oder in, es funktioniert zu 100% gut, würde Sie nicht zurücklassen.

 <script type = "text/javascript" >
      function preventBack(){window.history.forward();}
        setTimeout("preventBack()", 0);
        window.onunload=function(){null};
    </script>
— Abdul Khaliq
quelle
1

Versuchen Sie diesen Code. Hat für mich gearbeitet. Grundsätzlich wird der Hash geändert, sobald die Seite geladen wird. Dadurch wird die Seite mit dem letzten Verlauf geändert, indem der URL "1" hinzugefügt wird. Wenn Sie also auf die Schaltfläche "Zurück" klicken, wird jedes Mal auf dieselbe Seite umgeleitet.

 <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
quelle
0

Anstatt zu versuchen, die Zurück-Schaltfläche des Browsers zu deaktivieren, ist es besser, sie zu unterstützen. .NET 3.5 kann sehr gut mit den Schaltflächen zum Zurück- (und Vorwärts-) Schalten des Browsers umgehen. Suche mit Google: "Scriptmanager EnableHistory". Sie können steuern, welche Benutzeraktionen einen Eintrag zum Browserverlauf hinzufügen (ScriptManager -> AddHistoryPoint) und Ihre ASP.NET-Anwendung ein Ereignis empfängt, wenn der Benutzer auf die Schaltflächen Zurück / Weiter des Browsers klickt. Dies funktioniert für alle bekannten Browser

— Corne
quelle
0

Das Deaktivieren der Zurück-Taste ist weltweit in der Tat eine schlechte Praxis. In bestimmten Situationen ist die Funktion der Zurück-Taste jedoch nicht sinnvoll.

Hier ist eine Möglichkeit, unerwünschte Navigation zwischen Seiten zu verhindern:

Startseite (Datei top.php):

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

Sekundärseite (Datei 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>";
    }
?>

Der Effekt besteht darin, dass Sie mithilfe Ihrer eigenen Links von der oberen Seite zur zweiten Seite und zurück navigieren (z. B. Abbrechen). Nach der Rückkehr zur obersten Seite wird jedoch verhindert, dass die Schaltfläche "Zurück" des Browsers zur sekundären Seite navigiert.

— Anono Mouser
quelle
0

Sogar ich hatte vorher die gleiche Situation ... und hatte keine Hilfe. Probieren Sie diese Dinge aus, vielleicht funktionieren sie für Sie

im <head>Tag der Anmeldeseite :

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

In der Abmeldeschaltfläche habe ich Folgendes getan:

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

und auf der Anmeldeseite habe ich den Fokus auf das Textfeld Benutzername wie folgt gelegt:

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

hoffe das hilft ... :) jemand bringt mir bitte bei, wie man diese Seite bearbeitet ...

— Robin
quelle
a) Bearbeiten Sie Ihre Antwort. b) Klicken Sie auf das Fragezeichen. c) Klicken Sie auf Erweiterte Hilfe. Außerdem kann der Formatierer Tabs nicht gut verarbeiten (hier wahrscheinlich kein Problem)
— Kleopatra
0

Wenn Sie die Lösch- und Rücktaste in Ihrer Web-App sanft unterdrücken müssen, damit die Seite beim Bearbeiten / Löschen von Elementen nicht unerwartet umgeleitet wird, können Sie diesen Code verwenden:

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
quelle
0

Versuchen Sie diesen Code. Sie müssen diesen Code nur auf der Masterseite implementieren und er funktioniert auf allen Seiten für Sie

<script type="text/javascript">
    window.onload = function () {
        noBack();
    }
    function noBack() {
        window.history.forward();
    }
</script>
<body  onpageshow="if (event.persisted) noBack();">
</body>
— Suhaib Janjua
quelle
0

Das Problem mit Yossi Shashos Code ist, dass die Seite alle 50 ms nach oben rollt. Also habe ich diesen Code geändert. Jetzt funktioniert es einwandfrei auf allen modernen Browsern, IE8 und höher

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(); });
— Vishnu TS
quelle
0

Das scheint bei uns funktioniert zu haben.

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

        window.onload = disableBack();
        window.onpageshow = function(evt) { if (evt.persisted) disableBack() }
    });
</script>
— Chetan
quelle
Durch die Nutzung unserer Website bestätigen Sie, dass Sie unsere Cookie-Richtlinie und Datenschutzrichtlinie gelesen und verstanden haben.
Licensed under cc by-sa 3.0 with attribution required.