URL encoder en decoder

Met deze URL encoder en decoder codeer en decodeer je tekst online terwijl je typt: de tool zet spaties, letters met accenten en symbolen zoals & of ? om in procentgecodeerde reeksen als %20 en zet ze weer terug in leesbare tekst. Het tweede tabblad is een URL-parser. Die splitst elk adres in protocol, host, pad en queryparameters die je kunt bewerken, uitschakelen of ontdoen van trackingtags, en schrijft de correct gecodeerde URL voor je terug. Alles gebeurt in je browser.

URL encoderen en decoderen: zo werkt het

1. Typ of plak tekst in het veld op het tabblad Coderen / Decoderen. Het Resultaat wordt bij elke toetsaanslag bijgewerkt.
2. Kies de Richting. Coderen maakt tekst veilig voor gebruik in een URL, Decoderen zet caf%C3%A9%20au%20lait terug in café au lait. Plak je tekst met reeksen als %20 in het lege veld, dan schakelt de tool zelf over naar Decoderen (met Codeer het liever ga je terug). Plak je gewone tekst die gecodeerd moet worden in de modus Decoderen, dan schakelt hij op dezelfde manier over naar Coderen, met Decodeer het liever.
3. Kies bij het coderen onder Coderen als wat de tekst is (zie de volgende sectie). De standaardkeuze, Parameterwaarde, past bij één querywaarde.
4. Kopiëren zet het resultaat op het klembord. Omwisselen zet het resultaat in het invoerveld en draait de richting om. Zo controleer je snel heen en terug: als je decodeert wat je net hebt gecodeerd, moet je oorspronkelijke tekst terugkomen.

Elk teken dat de tool heeft gewijzigd, is in het resultaat gemarkeerd. Beweeg de muis erover om het teken, het Unicode-codepunt en de bytes te zien, bijvoorbeeld é U+00E9 %C3%A9. Onder de velden zie je het aantal Tekens, UTF-8-bytes en Gecodeerde tekens (of Gedecodeerde tekens). Probeer een voorbeeld laadt de zin Prijs: 50 % korting, crème brûlée & café? Ja!, die 45 tekens heeft maar 49 UTF-8-bytes, omdat elke letter met een accent twee bytes beslaat.

Bij het coderen codeert Elke regel apart iedere regel afzonderlijk en blijven de regeleinden behouden, wat handig is voor een lijst met waarden of links. Zonder die optie wordt ook een regeleinde gecodeerd en wordt het %0A. Is de tekst een URL met parameters, dan biedt de tool Opsplitsen in delen aan, waarmee het adres op het parsertabblad opent.

Een URL-parameter, een hele URL of formuliergegevens coderen

Niet elk teken hoeft overal gecodeerd te worden. Een schuine streep scheidt mappen in een pad, maar is gewone data binnen een parameterwaarde, dus het juiste resultaat hangt af van wat je codeert. Coderen als biedt vier modi:

• Parameterwaarde werkt zoals encodeURIComponent van JavaScript en past bij één querywaarde of padsegment. Het codeert alles behalve letters, cijfers en - _ . ! ~ * ' ( ), zodat een &, =, / of ? in de waarde de URL niet kan breken. Het coderen van café & crème geeft caf%C3%A9%20%26%20cr%C3%A8me, klaar om achter q= te plakken.
• Hele URL is voor een compleet adres dat alleen opgeschoond hoeft te worden. Het codeert spaties, niet-ASCII-tekens, stuurtekens, de backtick en " < > \ ^ { | }, en laat alles staan wat een URL zijn structuur geeft: : / ? # [ ] @ ! $ & ' ( ) * + , ; =. Zo wordt https://example.com/search?q=café au lait&lang=fr dus https://example.com/search?q=caf%C3%A9%20au%20lait&lang=fr. Reeksen die al gecodeerd zijn, blijven zoals ze zijn, en een los % wordt %25. Daarin verschilt het van encodeURI van JavaScript, dat een bestaande %20 verandert in %2520 en de haken van een IPv6-adres zoals http://[2001:db8::1]:8080/ codeert.
• Formuliergegevens volgt het formaat application/x-www-form-urlencoded (in het Engels) dat HTML-formulieren en URLSearchParams produceren. Een spatie wordt +, en alleen letters, cijfers en * - . _ blijven ongecodeerd, dus ! ' ( ) ~ worden ook gecodeerd.
• Strikt RFC 3986 laat alleen de niet-gereserveerde tekens van RFC 3986 (in het Engels) ongecodeerd: letters, cijfers en - . _ ~. OAuth 1.0 (RFC 5849) en AWS Signature Version 4 eisen precies deze vorm, omdat een handtekening alleen klopt als beide kanten ! of * op dezelfde manier coderen.

Dezelfde tekens in elke modus:

Teken	Parameterwaarde	Hele URL	Formuliergegevens	Strikt RFC 3986
spatie	%20	%20	+	%20
&	%26	&	%26	%26
/	%2F	/	%2F	%2F
+	%2B	+	%2B	%2B
~	~	~	%7E	~
!	!	!	%21	%21
*	*	*	*	%2A
é	%C3%A9	%C3%A9	%C3%A9	%C3%A9

Tekst wordt altijd als UTF-8 gecodeerd en de hexadecimale cijfers zijn altijd hoofdletters. Bevat de invoer al reeksen als %20, dan meldt een opmerking dat en biedt de tool Decodeer het liever aan, zodat je de tekst niet per ongeluk twee keer codeert.

Wil je JSON in een queryparameter meegeven, minimaliseer het dan in de JSON-formatter en codeer het als Parameterwaarde: {"id":7,"tags":["a","b"]} wordt %7B%22id%22%3A7%2C%22tags%22%3A%5B%22a%22%2C%22b%22%5D%7D. Het werkt ook andersom: decodeer de parameter hier en formatteer hem daar.

URL decoderen werkt niet: plustekens, %2520 en kapotte reeksen

Decoderen werkt meestal gewoon, maar vier situaties zorgen voor problemen. De tool vangt ze alle vier op in plaats van met een foutmelding te stoppen:

• Een plusteken staat voor een spatie in formuliergegevens en de meeste querystrings. Plusteken decoderen als spatie staat standaard aan, dus caf%C3%A9+au+lait wordt gedecodeerd tot café au lait. In een hele URL tellen alleen de plustekens na het ? als spaties, omdat een plus in een pad een gewoon teken is. Zet de optie uit als een plusteken letterlijk bedoeld is. Een plus die als %2B is gecodeerd, blijft altijd een plusteken.
• Dubbele codering ontstaat wanneer twee softwarelagen dezelfde waarde allebei coderen, iets waartegen RFC 3986 uitdrukkelijk waarschuwt. Elke % wordt %25, waardoor een spatie van %20 verandert in %2520. Bevat het gedecodeerde resultaat nog steeds reeksen als %20, dan meldt de tool dat de tekst waarschijnlijk twee keer is gecodeerd en biedt hij Nogmaals decoderen aan.
• Een ongeldige reeks, een % die niet gevolgd wordt door twee hexadecimale cijfers, zoals in 100% of %G1, laat decodeURIComponent van JavaScript een URIError geven. Hier blijven zulke reeksen ongewijzigd, worden ze rood gemarkeerd en geteld, en wordt de rest van de tekst gedecodeerd.
• Oude Latin-1-links stammen uit de tijd vóór UTF-8, toen sommige sites é codeerden als de enkele byte %E9. caf%E9 is geen geldige UTF-8, dus decodeURIComponent faalt en unquote van Python geeft caf gevolgd door het vervangingsteken U+FFFD. De tool leest zulke bytes als Windows-1252, decodeert caf%E9 tot café en voegt een opmerking toe.

Stuurtekens in gedecodeerde tekst, zoals een tab of een nulbyte, worden getoond als zichtbare symbolen als ␉ en ␀, maar Kopiëren kopieert de echte tekst.

URL-parser: een URL opsplitsen en queryparameters bewerken

Plak een adres in het veld URL op het tabblad URL ontleden en bewerken en het wordt gesplitst in Protocol, Host, Poort, Pad en Fragment, plus Gebruikersnaam en Wachtwoord als de URL die bevat. De waarden worden gedecodeerd getoond, dus het tabblad is ook de snelste manier om URL-parameters te decoderen: je leest geïsoleerde drinkfles in plaats van ge%C3%AFsoleerde+drinkfles. Bewerken werkt in beide richtingen, zoals de adresbalk en de parametertabel in Postman. Wijzig een veld en de URL wordt meteen opnieuw geschreven, correct gecodeerd; wijzig de URL en alle delen worden opnieuw ingelezen. Delen die je niet aanraakt, blijven teken voor teken precies zoals ze waren.

De tabel Queryparameters toont elke parameter met zijn Naam en Waarde. Haal het vinkje bij In de URL opnemen weg om een parameter weg te laten zonder hem te verwijderen, wat helpt als je zoekt naar de ene parameter die een verzoek breekt. Parameter toevoegen, Parameter verwijderen en Sorteren van A tot Z doen wat ze zeggen. Herhaalde namen als tag=a&tag=b en namen zonder waarde als ?debug blijven behouden. Spaties in parameters bepaalt of spaties als %20 of + worden geschreven; standaard volgt dit de URL die je hebt geplakt.

Inlog- en betaallinks bevatten vaak een tweede URL in een parameter, gecodeerd zodat de eigen ? en & niet door de buitenste door elkaar raken:

https://auth.example.com/authorize?client_id=abc&redirect_uri=https%3A%2F%2Fapp.example.com%2Fcallback%3Ftab%3D2

Een waarde die zelf een URL is, meestal in redirect_uri, return, url of next, krijgt een knop Binnenste URL bewerken. Het binnenste adres https://app.example.com/callback?tab=2 opent als eigen niveau met eigen delen en parameters, een kruimelpad (Hoofd-URL › redirect_uri) brengt je terug, en elke wijziging wordt gecodeerd teruggeschreven in de buitenste URL. Hoofd-URL kopiëren kopieert het resultaat. Dit werkt meerdere niveaus diep.

Als het deel na # op parameters lijkt, zoals #access_token=...&state=... in de OAuth implicit flow of #/search?q=shoes in de routes van single-pageapps, toont een tweede tabel, Fragmentparameters, ook die.

De parser wijst ook op problemen: een URL zonder protocol, die browsers als relatieve link behandelen; een poort buiten 0 tot 65535; en tekens die gecodeerd moeten worden, zoals spaties, letters met accenten, " of <, wat Codeer ze in één stap oplost. Tekst zonder adres, zoals a=1&b=2, wordt gelezen als querystring. Voor een internationale domeinnaam toont de tool de Punycode-vorm die DNS en browsers gebruiken, dus münchen.de wordt xn--mnchen-3ya.de, en een domein dat met xn-- begint, krijgt zijn leesbare vorm.

URL kopiëren kopieert het afgewerkte adres, Openen opent het in een nieuw tabblad (alleen http- en https-links) en Kopiëren als JSON geeft je de parameters als JSON-object, waarbij herhaalde namen in een array worden verzameld.

UTM en andere trackingparameters uit een URL verwijderen

Links uit nieuwsbrieven, advertenties en sociale netwerken bevatten parameters die de site alleen vertellen waar de bezoeker vandaan kwam. De UTM-parameters (in het Engels) utm_source, utm_medium, utm_campaign, utm_term en utm_content gaan terug op Urchin, de voorganger van Google Analytics. Klik-ID’s als fbclid (Facebook), gclid (Google Ads) en msclkid (Microsoft Advertising) worden door de platforms zelf toegevoegd.

De parser markeert deze met een tag tracking, en Tracking verwijderen (n) verwijdert ze allemaal tegelijk. Naast elke utm_*-parameter herkent hij meer dan 20 andere, zoals ttclid (TikTok), mc_cid (Mailchimp) en _hsenc (HubSpot). Parameters die de pagina nodig heeft, blijven staan: in de winkellink van Probeer een voorbeeld verwijdert Tracking verwijderen (4) utm_source, utm_medium, utm_campaign en fbclid en blijven q, size, return en het fragment #reviews behouden.

Een link die in een QR-code terechtkomt, kun je hier het best eerst opschonen. Zonder trackingparameters is hij korter, en een kortere link geeft een minder dichte code die makkelijker te scannen is.

Wat procentcodering is en hoe tekens %XX worden

Percent-encoding (in het Engels), ook wel URL-codering of procentcodering genoemd, schrijft een teken als % gevolgd door twee hexadecimale cijfers. Een URL mag maar een beperkte set ASCII-tekens bevatten, en sommige daarvan hebben een taak: ? start de query, & scheidt parameters, # start het fragment. RFC 3986 noemt dit gereserveerde tekens (: / ? # [ ] @ en ! $ & ' ( ) * + , ; =). Letters, cijfers en - . _ ~ zijn niet-gereserveerd en hoeven nooit gecodeerd te worden. Al het andere, en elk gereserveerd teken dat als gewone data wordt gebruikt, wordt gecodeerd.

Tekens buiten ASCII worden eerst omgezet in UTF-8-bytes, en elke byte krijgt zijn eigen %XX:

• é is U+00E9, dat UTF-8 opslaat als de twee bytes C3 A9, dus het wordt %C3%A9.
• € is U+20AC, drie bytes: %E2%82%AC.
• Een emoji als U+1F600 (grijnzend gezicht) beslaat vier bytes: %F0%9F%98%80.

%c3%a9 en %C3%A9 betekenen hetzelfde, maar RFC 3986 beveelt hoofdletters aan, en die schrijft de tool. Een tabel met procentcodering van de tekens die je het vaakst tegenkomt:

Teken	Gecodeerd	Teken	Gecodeerd
spatie	%20	+	%2B
!	%21	,	%2C
"	%22	/	%2F
#	%23	:	%3A
$	%24	;	%3B
%	%25	=	%3D
&	%26	?	%3F
'	%27	@	%40
(	%28	[	%5B
)	%29	]	%5D
*	%2A	regeleinde	%0A

URL-codering in JavaScript, Python en PHP

Elke taal heeft hiervoor functies, en ze verschillen vooral in hoe ze spaties, schuine strepen en ! ' ( ) * ~ behandelen.

JavaScript heeft encodeURIComponent (in het Engels) voor een waarde, encodeURI voor een heel adres en URLSearchParams voor formuliercodering:

encodeURIComponent("café & crème")                     // "caf%C3%A9%20%26%20cr%C3%A8me"
encodeURI("https://example.com/a b?q=café")            // "https://example.com/a%20b?q=caf%C3%A9"
new URLSearchParams({ q: "café & crème" }).toString()  // "q=caf%C3%A9+%26+cr%C3%A8me"
decodeURIComponent("caf%C3%A9")                        // "café"

decodeURIComponent zet + niet om in een spatie en geeft een URIError bij een ongeldige reeks zoals 100%.

In Python staan de functies in urllib.parse. quote laat standaard / staan (safe='/') en codeert verder alles behalve de niet-gereserveerde tekens van RFC 3986. quote_plus schrijft spaties als + en codeert ook /:

from urllib.parse import quote, quote_plus, urlencode, unquote_plus

quote("café & crème/brûlée")       # 'caf%C3%A9%20%26%20cr%C3%A8me/br%C3%BBl%C3%A9e'
quote("a b/c", safe="")            # 'a%20b%2Fc'
quote_plus("café & crème/brûlée")  # 'caf%C3%A9+%26+cr%C3%A8me%2Fbr%C3%BBl%C3%A9e'
urlencode({"q": "café & crème", "page": 2})  # 'q=caf%C3%A9+%26+cr%C3%A8me&page=2'
unquote_plus("caf%C3%A9+au+lait")  # 'café au lait'

In PHP codeert urlencode zoals een HTML-formulier en schrijft het een spatie als +, terwijl rawurlencode RFC 3986 volgt en %20 schrijft:

urlencode("café & crème");     // "caf%C3%A9+%26+cr%C3%A8me"
rawurlencode("café & crème");  // "caf%C3%A9%20%26%20cr%C3%A8me"

rawurlencode geeft hetzelfde resultaat als Strikt RFC 3986. urlencode komt overeen met Formuliergegevens, behalve voor *, dat het als %2A codeert.

Veelgestelde vragen

Moet een spatie als %20 of + worden gecodeerd?

%20 werkt overal in een URL. Een + betekent alleen een spatie in de querystring en in formuliergegevens, het formaat dat HTML-formulieren versturen. In een pad is + een gewoon plusteken, dus /a+b blijft /a+b. Heeft een querywaarde een echt plusteken nodig, schrijf het dan als %2B. In de tool schrijft Formuliergegevens spaties als + en de andere drie modi als %20.

Wat betekenen %20, %2F en %3D in een URL?

Het zijn gecodeerde tekens: %20 is een spatie, %2F een schuine streep en %3D een gelijkteken. Andere die je vaak ziet zijn %26 (&), %3F (?), %3A (:), %2C (komma) en %27 (apostrof). De twee cijfers zijn de code van het teken in hexadecimaal. Letters met accenten en andere niet-ASCII-tekens nemen twee tot vier van zulke paren in beslag, zoals %C3%A9 voor é. Plak de hele string in de decoder om hem te lezen.

Wat is het verschil tussen encodeURI en encodeURIComponent?

encodeURI is bedoeld voor een heel adres en laat de tekens die het structureren, zoals : / ? # & =, met rust. encodeURIComponent is bedoeld voor één onderdeel, een parameterwaarde of een padsegment, en codeert die tekens ook, dus https://example.com/?a=1&b=2 wordt https%3A%2F%2Fexample.com%2F%3Fa%3D1%26b%3D2. In deze tool komt Parameterwaarde overeen met encodeURIComponent, en is Hele URL als encodeURI, maar behoudt het bestaande reeksen zoals %20 in plaats van ze te veranderen in %2520.

Hoe verwijder ik UTM-parameters uit een URL?

Plak de link op het tabblad URL ontleden en bewerken en klik op Tracking verwijderen (n). Dat verwijdert alle utm_*-tags en klik-ID's als fbclid en gclid in één keer. Klik daarna op URL kopiëren. Wil je er maar een paar weghalen, gebruik dan Parameter verwijderen bij de rijen die je niet wilt.

Is URL-codering hetzelfde als versleuteling of Base64?

Nee. URL-codering verbergt niets: iedereen kan caf%C3%A9 terug decoderen naar café, dus het beschermt nooit een wachtwoord of token. Het maakt tekens alleen veilig voor gebruik in een adres. Base64 is een andere codering die elke data, ook binaire bestanden, omzet in een string van 64 tekens. Een Base64-string in een URL heeft nog steeds codering nodig voor +, / en =, tenzij je de URL-veilige variant gebruikt, die de Base64 encoder en decoder kan maken.

Worden de URL's die ik plak geüpload of opgeslagen?

Nee. Coderen, decoderen en ontleden gebeuren in je browser, en niets wat je plakt wordt naar een server gestuurd. Dat is belangrijk, want URL's bevatten vaak toegangstokens, sessie-ID's of codes voor het opnieuw instellen van wachtwoorden. De browser onthoudt alleen je gekozen tabblad en opties, nooit de teksten. Het enige wat het adres laadt is Openen, dat het in een nieuw tabblad opent, net alsof je op de link klikt.

Meer tools voor programmeurs vind je in de categorie Ontwikkelaars, en tools die het ene formaat in het andere omzetten staan onder Converters. Om te zien wat twee lange URL’s van elkaar onderscheidt, bijvoorbeeld een werkende en een mislukte API-aanroep, plak je ze in de tool om teksten te vergelijken en vergelijk je ze per teken.