ปิดใช้งานปุ่มย้อนกลับของเบราว์เซอร์

Question 1

จะปิดการใช้งานปุ่มย้อนกลับของเบราว์เซอร์ (ข้ามเบราว์เซอร์) ได้อย่างไร?

Question 2

คำถามนี้เป็นคำถามคล้ายกันมากกับเรื่องนี้อย่างใดอย่างหนึ่ง ...

คุณต้องบังคับให้แคชหมดอายุเพื่อให้สามารถใช้งานได้ วางโค้ดต่อไปนี้ไว้ด้านหลังโค้ดเพจของคุณ

Page.Response.Cache.SetCacheability(HttpCacheability.NoCache)

Question 3

อย่าปิดการทำงานของเบราว์เซอร์ที่คาดไว้

ทำให้เพจของคุณรองรับความเป็นไปได้ที่ผู้ใช้จะย้อนกลับไปหนึ่งหรือสองหน้า อย่าพยายามทำให้ซอฟต์แวร์ของพวกเขาพิการ

Question 4

ฉันคิดแฮ็คเล็กน้อยที่ปิดใช้งานปุ่มย้อนกลับโดยใช้ 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 หลังจาก 50 มิลลิวินาที "1" จะถูกลบออก เมื่อผู้ใช้คลิก "ย้อนกลับ" เบราว์เซอร์จะเปลี่ยน URL กลับไปเป็น URL ก่อนที่จะลบ "1" แต่เป็นหน้าเว็บเดียวกันดังนั้นเบราว์เซอร์จึงไม่จำเป็นต้องโหลดหน้าซ้ำ - ยอสซีชาโช

Question 5

คนอื่น ๆ ใช้วิธีบอกว่า "อย่าทำ" แต่นั่นไม่ได้ตอบคำถามของผู้โพสต์อย่างแท้จริง สมมติว่าทุกคนรู้ว่านี่เป็นความคิดที่ไม่ดี แต่เราอยากรู้ว่ามันเป็นอย่างไร ...

คุณไม่สามารถปิดใช้งานปุ่มย้อนกลับบนเบราว์เซอร์ของผู้ใช้ แต่คุณสามารถทำให้แอปพลิเคชันของคุณหยุดทำงานได้ (แสดงข้อความแสดงข้อผิดพลาดทำให้ผู้ใช้ต้องเริ่มต้นใหม่) หากผู้ใช้กลับไป

แนวทางหนึ่งที่ฉันได้เห็นในการทำเช่นนี้คือการส่งโทเค็นในทุก URL ภายในแอปพลิเคชันและในทุกรูปแบบ โทเค็นจะถูกสร้างขึ้นใหม่ในทุกหน้าและเมื่อผู้ใช้โหลดหน้าใหม่โทเค็นจากหน้าที่แล้วจะไม่ถูกต้อง

เมื่อผู้ใช้โหลดเพจเพจจะแสดงก็ต่อเมื่อมีการส่งโทเค็นที่ถูกต้อง (ซึ่งมอบให้กับลิงก์ / แบบฟอร์มทั้งหมดในเพจก่อนหน้านี้)

แอปพลิเคชันธนาคารออนไลน์ที่ธนาคารของฉันมีให้เป็นแบบนี้ หากคุณใช้ปุ่มย้อนกลับเลยลิงก์จะไม่ทำงานอีกต่อไปและไม่สามารถโหลดหน้าเว็บซ้ำได้อีกต่อไป แต่คุณจะเห็นข้อความแจ้งว่าคุณไม่สามารถย้อนกลับได้และคุณต้องเริ่มต้นใหม่

Question 6

ในขณะที่ฉันกำลังหาคำตอบด้วยตัวเอง "แนวทางปฏิบัติที่ดีที่สุด" นั้น .... ล้าสมัย ... เช่นเดียวกับเบราว์เซอร์ (เบราว์เซอร์จริงๆเป็นฟอสซิลที่น่าเกลียด)

ทางออกที่ดีที่สุด / ปลอดภัยที่สุดคือเบราว์เซอร์ใช้วิธีการ / คำขอที่ผู้ใช้สามารถให้ความสามารถในการควบคุมอินเทอร์เฟซแก่เพจได้

ทำไม? เพราะสำหรับโปรเจ็กต์ปัจจุบันของฉันฉันกำลังสร้างอินเทอร์เฟซที่สร้างและควบคุมด้วย JavaScript 100% .. และปุ่มย้อนกลับไม่มีตำแหน่งใดในโปรเจ็กต์ของฉันเนื่องจากไม่มีการเปลี่ยนเพจ (คือเลือดไหลเร็วและไม่มีหน้ากะพริบเพราะรีเฟรช .. เหมือนแอปพลิเคชันจริง!)

ฉันรู้ว่าทำไมความสามารถในการ "ไฮแจ็ค" ถึงไม่มีอินเทอร์เฟซและฉันก็เข้าใจ แต่อย่างน้อยเราควรมีความสามารถในการขอจากเบราว์เซอร์! ตอนนี้นั่นจะเป็น "แนวทางปฏิบัติที่ดีที่สุด" อย่างแท้จริงโดยไม่มีอันตรายจากการเล่นไฮแจ็ค

แต่เบราว์เซอร์เป็นเบราว์เซอร์ .. ฉันไม่คิดว่าจะมีอะไรเกิดขึ้นในเรื่องนี้

Question 7

ฉันกำลังค้นหาคำถามเดียวกันและพบรหัสต่อไปนี้ในไซต์ คิดจะแบ่งปันที่นี่:

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

อย่างไรก็ตามตามที่ระบุไว้โดยผู้ใช้ข้างต้นนี่ไม่ใช่แนวปฏิบัติที่ดีและควรหลีกเลี่ยงด้วยเหตุผลทั้งหมด

Question 8

หากคุณพึ่งพาเทคโนโลยีฝั่งไคลเอ็นต์ก็สามารถหลีกเลี่ยงได้ Javascript อาจถูกปิดใช้งานตัวอย่างเช่น หรือผู้ใช้อาจเรียกใช้สคริปต์ JS เพื่อแก้ไขข้อ จำกัด ของคุณ

ฉันเดาว่าคุณสามารถทำได้โดยการติดตามฝั่งเซิร์ฟเวอร์ของเซสชันผู้ใช้และเปลี่ยนเส้นทาง (เช่นเดียวกับใน Server.Transfer ไม่ใช่ Response.Redirect) ผู้ใช้ / เบราว์เซอร์ไปยังหน้าที่ต้องการ

Question 9

<body onLoad="if(history.length>0)history.go(+1)">

Question 10

มีการใช้งานที่แตกต่างกันเล็กน้อย มีโซลูชันแฟลชและโซลูชัน iframe / frame สำหรับ IE ตรวจสอบสิ่งนี้

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

BTW: มีเหตุผลที่ถูกต้องมากมายในการปิดใช้งาน (หรืออย่างน้อยก็ป้องกัน 1 ขั้นตอน) ปุ่มย้อนกลับ - ดูที่ gmail เป็นตัวอย่างที่ใช้โซลูชันแฮชที่กล่าวถึงในบทความข้างต้น

Google "วิธีที่ ajax หักปุ่มย้อนกลับ" และคุณจะพบบทความมากมายเกี่ยวกับการทดสอบผู้ใช้และความถูกต้องของการปิดใช้งานปุ่มย้อนกลับ

Question 11

ฉันก็มีปัญหาเดียวกันใช้ฟังก์ชัน Java script นี้บน head tag หรือในมันทำงานได้ดี 100% จะไม่ปล่อยให้คุณย้อนกลับไป

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

Question 12

ลองใช้รหัสนี้ ทำงานให้ฉัน โดยทั่วไปจะเปลี่ยนแฮชทันทีที่โหลดหน้าเว็บซึ่งจะเปลี่ยนหน้าประวัติล่าสุดโดยการเพิ่ม "1" ใน URL ดังนั้นเมื่อคุณกดปุ่มย้อนกลับระบบจะเปลี่ยนเส้นทางไปยังหน้าเดิมทุกครั้ง

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

Question 13

คุณควรใช้โพสต์ที่หมดอายุและแคชส่วนหัวที่เหมาะสม

Question 14

แทนที่จะพยายามปิดใช้งานปุ่มย้อนกลับของเบราว์เซอร์จะดีกว่าที่จะสนับสนุน .NET 3.5 สามารถจัดการกับปุ่มย้อนกลับ (และไปข้างหน้า) ของเบราว์เซอร์ได้เป็นอย่างดี ค้นหาด้วย Google: "Scriptmanager EnableHistory" คุณสามารถควบคุมได้ว่าการดำเนินการของผู้ใช้ใดจะเพิ่มรายการในประวัติของเบราว์เซอร์ (ScriptManager -> AddHistoryPoint) และแอปพลิเคชัน ASP.NET ของคุณได้รับเหตุการณ์เมื่อใดก็ตามที่ผู้ใช้คลิกปุ่มย้อนกลับ / ไปข้างหน้าของเบราว์เซอร์ สิ่งนี้จะใช้ได้กับเบราว์เซอร์ที่รู้จักทั้งหมด

Question 15

ทั่วโลกการปิดใช้งานปุ่มย้อนกลับถือเป็นการปฏิบัติที่ไม่ดี แต่ในบางสถานการณ์การทำงานของปุ่มย้อนกลับไม่สมเหตุสมผล

วิธีหนึ่งในการป้องกันการนำทางที่ไม่ต้องการระหว่างเพจ:

หน้าบนสุด (ไฟล์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>";
    }
?>

เอฟเฟกต์คืออนุญาตให้นำทางจากหน้าบนสุดไปข้างหน้าไปยังหน้ารองและย้อนกลับ (เช่นยกเลิก) โดยใช้ลิงก์ของคุณเอง แต่หลังจากกลับไปที่หน้าบนสุดแล้วปุ่มย้อนกลับของเบราว์เซอร์จะถูกป้องกันไม่ให้ไปที่หน้ารอง

Question 16

แม้ว่าฉันจะเผชิญกับสถานการณ์เดียวกันมาก่อน ... และไม่ได้รับความช่วยเหลือใด ๆ ลองทำสิ่งเหล่านี้บางทีสิ่งเหล่านี้อาจได้ผลสำหรับคุณ

ใน<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();
}

หวังว่านี่จะช่วยได้ ... :) มีคนสอนวิธีแก้ไขหน้านี้ ...

Question 17

หากคุณจำเป็นต้องกดปุ่มลบและแบ็กสเปซในเว็บแอพของคุณเบา ๆ เพื่อที่ว่าเมื่อพวกเขากำลังแก้ไข / ลบรายการเพจจะไม่ถูกเปลี่ยนเส้นทางโดยไม่คาดคิดคุณสามารถใช้รหัสนี้:

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);

Question 18

ลองใช้รหัสนี้ คุณต้องติดตั้งโค้ดนี้ในหน้าต้นแบบและจะใช้ได้กับคุณในทุกหน้า

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

Question 19

ปัญหาเกี่ยวกับรหัสของ Yossi Shashoคือหน้าจะเลื่อนไปด้านบนทุกๆ 50 ms ดังนั้นฉันได้แก้ไขรหัสนั้น ตอนนี้มันทำงานได้ดีบนเบราว์เซอร์สมัยใหม่ทั้งหมด 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(); });

Question 20

ดูเหมือนว่าจะได้ผลสำหรับเรา

history.pushState(null, null, $(location).attr('href'));
window.addEventListener('popstate', function () {
    history.pushState(null, null, $(location).attr('href'));
});

Question 21

<script>
    $(document).ready(function() {
        function disableBack() { window.history.forward() }

        window.onload = disableBack();
        window.onpageshow = function(evt) { if (evt.persisted) disableBack() }
    });
</script>