Sửa đổi giao diện người dùng là một cuộc tấn công độc hại, trong đó người dùng bị lừa nhấp vào các đường liên kết hoặc thành phần trên giao diện người dùng của một trang web có vẻ đáng tin cậy và quen thuộc. Việc này thường được thực hiện bằng cách nhúng một phần hoặc toàn bộ trang web đáng tin cậy vào trang web độc hại bằng <iframe>.
Tiêu đề X-Frame-Options (XFO) và chỉ thị frame-ancestors trong tiêu đề Content-Security-Policy (CSP) có thể giảm thiểu các cuộc tấn công nhấp giả bằng cách kiểm soát cách một trang web có thể được nhúng trong <iframe>.
Nguyên nhân khiến quy trình kiểm tra Lighthouse không thành công
Quy trình kiểm tra sẽ đạt nếu tiêu đề XFO được đặt bằng SAMEORIGIN hoặc DENY hoặc lệnh frame-ancestors được đặt trên tiêu đề CSP. Quy trình kiểm tra sẽ không thành công nếu bạn không thiết lập chính sách kiểm soát khung nào trong số này.
Cách đặt chính sách kiểm soát khung để giảm thiểu hành vi nhấp giả
Bạn cần đặt chính sách kiểm soát khung trên tiêu đề HTTP của yêu cầu tài liệu ban đầu. Tiêu đề X-Frame-Options và lệnh frame-ancestors trong Content-Security-Policy sẽ không hoạt động nếu được đặt trên phần tử <meta>.
Tiêu đề XFO
Việc đặt DENY hoặc SAMEORIGIN cho tiêu đề XFO sẽ giúp giảm thiểu các cuộc tấn công giả mạo lượt nhấp:
X-Frame-Options: SAMEORIGIN
X-Frame-Options: DENY
Chỉ thị SAMEORIGIN chỉ cho phép hiển thị trang nếu tất cả các khung gốc đều có cùng nguồn gốc với chính trang đó. Ngược lại, lệnh DENY ngăn trang hiển thị trong một khung, bất kể nguồn gốc khung mẹ.
Tiêu đề CSP
Chỉ thị frame-ancestors trong tiêu đề CSP xác định những trang web có thể nhúng trang nhất định trong <frame>, <iframe>, <object> hoặc <embed>. Tương tự như XFO, bạn có thể dùng lệnh frame-ancestors của CSP để giảm thiểu các cuộc tấn công giả mạo lượt nhấp bằng cách đặt lệnh này thành self hoặc none:
Content-Security-Policy: frame-ancestors 'self';
Content-Security-Policy: frame-ancestors 'none';
Tuy nhiên, lệnh frame-ancestors linh hoạt hơn XFO vì lệnh này có thể đặt các nguồn mẹ cụ thể có thể nhúng trang:
Content-Security-Policy: frame-ancestors 'self' https://example.com;