CodeKitHub
Kodningsverktyg

URL-kodare/avkodare online

Senast uppdaterad:

Procentkoda text för säker användning i URL:er, eller avkoda en kodad URL tillbaka till läsbar form. Välj komponentläge (kodar allt, för värden i frågeparametrar) eller hel-URL-läge (behåller strukturen med :// ? &). Körs helt i din webbläsare.

Vad är detta verktyg?

URL-kodning (procentkodning) ersätter tecken som inte är tillåtna i URL:er med ett % följt av deras bytevärde i hex — ett mellanslag blir %20, och 你 blir %E4%BD%A0. Utan detta skulle tecken som mellanslag, &, ? och icke-ASCII-text bryta URL-strukturen eller feltolkas av servrar.

Det finns två vanliga behov, och det här verktyget stöder båda: koda ett värde som går in i en frågeparameter (komponentläge — kodar även / ? & =), och koda en hel URL samtidigt som strukturen behålls (hel-URL-läge — lämnar :// ? & orörda).

En historisk egenhet värd att känna till: ett mellanslag är enligt URL-standarden (RFC 3986) egentligen %20, men HTML-formulärsinlämningar har traditionellt kodat det som ett plustecken istället — vilket är varför du ser både q=hej%20världen och q=hej+världen i det vilda, och varför avkodning av formulärdata ibland behöver hantera + separat.

Varför använda det?

  • Bygg frågesträngar säkert — användarinmatning med &, = eller mellanslag bryter inte din URL.
  • Avkoda långa kodade URL:er från loggar, analys eller omdirigeringskedjor för att se vad de faktiskt säger.
  • Korrekt UTF-8-hantering för kinesiska, emoji och annan icke-ASCII-text.
  • Två lägen så att du inte av misstag kodar : och / i en hel URL.
  • Gratis, direkt, ingen uppladdning.

Så använder du det

  1. Klistra in din text eller URL i inmatningsrutan.
  2. Välj läge: "Komponent" för värden som går in i frågeparametrar, "Hel URL" för hela URL:er.
  3. Klicka på "Koda" eller "Avkoda".
  4. Kopiera resultatet.

Exempel

Inmatning

https://exempel.se/sok?q=hej världen & 你好

Resultat

Komponentläge: https%3A%2F%2Fexempel.se%2Fsok%3Fq%3Dhej%20v%C3%A4rlden%20%26%20%E4%BD%A0%E5%A5%BD
Hel-URL-läge:  https://exempel.se/sok?q=hej%20v%C3%A4rlden%20&%20%E4%BD%A0%E5%A5%BD

Komponentläge kodar även strukturtecken; hel-URL-läge behåller dem.

Vanliga användningsområden

  • Bygga en delbar URL där en söktermin eller ett filtervärde kommer från användarinmatning och kan innehålla mellanslag, & eller andra specialtecken.
  • Avkoda en lång spårnings- eller omdirigerings-URL från ett mejl eller en annonskampanj för att se den faktiska destinationen och parametrarna innan du klickar på den.
  • Felsöka varför en frågeparameter inte läses korrekt av en server — ofta är boven ett reserverat tecken som borde ha kodats men inte gjorde det.
  • Förbereda ett icke-engelskt värde (kinesiska, japanska, arabiska, etc.) för användning i en URL-frågesträng.

encodeURIComponent kontra encodeURI, i praktiken

Dessa mappar direkt till det här verktygets två lägen och motsvarar riktiga JavaScript-funktioner som utvecklare redan känner till: encodeURIComponent (komponentläge) kodar allt utom en liten uppsättning oreserverade tecken, vilket gör det säkert för alla enskilda värden som infogas i en URL — det här är vad du använder för en frågeparameter, ett sökvägssegment eller ett hash-fragmentvärde. encodeURI (hel-URL-läge) lämnar URL:ens strukturtecken (:, /, ?, #, &, =) orörda eftersom det förutsätter att du kodar en hel, redan strukturerad URL, inte ett enskilt råvärde — att använda det på ett enda parametervärde skulle misslyckas med att koda de & eller = tecken det värdet kan innehålla, vilket är det vanligaste misstaget folk gör när de väljer fel läge.

Reserverade kontra oreserverade tecken

URL-specifikationen (RFC 3986) delar in tecken i två grupper: oreserverade tecken (bokstäver, siffror, - _ . ~) är alltid säkra och kodas aldrig, medan reserverade tecken (: / ? # [ ] @ ! $ & ' ( ) * + , ; =) har särskild betydelse i URL-strukturen och behöver bara kodas när de förekommer som bokstavlig data snarare än strukturellt skiljetecken. Det är exakt därför de två lägena finns — komponentläge behandlar reserverade tecken som data att skydda, hel-URL-läge behandlar dem som struktur att bevara. Att förstå den här distinktionen är mer användbart än att memorera när man ska använda vilket läge, eftersom det förklarar varför samma tecken (som &) ibland kodas och ibland lämnas orört beroende på vilken roll det spelar i den specifika URL:en.

Vanliga frågor

När ska jag använda komponentläge kontra hel-URL-läge?

Komponentläge (encodeURIComponent) när du kodar ett enskilt värde som går in i en frågeparameter — det kodar /, ?, & och = så att de inte kan bryta URL:en. Hel-URL-läge (encodeURI) när du kodar en komplett URL — det behåller strukturtecknen så att URL:en fortfarande fungerar.

Varför visades %20 istället för + för mellanslag?

Båda är giltiga i olika sammanhang. %20 är den universella procentkodningen för ett mellanslag; + betyder mellanslag bara inuti frågesträngar som använder det äldre application/x-www-form-urlencoded-formatet. Det här verktyget använder %20, som fungerar överallt.

Varför misslyckas avkodningen med ett fel?

Inmatningen innehåller en felaktig procentsekvens, som ett % som inte följs av två hexsiffror. Detta händer ofta när en URL blivit avkortad eller dubbelt avkodad. Fixa eller ta bort den trasiga %-sekvensen.

Vad är dubbelkodning?

Att koda redan kodad text: %20 blir %2520 eftersom % i sig kodas till %25. Det är en vanlig bugg — om din avkodade utdata fortfarande innehåller %-koder, avkoda den en gång till.

Hanterar det här kinesiska tecken och emoji?

Ja. Text kodas som UTF-8-byte, så 你好 blir %E4%BD%A0%E5%A5%BD och avkodas tillbaka perfekt — samma beteende webbläsare använder.

Relaterade verktyg