Analisador de User Agent: Decodifique Informações de Navegador e Dispositivo

· 12 min de leitura

Índice

Entendendo User Agents

Toda vez que você visita um site, seu navegador envia um pequeno pedaço de texto chamado "string de user agent". Esta string pinta uma imagem do seu navegador, sistema operacional e sua versão. Não é apenas um texto aleatório sem sentido—cada parte da string tem seu trabalho.

Imagine ser um aplicativo web. Você gostaria de saber se o visitante usa Chrome ou Safari, certo? Isso ajuda os sites a apresentar conteúdo de uma forma que corresponda às capacidades do navegador. Por exemplo, um site pode desabilitar animações para navegadores que não as suportam bem, melhorando o desempenho e a experiência do usuário.

Outra peça vital é o sistema operacional. Sites podem oferecer funcionalidades diferentes com base em se estão lidando com usuários Windows ou Mac. Por exemplo, se um recurso é compatível apenas com a versão mais recente do MacOS, conhecer o sistema operacional pode ajudar um site a solucionar problemas ou notificar o usuário diretamente sobre possíveis incompatibilidades.

Entender o tipo de dispositivo do usuário—como um telefone ou tablet—é como ler o ambiente antes de fazer um discurso. É uma chave essencial para adaptar sua abordagem de forma eficaz. Usuários móveis esperam interações diferentes dos usuários de desktop, e decisões de design responsivo frequentemente dependem de detecção precisa de dispositivo.

Dica rápida: Strings de user agent são enviadas automaticamente com cada requisição HTTP no cabeçalho User-Agent. Você não precisa fazer nada especial para acessá-las—elas já estão lá nos seus logs de servidor e ferramentas de análise.

O que é um Analisador de User Agent?

Entre o analisador de user agent. Ele pega essa string e faz sentido dela para você. Pense nele como um anel decodificador para descobrir qual navegador e dispositivo alguém está usando.

Isso não é apenas coisa técnica de nerds. É super útil para análises, personalização de experiências de usuário e correção de erros. Considere que 72% dos usuários de internet abandonarão um site completamente se ele não parecer bom em seu dispositivo. É aí que conhecer o dispositivo do seu usuário se torna crucial.

Um analisador de user agent pega uma string bruta como esta:

Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/121.0.0.0 Safari/537.36

E a transforma em dados estruturados e acionáveis:

O analisador faz o trabalho pesado de correspondência de padrões, extração de versão e classificação de dispositivos. Sem ele, você ficaria preso escrevendo expressões regulares complexas e mantendo listas intermináveis de assinaturas de navegadores—um pesadelo que nenhum desenvolvedor quer enfrentar.

Por que a Análise de User Agent Importa

Aqui está por que desenvolvedores e empresas dependem da análise de user agent:

Anatomia de uma String de User Agent

Strings de user agent seguem um formato semi-padronizado, embora tenham se tornado cada vez mais complexas ao longo dos anos. Vamos detalhar os componentes que você normalmente encontrará.

A Estrutura Básica

A maioria das strings de user agent contém estes elementos:

  1. Token de Produto: Geralmente começa com "Mozilla/5.0" por razões históricas
  2. Informações de Plataforma: Detalhes do sistema operacional e arquitetura entre parênteses
  3. Informações do Motor: O motor de renderização (como WebKit ou Gecko)
  4. Informações do Navegador: O nome e versão real do navegador

Aqui está um exemplo do mundo real dissecado:

Mozilla/5.0 (iPhone; CPU iPhone OS 17_2 like Mac OS X) AppleWebKit/605.1.15 (KHTML, like Gecko) Version/17.2 Mobile/15E148 Safari/604.1
Componente Valor Significado
Produto Mozilla/5.0 Token de compatibilidade legado
Plataforma iPhone; CPU iPhone OS 17_2 Dispositivo é iPhone executando iOS 17.2
Motor AppleWebKit/605.1.15 Versão do motor de renderização WebKit
Navegador Safari/604.1 Versão do navegador Safari

Padrões Comuns Entre Navegadores

Diferentes navegadores têm suas próprias peculiaridades em como formatam strings de user agent. Aqui estão alguns exemplos:

Chrome no Windows:

Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/121.0.0.0 Safari/537.36

Firefox no macOS:

Mozilla/5.0 (Macintosh; Intel Mac OS X 10.15; rv:122.0) Gecko/20100101 Firefox/122.0

Edge no Windows:

Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/121.0.0.0 Safari/537.36 Edg/121.0.0.0

Percebe como Chrome e Edge parecem quase idênticos? Isso é porque o Edge agora é construído sobre Chromium. A única diferença é o token "Edg" no final.

Dica profissional: O prefixo "Mozilla/5.0" existe por razões de compatibilidade histórica. Nos primeiros dias da web, servidores bloqueavam navegadores que não fossem Netscape, então outros navegadores começaram a fingir ser Mozilla para evitar discriminação. Este legado persiste hoje.

Como Decodificar Strings de User Agent

Decodificar strings de user agent manualmente é tedioso e propenso a erros. É por isso que usar um analisador ou ferramenta dedicada é a abordagem inteligente. Vamos explorar métodos manuais e automatizados.

Análise Manual (Não Recomendado)

Você poderia escrever expressões regulares para extrair informações, mas essa abordagem tem sérias desvantagens:

Aqui está um exemplo simples de como a análise manual pode parecer em JavaScript:

const userAgent = navigator.userAgent;

// Detectar navegador (muito simplificado)
let browser = 'Unknown';
if (userAgent.includes('Firefox')) browser = 'Firefox';
else if (userAgent.includes('Edg')) browser = 'Edge';
else if (userAgent.includes('Chrome')) browser = 'Chrome';
else if (userAgent.includes('Safari')) browser = 'Safari';

// Detectar SO (muito simplificado)
let os = 'Unknown';
if (userAgent.includes('Windows')) os = 'Windows';
else if (userAgent.includes('Mac')) os = 'macOS';
else if (userAgent.includes('Linux')) os = 'Linux';
else if (userAgent.includes('Android')) os = 'Android';
else if (userAgent.includes('iOS')) os = 'iOS';

Este código é frágil e perde inúmeros casos extremos. Não use isso em produção.

Usando uma Ferramenta de Analisador de User Agent

A melhor abordagem é usar um analisador dedicado. Nossa ferramenta Analisador de User Agent fornece análise instantânea e precisa sem necessidade de codificação.

Simplesmente cole uma string de user agent e obtenha:

Isso é perfeito para análise rápida, depuração ou entender o que seus usuários estão realmente usando para acessar seu site.

Usando Bibliotecas de Análise

Para análise programática em suas aplicações, existem várias bibliotecas excelentes:

JavaScript/Node.js:

Python:

PHP:

Implementando Análise de User Agent

Vamos ver exemplos práticos de implementação em diferentes linguagens de programação e frameworks.

Implementação em JavaScript

Usando a popular biblioteca ua-parser-js:

import UAParser from 'ua-parser-js';

const parser = new UAParser();
const userAgent = 'Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36...';

parser.setUA(userAgent);

const result = parser.getResult();

console.log(result.browser.name);    // "Chrome"
console.log(result.browser.version); // "121.0.0.0"
console.log(result.os.name);         // "Windows"
console.log(result.os.version);      // "10"
console.log(result.device.type);     // undefined (desktop)

Em uma aplicação web, você pode acessar o agent do usuário atual diretamente:

const parser = new UAParser(navigator.userAgent);
const result = parser.getResult();

// Personalizar experiência com base no dispositivo
if (result.device.type === 'mobile') {
  // Carregar recursos otimizados para móvel
  loadMobileUI();
} else {
  // Carregar experiência desktop
  loadDesktopUI();
}

Implementação Server-Side (Node.js/Express)

Analisar user agents de requisições recebidas:

import express from 'express';
import UAParser from 'ua-parser-js';

const app = express();

app.get('/api/device-info', (req, res) => {
  const parser = new UAParser(req.headers['user-agent']);
  const result = parser.getResult();
  
  res.json({
    browser: result.browser,
    os: result.os,
    device: result.device
  });
});

// Middleware para adicionar UA analisado a todas as requisições
app.use((req, res, next) => {
  req.userAgent = new UAParser(req.headers['user-agent']).getResult();
  next();
});

Implementação em Python

Usando a biblioteca user-agents:

from user_agents import parse

user_agent_string = 'Mozilla/5.0 (iPhone; CPU iPhone OS 17_2 like Mac OS X)...'
user_agent = parse(user_agent_string)

print(user_agent.browser.family)  # "Mobile Safari"
print(user_agent.browser.version_string)  # "17.2"
print(user_agent.os.family)  # "iOS"
print(user_agent.os.version_string)  # "17.2"
print(user_agent.is_mobile)  # True
print(user_agent.is_tablet)  # False
print(user_agent.is_pc)  # False

Implementação em PHP

Usando WhichBrowser/Parser:

<?php
require 'vendor/autoload.php';

use WhichBrowser\Parser;

$userAgent = $_SERVER['HTTP_USER_AGENT'];
$result = new Parser($userAgent);

echo $result->browser->name;     // "Chrome"
echo $result->browser->version;  // "121.0"
echo $result->os->name;          // "Windows"
echo $result->os->version;       // "10"
echo $result->device->type;      // "desktop"

if ($result->isMobile()) {
    // Servir conteúdo móvel
}
?>

Dica profissional: Sempre faça cache dos resultados de user agent analisados quando possível. A análise é computacionalmente barata, mas não é gratuita. Em aplicações de alto tráfego, faça cache do resultado analisado para cada string única de user agent para melhorar o desempenho.

📚 You May Also Like

Cron Parser Online: Understand and Visualize Cron Expressions DNS Lookup: Resolve Domain Names to IP Addresses MAC Address Lookup: Find Vendor Information for MAC Addresses SSL Checker: Verify Your SSL Certificate Installation