บทความนี้อธิบายวิธีการของ JS เพื่อป้องกันไม่ให้หน้าเว็บถูกฝังอยู่ในกรอบ IFRAME แบ่งปันสำหรับการอ้างอิงของคุณดังนี้:
ตัวอย่างเช่น:
<script type = "text/javascript"> if (window! = top) // พิจารณาว่าวัตถุหน้าต่างปัจจุบันเป็นวัตถุด้านบน top.location.href = window.location.href; // หากไม่ได้นำ URL ของวัตถุด้านบนไปยัง URL ที่ฝังอยู่ในเว็บเพจ </script> โดยอัตโนมัติโดยอัตโนมัติ
รหัสนี้ใช้ได้ อย่างไรก็ตามมีปัญหา: หลังจากใช้มันไม่มีใครสามารถฝังหน้าเว็บของคุณลงในกรอบรวมถึงตัวคุณเอง
ดังนั้นวันนี้ฉันกำลังพิจารณาว่ามีวิธีที่จะทำให้หน้าเว็บของฉันฝังอยู่ในกรอบของตัวเองเท่านั้นไม่ใช่กรอบของคนอื่นหรือไม่?
บนพื้นผิวคำถามนี้ง่ายมาก เพียงแค่ตัดสิน: ไม่ว่าชื่อโดเมนของกรอบปัจจุบันและกรอบระดับบนสุดจะเหมือนกันหรือไม่และหากคำตอบคือ NO การเปลี่ยนเส้นทาง URL จะเสร็จสิ้น
if (top.location.hostname! = window.location.hostname) {top.location.href = window.location.href;}อย่างไรก็ตามโดยไม่คาดคิดการเขียนนี้ผิดและไม่สามารถทำงานได้เลย คุณเห็นไหมว่าความผิดพลาดอยู่ที่ไหน?
สมมติว่า top.location.hostname คือ www.111.com และ window.location.hostname คือ www.222.com กล่าวคือ 111.com ฝัง 222.com ลงในหน้าเว็บ ในเวลานี้จะเกิดอะไรขึ้นถ้าคุณเปรียบเทียบ top.location.hostname! = window.location.hostname?
เบราว์เซอร์จะแจ้งข้อผิดพลาดของรหัส!
เนื่องจากเป็นข้ามโดเมนนโยบายความปลอดภัยของเบราว์เซอร์จึงไม่อนุญาตให้หน้าเว็บของ 222.com ใช้งานหน้าเว็บของ 111.com และในทางกลับกัน เช่นเรียกข้อผิดพลาดนี้ว่า "ไม่มีสิทธิ์" นอกจากนี้เบราว์เซอร์ไม่อนุญาตให้คุณดู top.location.hostname ในกรณีข้ามโดเมนคุณจะรายงานข้อผิดพลาดโดยตรงทันทีที่คุณเห็นวัตถุนี้
ดังนั้นรหัสควรแก้ไขอย่างไร?
ในความเป็นจริงสิ่งนี้จะแจ้งให้เราตรวจสอบว่า top.location.hostname มีการรายงานว่าเป็นข้อผิดพลาดหรือไม่ หากมีการรายงานข้อผิดพลาดแสดงว่ามีการข้ามโดเมนและวัตถุด้านบนจะถูกเปลี่ยนเส้นทาง หากมีการรายงานข้อผิดพลาดแสดงว่าไม่มีการใช้ cross-domain (หรือเฟรมเวิร์กไม่ได้ใช้) จะไม่มีการดำเนินการใด ๆ
ลอง {top.location.hostname;} catch (e) {top.location.href = window.location.href;}สิ่งนี้เขียนอย่างถูกต้องและสามารถทำงานได้อย่างถูกต้องใน IE และ Firefox อย่างไรก็ตาม Chrome จะมีข้อผิดพลาด ด้วยเหตุผลบางอย่างในสถานการณ์ข้ามโดเมน Chrome ไม่ได้รายงานข้อผิดพลาดไปที่ Top.location.hostname!
ไม่มีทางฉันสามารถเพิ่มรหัสเสริมอีกชิ้นหนึ่งสำหรับ Chrome
ลอง {top.location.hostname; if (top.location.hostname! = window.location.hostname) {top.location.href = window.location.href; }} catch (e) {top.location.href = window.location.href;}ตกลงรหัสเวอร์ชันที่อัพเกรดเสร็จสมบูรณ์ ยกเว้นชื่อโดเมนในเครื่องไม่มีชื่อโดเมนอื่นใดที่สามารถฝังหน้าเว็บของคุณลงในเฟรมเวิร์กได้
สำหรับข้อมูลเพิ่มเติมเกี่ยวกับเนื้อหาที่เกี่ยวข้องกับ JavaScript โปรดตรวจสอบหัวข้อของเว็บไซต์นี้: "สรุปการดำเนินการ JavaScript ทักษะ iframe", "สรุปทักษะการดำเนินงานอาร์เรย์ JavaScript", "สรุปการใช้งานทางคณิตศาสตร์ของ JavaScript "บทสรุปของเอฟเฟกต์และทักษะพิเศษของ JavaScript Animation", "สรุปข้อผิดพลาดของ JavaScript และทักษะการดีบัก" และ "สรุปอัลกอริทึมและทักษะการสำรวจ JavaScript Traversal"
ฉันหวังว่าบทความนี้จะเป็นประโยชน์กับการเขียนโปรแกรม JavaScript ของทุกคน