Codifica / decodifica URL — Percent-encoding e parser di URL

Codifica o decodifica il testo per gli URL con il percent-encoding in modalità componente, URL completo o modulo, e modifica i parametri di query di un URL in una tabella.

encodeURIComponent: per un singolo valore della query o segmento del percorso. Codifica tutto tranne A–Z a–z 0–9 - _ . ! ~ * ' ( ).

Codificato
name%3DZo%C3%AB%20%26%20Tom%20%2F%20caf%C3%A9%3Fid%3D42%23top

Analizzatore di URL ed editor della query string

Protocollohttps:
Hostshop.example.com
Porta8443
Percorso/search/trail%20shoes
Query?q=trail+running&size=10&color=blue%20%26%20green&utm_source=newsletter
Frammento#reviews
Originehttps://shop.example.com:8443
Parametri della query (0): decodificati, modificali liberamente
URL ricostruito
https://shop.example.com:8443/search/trail%20shoes#reviews

Funziona interamente nel tuo browser. Nulla di ciò che inserisci viene inviato a noi o salvato. Sfoglia tutti gli strumenti gratuiti.

Hai trovato un problema o qualcosa che potrebbe andare meglio? Leggiamo ogni messaggio e sistemiamo le cose in fretta.

Questo codificatore e decodificatore URL converte il testo da e verso il percent-encoding, l'escaping in stile %20 che permette a spazi, &, lettere accentate ed emoji di viaggiare in sicurezza dentro un URL. Offre le tre codifiche che gli sviluppatori confondono più spesso: la modalità componente per un singolo valore di query o segmento di percorso (encodeURIComponent), la modalità URL completo che lascia intatta la punteggiatura propria dell'URL (encodeURI) e la modalità modulo, cioè ciò che inviano i moduli HTML e URLSearchParams, con + per lo spazio.

La decodifica è volutamente rigorosa. Dove decodeURIComponent del browser si limita a lanciare "URI malformed", questo strumento ti dice quale sequenza % è rotta e dove, e se i byte non sono UTF-8 valido (un segnale tipico che qualcosa a monte ha usato Latin-1). Sotto il codificatore, il parser di URL divide qualsiasi URL nelle sue parti ed elenca i parametri di query in una tabella modificabile che ricostruisce l'URL mentre lo cambi.

Come si usa

  1. Scegli Codifica o Decodifica, poi la modalità: Componente per un valore da inserire in un URL, URL completo per un intero indirizzo, Modulo per dati application/x-www-form-urlencoded.
  2. Scrivi o incolla il testo. Il risultato si aggiorna mentre scrivi; spunta "Ogni riga separatamente" per un elenco.
  3. Se la decodifica fallisce, leggi il messaggio: indica la posizione e la sequenza rotta.
  4. Per ispezionare o modificare un URL, incollalo nel parser, cambia, aggiungi o rimuovi i parametri di query e copia l'URL ricostruito.

Domande frequenti

Qual è la differenza tra encodeURI ed encodeURIComponent?

encodeURIComponent esegue l'escape di tutto tranne lettere, cifre e - _ . ! ~ * ' ( ), quindi è sicuro per un singolo pezzo di URL, come un valore di query che potrebbe contenere & o =. encodeURI presume che tu gli stia passando un URL intero e lascia intatti i caratteri che strutturano un URL (: / ? # @ & = + $ , ;). Usare encodeURI su un valore è un bug classico: una & dentro il valore lo spezza in due parametri.

Uno spazio deve essere %20 o +?

Sono corretti entrambi, in punti diversi. Nella query string dell'invio di un modulo (application/x-www-form-urlencoded), uno spazio è +, e un più letterale deve essere %2B. Ovunque altrove, compreso il percorso e la maggior parte delle query string costruite a mano, uno spazio è %20 e + indica un più letterale. Se un server mostra segni più dove dovrebbero esserci spazi, o il contrario, le due parti non sono d'accordo su quale regola si applica.

Perché ottengo l'errore "URI malformed"?

O un segno % non è seguito da due cifre esadecimali (per esempio "100%" o "%zz"), oppure i byte formano UTF-8 non valido, come %E9 da solo, che è é in Latin-1 ma non in UTF-8. Un segno di percentuale letterale va scritto %25. Questo strumento indica la posizione esatta così puoi capire di quale caso si tratta.

Quali caratteri vanno codificati in un URL?

L'RFC 3986 consente solo a lettere, cifre e - . _ ~ di comparire non codificati ovunque. I caratteri riservati (: / ? # [ ] @ ! $ & ' ( ) * + , ; =) vanno codificati quando compaiono all'interno di un valore e non come struttura. Tutto il resto, compresi spazi, virgolette, < >, lettere non ASCII ed emoji, va sempre codificato, come byte UTF-8 del carattere.

La codifica URL è una forma di cifratura?

No. Il percent-encoding è uno schema di escaping reversibile senza chiave; chiunque può decodificarlo all'istante. Non affidarti mai a esso per nascondere un token o dati personali in un URL. Ricorda anche che gli URL finiscono nella cronologia del browser, nei log dei server e negli header Referer, quindi i segreti non devono proprio stare nelle query string.

Riferimento di codifica: cosa lascia intatto ogni modalità

• Componente (encodeURIComponent): lascia A–Z a–z 0–9 - _ . ! ~ * ' ( ). Da usare per valori di query, segmenti di percorso e tutto ciò che si costruisce per concatenazione.

• URL completo (encodeURI): lascia anche ; , / ? : @ & = + $ #. Da usare solo per ripulire un URL completo che contiene spazi o caratteri non ASCII.

• Modulo (application/x-www-form-urlencoded): lascia A–Z a–z 0–9 * - . _ e trasforma gli spazi in +. È ciò che producono URLSearchParams.toString() e i moduli HTML.

• Insieme non riservato dell'RFC 3986: A–Z a–z 0–9 - . _ ~. L'interpretazione più rigorosa; codificare anche ! ' ( ) * è sempre sicuro.

I caratteri non ASCII vengono sempre codificati come byte UTF-8: é è %C3%A9, e l'emoji 🌲 è di quattro byte, %F0%9F%8C%B2.

Doppia codifica e altri bug comuni

La doppia codifica avviene quando una stringa già codificata viene codificata di nuovo: %20 diventa %2520, perché il % stesso viene trasformato in %25. Se in un URL vedi %25 seguito da due cifre esadecimali, qualcosa è stato codificato due volte. Decodifica una volta e verifica se il risultato contiene ancora sequenze %.

L'errore opposto è costruire un URL concatenando stringhe senza alcuna codifica. Una ricerca di "fish & chips" invia allora q=fish e un parametro vagante chiamato " chips". Costruire le query string con URLSearchParams, o codificare ogni valore con encodeURIComponent, previene entrambi i problemi.

Infine, decodificare l'input dell'utente e inserirlo poi nell'HTML è il punto di partenza del cross-site scripting riflesso. Decodifica per la visualizzazione solo dopo aver fatto l'escape per l'HTML; il codificatore di entità HTML si occupa di questo passaggio.

Strumenti gratuiti correlati

  • Generatore di link UTM — Crea link di tracciamento UTM puliti e coerenti per sapere esattamente quali campagne ti portano clienti.
  • Codificatore / decodificatore Base64 — Codifica testo o file in Base64, trasforma immagini in data URI con snippet CSS e <img>, e decodifica Base64 in un file con anteprima. Nulla esce dal tuo browser.
  • Codificatore di entità HTML — Esegui l'escape del testo per l'HTML con entità nominali o numeriche, decodifica i riferimenti come &amp; in caratteri e cerca in una tabella di riferimento delle entità.
  • Decoder JWT — Decodifica header e payload di un JWT, leggi la scadenza in parole semplici, verifica firme HS, RS, PS ed ES o firma un nuovo token. Nulla esce dal browser.