O tamanho da janela do browser é um dos parâmetros que as aplicações Web podem utilizar para identificar os dispositivos dos utilizadores. Embora esta informação possa parecer insignificante à primeira vista, as suas caraterísticas únicas podem ser uma ferramenta poderosa nos sistemas antifraude. Esses sistemas analisam o tamanho das janelas do browser, incluindo alterações em tempo real, bem como os dados transmitidos nos cabeçalhos HTTP para detetar actividades suspeitas e identificar tentativas de falsificação de informações. ###### História e aplicações da análise da dimensão da janela do navegador A medição do tamanho da janela do browser (viewport) foi disponibilizada pela primeira vez aos programadores através da API DOM, a partir das primeiras versões do JavaScript. Estes dados foram utilizados para adaptar o conteúdo aos ecrãs dos utilizadores. Com a evolução da tecnologia, os sistemas antifraude começaram a utilizar o tamanho da janela como um parâmetro adicional para criar uma impressão digital do utilizador. Atualmente, os dados relativos ao tamanho da janela podem incluir: - Dimensões da janela de visualização (window.innerWidth e window.innerHeight). - O tamanho total da janela do browser. - Resoluções de ecrã suportadas. - Taxa de atualização do ecrã. Estes parâmetros podem variar consoante o dispositivo, o sistema operativo e o browser, criando um conjunto único de caraterísticas. ###### Tamanhos de janela em cabeçalhos HTTP Alguns navegadores transmitem informações sobre o tamanho da janela em cabeçalhos HTTP, tais como User-Agent Client Hints (por exemplo, Viewport-Width e Device-Width). Isto permite que os sítios Web adaptem o conteúdo às dimensões do ecrã, mas também permite que os sistemas antifraude utilizem estes dados para verificar a existência de falsificações. **Exemplo de dados transmitidos - Largura do ecrã: 1920 - Largura do dispositivo: 2560 Uma discrepância entre os dados comunicados e o tamanho real da janela pode indicar a utilização de um programa de navegação anti-deteção. ###### Métodos de identificação do utilizador através da dimensão das janelas **1. Análise da estabilidade do tamanho** Os sistemas antifraude registam as alterações no tamanho da janela durante uma sessão. Por exemplo: - Alterações bruscas de tamanho (especialmente se corresponderem a resoluções predefinidas populares) podem indicar falsificação. - Valores constantes de tamanho de janela que não são caraterísticos do dispositivo podem ser sinais de emulação. **2. Comparação com a resolução do ecrã** O sistema verifica se o tamanho da janela corresponde à resolução de ecrã declarada: - Se a resolução do ecrã for 1920×1080 e as dimensões da janela forem 3000×2000, pode tratar-se de uma tentativa de falsificação. **3.Utilizar anomalias na renderização** Por vezes, os navegadores podem indicar dimensões de janela incorrectas devido a peculiaridades no processamento DOM ou no ambiente gráfico. Estas anomalias podem ser utilizadas para detetar dispositivos espúrios. ###### Métodos de falsificação de tamanhos de janela Os autores de fraudes utilizam as seguintes abordagens para se disfarçarem: 1. **Dimensões fictícias:** alteração dos valores window.innerWidth e window.innerHeight através de ferramentas de programação ou plugins. 2. **Utilização de definições predefinidas:** emular as dimensões de dispositivos populares para evitar suspeitas. 3. **Falsificação de cabeçalhos HTTP:** alteração dos valores Viewport-Width e Device-Width. ###### Métodos de deteção de spoofing **1. Testar o tamanho das janelas** Um sistema antifraude pode criar scripts que exijam o redimensionamento da janela (por exemplo, pop-ups). Os navegadores falsificados podem não responder adequadamente a esses pedidos. **2. Verificar a correspondência de tamanhos** A comparação dos dados do DOM (por exemplo, window.innerWidth) com os dados dos cabeçalhos HTTP ajuda a detetar incompatibilidades. **Análise do comportamento do utilizador** As alterações do tamanho da janela durante a interação com o sítio podem ser invulgarmente suaves ou, pelo contrário, demasiado bruscas no caso da emulação. Vejamos exemplos dos tamanhos que os sistemas antifraude podem receber do browser de um utilizador. Vamos abrir a página browserleaks.com/javascript no navegador Chrome.  Nesta página, o site determina o tamanho do monitor, a orientação e o ângulo do ecrã, as dimensões exteriores e interiores da janela do browser. Vamos perceber melhor quais os tamanhos e valores que os recursos podem obter. Vamos abrir a nossa página de teste test-webapi.tech/screen  A página de teste apresenta os seguintes parâmetros: **Tipo de orientação** Indica a orientação atual do ecrã do dispositivo (por exemplo, retrato-primário, paisagem-primário). **Ângulo de orientação** Ângulo de rotação do ecrã em relação à sua orientação natural, em graus. **Largura disponível** A largura do ecrã disponível para utilização (excluindo elementos do sistema, como a barra de tarefas). **Largura exterior** A largura total da janela do browser, incluindo as áreas fora da página visível, como as barras de deslocamento e as molduras. **Largura do ecrã** A largura total do ecrã do dispositivo em pixels. **Largura interior** A largura da área de conteúdo visível da janela do browser (excluindo barras de deslocação e molduras). **Altura disponível** A altura do ecrã disponível para utilização (excluindo elementos do sistema, como a barra de tarefas). **Altura exterior** A altura total da janela do browser, incluindo as áreas fora da página visível, como as barras de deslocamento e as molduras. **Altura do ecrã** A altura total do ecrã do dispositivo em pixels. **Altura interior** A altura da área de conteúdo visível da janela do browser (excluindo barras de deslocação e molduras). **Esquerda disponível** A posição horizontal da área de ecrã disponível em relação ao início do ecrã (normalmente 0). **Topo disponível** A posição vertical da área de ecrã disponível em relação ao início do ecrã (normalmente 0). **Máximo de pontos de toque** O número máximo de pontos de toque suportados pelo dispositivo. **Profundidade da cor** O número de bits utilizados para representar a cor de um único pixel do ecrã. Por exemplo, 24 ou 32. **Profundidade do pixel** A profundidade do pixel em bits, normalmente igual ao valor da profundidade da cor. **Rácio de pixéis do dispositivo** A relação entre os pixéis físicos do dispositivo e os pixéis lógicos. Por exemplo, 1,0 para ecrãs padrão ou 2,0 para ecrãs Retina. **Largura do cliente** A largura da área de conteúdo dentro do elemento html sem barras de rolagem. **Altura do cliente** A altura da área de conteúdo dentro do elemento html sem barras de rolagem. **X do ecrã** A posição horizontal do canto superior esquerdo da janela do browser em relação ao ecrã do dispositivo, em pixels. **Ecrã Y** Posição vertical do canto superior esquerdo da janela do browser em relação ao ecrã do dispositivo, em pixels. **Largura do ecrã** A largura total do conteúdo da página, incluindo as áreas ocultas que podem ser deslocadas. **Altura do deslocamento** A altura total do conteúdo da página, incluindo as áreas ocultas que podem ser deslocadas. **Largura da janela de visualização visual** Largura da área apresentada ao utilizador, incluindo possíveis redimensionamentos. **Altura da janela de visualização visual** Altura da área apresentada ao utilizador, incluindo a escala possível. **Deslocação X** O deslocamento horizontal da página desde o início, em pixéis. **Deslocamento Y** Deslocamento vertical da página desde o início, em pixéis. **Diferença de altura (exterior - interior)** A diferença entre a altura total da janela do browser e a altura visível do conteúdo. Apresentado para determinar o tamanho do painel administrativo do browser. Entre os parâmetros apresentados, existem parâmetros que raramente são alterados dentro de um perfil, por exemplo: Tipo de orientação, Tamanho do ecrã, Profundidade da cor, Profundidade do pixel, Máximo de pontos de toque, existem parâmetros que só podem ser alterados em determinados tipos de dispositivos, por exemplo: Ângulo de orientação, Ecrã X, Ecrã Y. Comparemos os dados obtidos com o navegador Chrome e o navegador anti-deteção:  Para a versão desktop, o navegador anti-deteção troca bastante bem os parâmetros de tamanho do ecrã e do navegador, mas os valores de Screen X e Screen Y são 0, o que corresponde ao facto de o nosso navegador estar ancorado no canto superior esquerdo do ecrã e esta é a localização que obteremos no navegador anti-deteção, sempre que abrirmos o perfil, enquanto que, por predefinição, uma nova janela do verdadeiro navegador Chrome abre no centro do ecrã. É de salientar que obteremos o mesmo tamanho de navegador sempre que utilizarmos o perfil, enquanto um utilizador normal altera frequentemente o tamanho de uma janela do navegador aberta em ecrã não completo. Prestemos atenção ao valor da Diferença de altura, no navegador Chrome que ocupa parte do ecrã a altura do painel administrativo é de 95px, verifiquemos este valor no navegador Chrome com o painel de favoritos:  A altura do painel administrativo, neste caso, é de 129px. Desta forma, o recurso pode determinar com precisão a visibilidade do painel de favoritos no browser do utilizador. Vamos abrir a nossa página de teste no browser Firefox:  No navegador Firefox, a altura do painel administrativo é de 91px, pelo que os sistemas antifraude podem determinar se o navegador declarado pelo utilizador no User-Agent corresponde ou não às dimensões padrão do navegador original. É importante notar que o tamanho do painel administrativo nos navegadores de ecrã completo é diferente do tamanho do navegador que ocupa parte do ecrã do utilizador. Vamos repetir o teste num dispositivo móvel e num browser anti-deteção que tenta apresentar-se como um dispositivo móvel:  O navegador anti-deteção define o valor da altura interior igual à altura exterior, enquanto que num navegador móvel real o valor da altura interior é superior ao valor da altura exterior, e esta substituição pode ser um fator de disparo para os sistemas antifraude. Note-se também que o valor do deslocamento vertical da página, no modo testado do navegador anti-deteção, é efectuado apenas por valores inteiros de pixéis (parâmetro Scroll Y). ###### Eventos de ação do browser e o seu papel nos sistemas antifraude As aplicações Web modernas utilizam ativamente os eventos do navegador para melhorar a interação com o utilizador. No entanto, acções como cliques, deslocações e eventos de toque também fornecem dados únicos que podem ser utilizados por sistemas antifraude para detetar actividades suspeitas. Estes sistemas analisam o comportamento do utilizador para detetar bots, emulação de acções ou falsificação de dados. ###### Eventos básicos de ação do browser Os eventos do navegador incluem uma vasta gama de interações que um utilizador pode realizar numa página Web. As mais importantes são: - **Clicks (click, dblclick):** capturam os cliques do botão do rato nos elementos da página. - **Scroll:** regista a deslocação da área visível da página. - **Mouseover (mouseout, mouseout, mousemove):** regista o movimento do cursor. - **Eventos de toque (touchstart, touchmove, touchend):** regista acções em dispositivos com ecrã tátil. - **Entrada de texto (keydown, keyup, input):** regista acções do utilizador baseadas em texto. - **Foco (focus, blur):** determina se os elementos de entrada estão activados ou desactivados. - **Respostas a alterações (redimensionamento, alteração de orientação):** detectam alterações no tamanho da janela do browser ou na orientação do dispositivo. ###### Papel dos eventos nos sistemas antifraude Os sistemas antifraude utilizam eventos para analisar o comportamento real dos utilizadores e compará-lo com os cenários esperados. Os principais aspectos da análise são: **1. Velocidade e ritmo das acções** Os bots imitam frequentemente as acções dos utilizadores, mas podem apresentar um ritmo não natural, como clicar ou deslocar-se demasiado depressa. No caso da deslocação, os utilizadores reais tendem a mover a página a diferentes velocidades, enquanto os bots podem utilizar movimentos lineares. **2. Caracterização dos eventos de toque** ◦ Os eventos tácteis reais têm coordenadas tácteis únicas e podem conter dados de força (se o dispositivo suportar tais sensores). ◦ Os eventos tácteis emulados são frequentemente capturados como um valor fixo ou um padrão de coordenadas. **3. Comportamento não natural** ◦ Os sistemas antifraude seguem comportamentos repetitivos, como o mesmo tempo entre cliques ou o mesmo ângulo de deslocação. A imobilidade do cursor durante longos períodos de tempo também pode ser um sinal de automatização. ###### Técnicas de falsificação de eventos Os atacantes podem utilizar várias abordagens para emular eventos: **1. Scripts automatizados**. Utilização de bibliotecas de automatização, como Puppeteer ou Selenium, para criar eventos artificiais (por exemplo, document.dispatchEvent). **2. Simulação de eventos de toque** As ferramentas para programadores permitem-lhe executar toques simulados em dispositivos inexistentes. **3. Substituição de dados de eventos** Alteração das propriedades do evento, como coordenadas ou tempo de execução, para ocultar a automatização. ###### Métodos de deteção de falsificação Os sistemas antifraude utilizam diferentes abordagens para detetar a falsificação: **1. Análise de carimbos de data/hora** Comparação dos registos de data e hora dos eventos com o tempo real: os eventos artificiais podem apresentar velocidades irrealistas. **2. Verificação de coordenadas** Os sistemas analisam a distribuição das coordenadas dos cliques ou dos eventos de toque. Padrões suspeitos (por exemplo, concentração num só local) podem indicar falsificação. **Utilização de captcha** Os testes interactivos exigem acções que são difíceis de emular (por exemplo, arrastar e largar itens). **4. Comparação de dados do browser** Os parâmetros do evento (por exemplo, dados do ponto de contacto ou de deslocamento) são comparados com os dados do dispositivo para identificar inconsistências. Exemplos: Vamos abrir a página de teste test-webapi.tech/touch no navegador Chrome e inserir texto na caixa de entrada de texto:  Vamos clicar no botão:  Note que as coordenadas de movimento do rato e o evento de clicar no botão e clicar no campo de entrada antes de escrever o texto são registados, correspondendo estes valores às coordenadas de movimento do rato. Os eventos de deslocação da página também são registados  Para os sistemas antifraude, parecerá suspeito clicar num botão se, antes do clique, o rato não se tiver deslocado para as coordenadas do botão na página, ou fechar um separador no browser sem deslocar o rato para a barra do browser. Vamos verificar os eventos num dispositivo móvel e num browser anti-deteção com um browser móvel simulado. Vamos comparar os eventos de introdução de texto no campo:  Neste exemplo, podemos ver diferenças significativas: 1. o evento Touch é executado em coordenadas inteiras no browser anti-deteção. 2. O raio do evento Toque no browser anti-deteção é de 11,5 px, que é mais de 10 vezes superior ao do dispositivo móvel real. 3. No navegador anti-deteção, a parte visível do ecrã não é reduzida e não simula o aparecimento de um teclado virtual no ecrã do dispositivo, ao contrário do dispositivo real. Note-se que o tamanho da parte visível do ecrã nos dispositivos móveis muda não só quando o teclado aparece no ecrã do dispositivo, mas também noutros eventos, por exemplo, quando se desloca a página para baixo, a barra de endereço na versão móvel do navegador é ocultada e o tamanho da parte visível do ecrã aumenta. Comparemos os eventos quando se desloca a página para baixo:  Neste teste, podemos ver que o registo das acções de deslocamento da página no browser anti-deteção é diferente do registo no dispositivo móvel. Para além de vermos apenas valores de coordenadas inteiras, também obtemos um registo de evento de toque após cada vez que a página se move para baixo num pequeno valor de pixel. Hoje em dia, muitos sistemas antifraude registam eventos no navegador. Se abrirmos o site da Amazon, podemos ver que este site regista um grande número de eventos, tais como: tempo de carregamento da página, redimensionamento da página, acções do utilizador na página.  #### Saída Os eventos de ação do navegador e os valores dos tamanhos do ecrã do utilizador e do navegador fornecem um grande conjunto de dados para os sistemas antifraude. A análise do tamanho do navegador pode identificar os utilizadores de forma exclusiva, enquanto a análise do comportamento do utilizador pode detetar bots, emulação ou outras tentativas de fraude. Para melhorar a precisão, esses sistemas utilizam abordagens combinadas, comparando dados de eventos com caraterísticas do dispositivo e cenários esperados. *Bannykh M.V.*