เมื่อไม่นานมานี้ฉันต้องได้รับแหล่งที่มาของหน้าผ่าน JavaScript การดำเนินการนี้ง่ายมาก คุณสามารถรับได้โดยใช้ document.referrer อย่างไรก็ตามยังมีสถานการณ์ที่ไม่คาดคิดมากมายในแอปพลิเคชันจริงดังนั้นมาเรียงสั้น ๆ ที่นี่
ปัญหาแรกที่ฉันพบคือหลังจากไปจากหน้า https ไปยังหน้า http ค่าของ document.referrer ว่างเปล่า ด้วยเหตุผลด้านความปลอดภัยบางหน้าสำคัญของเว็บไซต์หลายแห่ง (เช่นหน้าเข้าสู่ระบบของ Taobao) ใช้โปรโตคอล HTTPS หากผู้ใช้ที่ไม่ได้เข้าสู่ระบบคลิกที่ลิงค์ไปยังหน้า B (หน้า http) ในหน้า A (หน้า http) แต่หน้า B ต้องการให้ผู้ใช้เข้าสู่ระบบดังนั้นเขาจึงกระโดดไปที่หน้าเข้าสู่ระบบ ผู้อ้างอิงหากมีหน้า HTTP และหน้า HTTPS ในเส้นทางจากนั้นเส้นทางจะถูกทำลายจาก HTTPS เป็น HTTP
รากของปัญหานี้คือนโยบายความปลอดภัยของเบราว์เซอร์และดูเหมือนว่าจะไม่มีทางออกที่ดีเป็นพิเศษในการพึ่งพา JavaScript เพียงอย่างเดียว แนวคิดวงเวียนคือการใช้ window.name เขียน url ของหน้าปัจจุบันลงใน window.name บนหน้า https แล้วอ่านในหน้าถัดไป (หน้า http)
นอกเหนือจากสถานการณ์นี้เอกสารสามารถดึงข้อมูลได้ตามปกติโดยการกระโดดหน้าอื่น ๆ หรือไม่? ฉันค้นหาและพบว่ามีคนรวบรวมรายการที่นี่ แต่มันยังไม่สมบูรณ์เช่นกรณีของ IE6 ที่ไม่รวมอยู่ ดังนั้นฉันจึงทำเองติดตั้งเบราว์เซอร์ N ในเครื่องเสมือนจริงและทดสอบสถานการณ์ทั้งหมด (มันเป็นงานทางกายภาพ) และผลลัพธ์ที่แสดงในตารางด้านล่าง:
| ดำเนินงาน | IE6 | IE7 | IE8 | IE9 | Firefox | โครเมี่ยม | โอเปร่า | ซาฟารี |
|---|---|---|---|---|---|---|---|---|
| ป้อน URL โดยตรงในแถบที่อยู่ | - | - | - | - | - | - | - | - |
| เข้าถึง URL จากบุ๊คมาร์ค | - | - | - | - | - | - | - | - |
| คลิกการเชื่อมโยงหลายมิติจากหน้า A และข้ามไปที่หน้า B (target =” _ self”) | ||||||||
| คลิกการเชื่อมโยงหลายมิติจากหน้า A และข้ามไปที่หน้า B (target =” _ blank”) | ||||||||
| คลิกขวาที่ไฮเปอร์ลิงก์จากหน้า A และเปิดหน้า B ในแท็บใหม่ | - | - | ||||||
| คลิกขวาที่ไฮเปอร์ลิงก์จากหน้า A และเปิดหน้า B ในหน้าต่างใหม่ | - | |||||||
| ลากลิงก์ไปยังแถบที่อยู่ | - | ไม่สามารถลากได้ | ไม่สามารถลากได้ | - | - | - | - | - |
| ลากลิงก์ไปยังแถบแท็บ | - | - | - | - | - | - | - | - |
| ใช้ปุ่มไปข้างหน้าและด้านหลังของเบราว์เซอร์ | ||||||||
| js แก้ไขตำแหน่ง href | - | - | - | |||||
| js ใช้ window.open | - | - | - | - | ||||
| การเปลี่ยนเส้นทางเซิร์ฟเวอร์ (302 กระโดด) | กำหนดเป้าหมายหน้าก่อนหน้า | กำหนดเป้าหมายหน้าก่อนหน้า | กำหนดเป้าหมายหน้าก่อนหน้า | กำหนดเป้าหมายหน้าก่อนหน้า | กำหนดเป้าหมายหน้าก่อนหน้า | กำหนดเป้าหมายหน้าก่อนหน้า | กำหนดเป้าหมายหน้าก่อนหน้า | กำหนดเป้าหมายหน้าก่อนหน้า |
| การรีเฟรชหน้าเมตา | - | - | - | - | - | หน้าเปลี่ยน | หน้าเปลี่ยน | หน้าเปลี่ยน |
"√" ในตารางด้านบนหมายความว่าผู้อ้างอิงสามารถเรียกคืนได้ตามปกติ "" หมายความว่าผู้อ้างอิงว่างเปล่า
ยกเว้น IE เบราว์เซอร์อื่น ๆ เป็นเวอร์ชันล่าสุดที่สามารถดาวน์โหลดได้บนเว็บไซต์ทางการ ในหมู่พวกเขา Safari ทดสอบทั้งเวอร์ชัน Windows และรุ่น MAC และข้อสรุปก็เหมือนกัน
นอกจากนี้ยังมีบางกรณีที่ไม่มีการทดสอบใด ๆ เช่นว่าผู้อ้างอิงสามารถรักษาได้ภายใต้เบราว์เซอร์แต่ละตัวเมื่อคลิกแฟลชเพื่อกระโดด
สถานการณ์ส่วนใหญ่ในตารางข้างต้นสอดคล้องกับความคาดหวัง แต่ดูเหมือนจะมีหลายสิ่งที่จะให้ความสนใจกับ:
1. ใน Safari การคลิกขวาเพื่อเปิดลิงค์จะทำให้ผู้อ้างอิงหายไป;
2. ใน IE การแก้ไขตำแหน่ง href หรือใช้ window.open เพื่อเปิดหน้าจะสูญเสียผู้อ้างอิง (มีข้อยกเว้นใน IE 9 โดยใช้ location.href เพื่อกระโดดจะไม่สูญเสียผู้อ้างอิง);
3. เมื่อใช้ Meta Jump ผู้อ้างอิงจะหายไปภายใต้ IE/Firefox
ในที่สุดข้อสรุปง่ายๆคือ: หากคุณต้องการเข้าถึงแหล่งข้อมูลผ่านหน้าเอกสารการรวบรวมข้อมูลการรวบรวมจะเป็นการดีที่สุดที่จะไม่ใช้ JS เพื่อกระโดดหรือเปิดหน้าต่างใหม่หรือใช้เมตาเพื่อกระโดด