Khi liên kết đến một trang trên trang web khác bằng thuộc tính target="_blank"
, bạn có thể khiến trang web của mình gặp phải các vấn đề về hiệu suất và bảo mật:
- Trang khác có thể chạy trên cùng một quy trình với trang của bạn. Nếu trang khác đang chạy nhiều JavaScript, hiệu suất của trang có thể bị ảnh hưởng.
- Trang khác có thể truy cập vào đối tượng
window
của bạn bằng thuộc tínhwindow.opener
. Hành động này có thể cho phép trang khác chuyển hướng trang của bạn đến một URL độc hại.
Việc thêm rel="noopener"
hoặc rel="noreferrer"
vào đường liên kết target="_blank"
sẽ giúp tránh được các vấn đề này.
Cách Lighthouse không kiểm tra được đích đến nhiều nguồn gốc
Lighthouse gắn cờ những đường liên kết không an toàn tới các đích đến nhiều nguồn gốc:
Lighthouse sử dụng quy trình sau để xác định các đường liên kết là không an toàn:
- Thu thập tất cả thẻ
<a>
chứa thuộc tínhtarget="_blank"
nhưng không chứa thuộc tínhrel="noopener"
hoặcrel="noreferrer"
. - Lọc ra mọi đường liên kết cùng máy chủ lưu trữ.
Vì Lighthouse lọc ra các đường liên kết cùng máy chủ, nên có một trường hợp đặc biệt mà bạn cần lưu ý nếu đang làm việc trên một trang web lớn: nếu một trang chứa đường liên kết target="_blank"
đến một trang khác trên trang web của bạn mà không sử dụng rel="noopener"
, thì hệ quả về hiệu suất của quá trình kiểm tra này vẫn áp dụng.
Tuy nhiên, bạn sẽ không thấy các đường liên kết này trong kết quả Lighthouse.
Cách cải thiện hiệu suất trang web và ngăn chặn lỗ hổng bảo mật
Thêm rel="noopener"
hoặc rel="noreferrer"
vào mỗi đường liên kết được xác định trong báo cáo Lighthouse.
Nhìn chung, khi bạn sử dụng target="_blank"
, hãy luôn thêm rel="noopener"
hoặc rel="noreferrer"
:
<a href="https://examplepetstore.com" target="_blank" rel="noopener">
Example Pet Store
</a>
rel="noopener"
ngăn không cho trang mới truy cập vào thuộc tínhwindow.opener
và đảm bảo trang này chạy trong một quy trình riêng.rel="noreferrer"
có tác dụng tương tự nhưng cũng ngăn tiêu đềReferer
được gửi đến trang mới. Xem Loại đường liên kết "BÁO CÁO".
Xem bài đăng Chia sẻ tài nguyên nhiều nguồn gốc một cách an toàn để biết thêm thông tin.