Links âncora costumam vir acompanhados de algum atributo, que gerencia o que acontece sempre que ele é acessado.
Normalmente, esse atributo é o target _blank, que gera um comando para o navegador abrir uma nova guia ou janela quando o usuário clica nesse link.
Hoje, esse atributo funciona perfeitamente com o HTML5. Entretanto, não era tão compatível com o HTML, mas as pessoas utilizavam da mesma forma, pois facilitava a navegação na página.
O problema é que esse comportamento gerou um hábito ruim; muitos desenvolvedores se acostumaram a utilizar a tag target=”_blank” em links externos, sem inserir a tag rel=”noopener”.
Isso deixa brechas para um ataque de phishing — cibercriminoso cria uma versão falsa de uma página confiável para atrair usuários e roubar seus dados.
Infelizmente, a maioria dos sites não sabe lidar com isso corretamente, pois muitos já estão acostumados a inserir essa tag sem nenhum acompanhamento.
Quer entender como corrigir essa vulnerabilidade? Acompanhe o conteúdo a seguir!
Como funciona o ataque
Se você utilizar a tag target=”_blank” sem a correção, o site que está sendo vinculado ganha acesso parcial à página através da tag window.opener.
Com isso, é possível alterar a página para uma página falsa. Veja um exemplo: se o Facebook não tivesse corrigido esse problema, você poderia criar uma página e compartilhar em seu perfil.
Cada vez que alguém acessar seu site, você utilizaria a tag window.opener.location = ‘https: //paginafalsa.com/facebook/index-falsa.html’.
Assim, o usuário seria redirecionado para uma página, que lhe pediria para inserir novamente a senha do Facebook.
Entretanto, não é possível fazer um teste com o WordPress, pois seus links externos possuem por padrão a tag rel=”noopener”.
Por outro lado, é possível acessar essa página para ver o funcionamento da vulnerabilidade.
Exemplos
Uma página vulnerável possui o seguinte código:
- <html>
- <body>
- <li><a href=”mau.exemplo.com.br” target=”_blank”>Target vulnerável usando um link html para abrir uma nova página</a></li>
- <button onclick=”window.open(‘https://mau.exemplo.com.br’)”>Target vulnerável usando um JavaScript para abrir uma nova página</button>
- </body>
- </html>
Nesse sentido, um site malicioso consegue se vincular à sua página, da seguinte forma:
- <html>
- <body>
- <script>
- if (window.opener) {
- window.opener.location = “https://phish.exemplo.com.br”;
- }
- </script>
- </body>
- </html>
Assim que o visitante clica no link vulnerável, o site malicioso é aberto em outra página, substituindo o destina da guia pelo phishing. É assim que o cibercriminosos consegue roubar informações valiosas dos usuários, se aproveitando de brechas em sites confiáveis.
Propriedades acessíveis
Um site malicioso só consegue acessar as propriedades da página autêntica, por meio da propriedade window.opener, quando esta possui um ponto de acesso com domínios cruzados:
- opener.closed: devolve um valor booleano que indica se uma janela foi fechada ou não;
- opener.frames: devolve todos os elementos iframe na janela atual;
- opener.length: devolve o número de elementos iframe na janela atual;
- opener.opener: devolve uma referência à janela que criou a página;
- opener.parent: retorna para a janela âncora da janela atual;
- opener.self: retorna para a janela atual.
- opener.top: retorna para a janela superior do navegador.
Caso todos os domínios sejam os mesmos, o site malicioso consegue invadir todas as propriedades expostas pelo window.opener.
Como corrigir com rel=”noopener”
Como você viu, o grande problema de usar o target _blank em links externos sem qualquer acompanhamento de segurança, torna a propriedade windows.opener acessível para sites maliciosos.
Para corrigir essa vulnerabilidade, adicione a tag rel=”noopener” em todos seus links externos. Na prática, todos os links ficarão do seguinte modo:
- <a href=”https://exemplo.com” target=”_blank” rel=”noopener”>Um Local</a>.
Vale destacar que o navegador Firefox não suporta a tag noopener. Então, você deve usar a tag rel=”noopener noreferrer” nos seus links externos. Nesse caso, os links ficarão assim:
- <a href=”https://exemplo.com” target=”_blank” rel=”noopener noreferer”>Um Local</a>.
Mesmo que você não esteja acostumado a usar a tag corretamente, algumas ferramentas e sites já estão corrigindo o erro, facilitando para os usuários. Caso você tenha um site ou uma landing page, utilize a tag target=”_blank” corretamente, como mostrado a pouco.
Conclusão
Com todas as informações que te mostramos por aqui, você, com certeza, entendeu a importância de utilizar o target _blank corretamente em sua página. Por isso, siga as orientações à risca para proteger a integridade do seu site e evitar ciberataques.
