URL Parser & Builder
Understand URL Parser & Builder
Divide uma URL em protocolo, host, porta, caminho, parâmetros de query e fragmento, e remonta uma URL válida a partir dessas partes.
How it works
O parsing usa a API URL do WHATWG embutida no navegador, e não uma expressão regular, então ele aplica a mesma normalização da barra de endereços: coloca esquema e host em minúsculas, resolve e remove as portas padrão (https://example.com:443 vira https://example.com), converte domínios internacionalizados para punycode e faz percent-encoding do que precisa ser codificado. Os parâmetros de query são lidos por URLSearchParams, que decodifica cada chave e valor e trata "+" em uma query string como espaço. Remontar uma URL a partir das partes recodifica automaticamente, e essa é a razão para usar isto em vez de concatenar strings.
When to use it
- Desmontar um callback OAuth longo ou uma URL de rastreamento para ver exatamente quais parâmetros existem e para o que eles decodificam
- Verificar se um destino de redirecionamento em que você está prestes a confiar aponta para o host que você imagina — o hostname interpretado é o campo a comparar, não um trecho da URL inteira
- Montar uma URL com valores de query fornecidos pelo usuário sem codificar à mão E comerciais, espaços e barras
- Confirmar que um segmento de caminho percent-encoded (%2F contra /) sobrevive do jeito que o seu roteador espera
Watch out for
- Chaves de query repetidas se fundem. `?tag=a&tag=b` é legal e comum, mas uma visão simples de chave/valor guarda só o último valor — use `searchParams.getAll("tag")` no código quando as duplicatas importarem.
- O fragmento depois do `#` nunca é enviado ao servidor. Ele existe só no navegador, e é por isso que colocar um token ali o esconde dos logs do servidor, mas não de nenhum script da página.
- Só URLs absolutas são interpretadas. Um caminho relativo como `/v2/users` não tem esquema nem host e precisa de uma URL base antes de poder ser interpretado.
- Credenciais embutidas como `https://user:pass@host/` também são interpretadas, e elas vão aparecer em cabeçalhos Referer, no histórico do navegador e em logs de proxy. Vê-las aqui é motivo para removê-las, não para mantê-las.
Frequently Asked Questions
Como extrair os parâmetros de query de uma URL?
Cole a URL. A ferramenta divide a query string (tudo depois do ?) em pares chave=valor individuais. Por exemplo, ?page=2&sort=date&order=asc vira três parâmetros: page=2, sort=date, order=asc, cada um decodificado de URL automaticamente.
Para que serve o fragmento (#hash) da URL?
O fragmento (tudo depois do #) NÃO é enviado ao servidor — ele existe só no navegador. Ele rola até o elemento com aquele ID (id="section-2"), aciona o roteamento no cliente em SPAs (React Router, Vue Router) ou carrega estado em fluxos OAuth (access_token em concessões implícitas).
Como montar uma URL com parâmetros de query programaticamente?
Use a API URLSearchParams no JavaScript: const params = new URLSearchParams({page: 2, sort: 'date'}); url.search = params.toString(). Isso codifica os caracteres especiais corretamente de forma automática — evite concatenação manual de strings.
How to Use URL Parser & Builder
- Paste or type your input in the input area above.
- The tool processes your input automatically or click Run.
- Copy or download the result using the action buttons.
- Use Ctrl+Enter to run quickly from the keyboard.