เมื่อลิงก์ไปยังหน้าในเว็บไซต์อื่นโดยใช้แอตทริบิวต์ target="_blank" คุณอาจทำให้เว็บไซต์ของคุณประสบปัญหาด้านประสิทธิภาพและความปลอดภัยได้
- หน้าเว็บอื่นอาจทำงานในกระบวนการเดียวกับหน้าเว็บของคุณ หากหน้าเว็บอื่นเรียกใช้ JavaScript จำนวนมาก ประสิทธิภาพของหน้าเว็บอาจลดลง
- หน้าอื่นๆ จะเข้าถึงออบเจ็กต์
windowที่มีพร็อพเพอร์ตี้window.openerได้ ซึ่งอาจทำให้หน้าเว็บอื่นเปลี่ยนเส้นทางหน้าเว็บของคุณไปยัง URL ที่เป็นอันตรายได้
การเพิ่ม rel="noopener" หรือ rel="noreferrer"
ลงในลิงก์ target="_blank" จะช่วยหลีกเลี่ยงปัญหาเหล่านี้ได้
สาเหตุที่การตรวจสอบปลายทางแบบข้ามต้นทางของ Lighthouse ไม่สำเร็จ
Lighthouse จะแจ้งลิงก์ที่ไม่ปลอดภัยไปยังปลายทางแบบ Cross-Origin
Lighthouse ใช้กระบวนการต่อไปนี้เพื่อระบุว่าลิงก์ไม่ปลอดภัย
- รวบรวมแท็ก
<a>ทั้งหมดที่มีแอตทริบิวต์target="_blank"แต่ไม่มีแอตทริบิวต์rel="noopener"หรือrel="noreferrer" - กรองลิงก์ที่มาจากโฮสต์เดียวกันออก
เนื่องจาก Lighthouse จะกรองลิงก์ที่โฮสต์เดียวกันออก จึงมีกรณีข้อยกเว้นที่คุณควร
ระมัดระวังเมื่อทำงานในเว็บไซต์ขนาดใหญ่ หากหน้าเว็บหนึ่งมี
target="_blank"ลิงก์ไปยังหน้าเว็บอื่นในเว็บไซต์โดยไม่ได้ใช้
rel="noopener" ผลกระทบด้านประสิทธิภาพของการตรวจสอบนี้จะยังคงมีผล
อย่างไรก็ตาม คุณจะไม่เห็นลิงก์เหล่านี้ในผลลัพธ์ของ Lighthouse
ปรับปรุงประสิทธิภาพของเว็บไซต์และป้องกันช่องโหว่ด้านความปลอดภัย
เพิ่ม rel="noopener" หรือ rel="noreferrer"
ในแต่ละลิงก์ที่ระบุในรายงาน Lighthouse
โดยทั่วไป เมื่อใช้ target="_blank" ให้เพิ่ม rel="noopener" หรือ rel="noreferrer" เสมอ
<a href="https://examplepetstore.com" target="_blank" rel="noopener">
Example Pet Store
</a>
rel="noopener"ป้องกันไม่ให้หน้าใหม่เข้าถึงพร็อพเพอร์ตี้window.openerและทำให้มั่นใจว่าหน้าใหม่จะทำงานในกระบวนการแยกต่างหากrel="noreferrer"มีผลเช่นเดียวกันและยังป้องกันไม่ให้ส่งส่วนหัวRefererไปยัง หน้าใหม่ด้วย
อ่านข้อมูลเพิ่มเติมได้ที่แชร์ทรัพยากรข้ามโดเมนอย่างปลอดภัย