O clickjacking é um ataque malicioso em que os usuários são enganados para clicar em links ou elementos da interface em um site que parece ser confiável e conhecido. Isso geralmente é feito incorporando parte ou todo o site confiável no site malicioso usando um <iframe>.
O cabeçalho X-Frame-Options (XFO) e a diretiva frame-ancestors no cabeçalho Content-Security-Policy (CSP) podem reduzir os ataques de clickjacking controlando como um site pode ser incorporado em um <iframe>.
Como a auditoria do Lighthouse falha
A auditoria será aprovada se o cabeçalho XFO estiver definido com SAMEORIGIN ou DENY ou se a diretiva frame-ancestors estiver definida no cabeçalho CSP. A auditoria vai falhar se nenhuma dessas políticas de controle de frame estiver configurada.
Como definir uma política de controle de frame para reduzir o clickjacking
Uma política de controle de frame precisa ser definida nos cabeçalhos HTTP da solicitação inicial do documento. O cabeçalho X-Frame-Options e a diretiva frame-ancestors no Content-Security-Policy não vão funcionar se forem definidos em um elemento <meta>.
Cabeçalho XFO
A definição de DENY ou SAMEORIGIN para o cabeçalho XFO vai reduzir os ataques de clickjacking:
X-Frame-Options: SAMEORIGIN
X-Frame-Options: DENY
A diretiva SAMEORIGIN permite que a página seja exibida somente se todos os frames ancestrais tiverem a mesma origem que a página. Por outro lado, a diretiva DENY impede que a página seja mostrada em um frame, independentemente da origem do frame pai.
Cabeçalho CSP
A diretiva frame-ancestors no cabeçalho do CSP define quais sites podem incorporar a página em um <frame>, <iframe>, <object> ou <embed>. Assim como o XFO, a diretiva frame-ancestors do CSP pode ser usada para reduzir ataques de clickjacking, definindo-a como self ou none:
Content-Security-Policy: frame-ancestors 'self';
Content-Security-Policy: frame-ancestors 'none';
No entanto, a diretiva frame-ancestors é mais flexível que a XFO porque pode definir fontes mãe específicas que podem incorporar a página:
Content-Security-Policy: frame-ancestors 'self' https://example.com;