URL-Encoder & Decoder — Sonderzeichen in URLs Codieren

URL mit Sonderzeichen einfügen und sofort die prozentcodierte Version erhalten — oder einen %20%3F-String zurück in lesbaren Text decodieren. Verwendet dasselbe encodeURIComponent/decodeURIComponent wie Browser intern. Alles läuft im Browser; nichts erreicht einen Server.

Operation Mode

tools.urlEncoder.inputText

tools.urlEncoder.enterTextToEncode

tools.urlEncoder.encodedOutput

Kodieren und dekodieren Sie URL-Zeichenfolgen

URL Encoding converts special characters into a format that can be transmitted over the internet.

For example, spaces become %20, and other special characters like &, =, and ? are also encoded.

This tool uses encodeURIComponent() anddecodeURIComponent() functions, which encode all characters except:

Alphabetic characters (A-Z, a-z)
Digits (0-9)
Special characters: - _ . ! ~ * ' ( )

Wie URL-Codierung Funktioniert (RFC 3986)

URLs können nur einen begrenzten Satz von ASCII-Zeichen enthalten. Alles außerhalb — Leerzeichen, Unicode, reservierte Trennzeichen als Daten verwendet — muss „prozentcodiert" werden: ein % gefolgt von zwei Hex-Ziffern, die den Byte-Wert darstellen. Ein Leerzeichen wird zu %20, ein Schrägstrich in einem Query-Wert wird zu %2F, und das deutsche ü wird zu %C3%BC (zwei UTF-8-Bytes).

Das ist nicht optional. Wenn du ein rohes & in einen Parameterwert steckst, interpretiert der Server es als Parameter-Trennzeichen, nicht als Daten. Ich habe dieses Problem mindestens ein Dutzend Mal debuggt — eine API gibt „fehlender Parameter" zurück, weil jemand vergessen hat, das & in einem Firmennamen wie „Schmidt & Söhne" zu codieren.

Die Spezifikation (RFC 3986, Abschnitt 2.1) definiert „nicht-reservierte Zeichen", die nie codiert werden müssen: A-Z, a-z, 0-9 und - _ . ~. Alles andere ist entweder reserviert (hat spezielle Bedeutung in URLs) oder muss codiert werden. Der knifflige Teil: ob du reservierte Zeichen codierst, hängt vom Kontext ab. Ein / im Pfad ist ein Trennzeichen, aber ein / innerhalb eines Query-Parameter-Werts ist Daten und muss als %2F codiert werden.

Anleitung

Codieren- oder Decodieren-Modus wählen.
Text einfügen oder eingeben — eine vollständige URL, einen Query-Parameter-Wert oder einen bereits codierten String.
Das Ergebnis aktualisiert sich während der Eingabe. Mit einem Klick kopieren.
Beim Codieren: nur den Wert-Teil einfügen (nicht die ganze URL), um Doppelcodierung der Struktur zu vermeiden.

Wann Du Das Brauchst

Query-Strings mit Benutzereingaben erstellen

Benutzer sucht nach „Schuhe & Taschen" — wenn du das & nicht codierst, teilt der Server es in zwei Parameter. encodeURIComponent("Schuhe & Taschen") gibt dir einen sicheren codierten String für ?q=.

OAuth und Redirect-URLs debuggen

OAuth-Flows übergeben redirect_uri als Query-Parameter. Diese URI enthält selbst ? und &. Du musst die gesamte Redirect-URL codieren, damit sie sicher als einzelner Parameterwert transportiert wird. Doppelcodierungs-Bugs hier verursachen „invalid redirect_uri"-Fehler, die schwer zu finden sind.

Tracking-Links und UTM-Parameter decodieren

Marketing-Tools generieren URLs mit codierten UTM-Parametern, die unlesbar sind. Die vollständige URL hier einfügen, um zu sehen, was utm_campaign, utm_source und utm_content tatsächlich sagen, ohne %20 und %3D manuell zu parsen.

JSON oder spezielle Daten in URL-Parametern übergeben

Manche APIs akzeptieren JSON in Query-Strings (schlechte Praxis, aber es existiert). Die Zeichen { } " brauchen alle Codierung. Dieses Tool zeigt dir genau, wie die codierte Version aussieht, bevor du sie hardcodest.

Häufige Fehler Vermeiden

Nicht die gesamte URL codieren — nur die Werte

encodeURIComponent("https://example.com/path?q=hello") codiert auch :// und ?, was die URL-Struktur zerstört. Codiere einzelne Parameterwerte. Verwende encodeURI() nur wenn du eine vollständige URL codieren willst und dabei die Struktur erhalten möchtest.

Vorsicht vor Doppelcodierung

Wenn ein Wert bereits codiert ist (%20), wird bei erneuter Codierung %20 zu %2520 (das % wird zu %25 codiert). Das ist der #1-Bug den ich in URL-Handling-Code sehe. Immer prüfen, ob dein Framework bereits codiert, bevor du eine weitere Schicht hinzufügst.

+ vs %20 für Leerzeichen — kenne den Unterschied

In Query-Strings (application/x-www-form-urlencoded) bedeutet + Leerzeichen. In Pfad-Segmenten ist nur %20 gültig. JavaScripts encodeURIComponent verwendet immer %20. Wenn du beim Decodieren + siehst, musst du sie möglicherweise erst durch Leerzeichen ersetzen — decodeURIComponent macht das nicht automatisch.

UTF-8-Codierung passiert vor der Prozentcodierung

Das Zeichen ü wird zuerst als UTF-8-Bytes codiert (0xC3 0xBC), dann wird jedes Byte prozentcodiert (%C3%BC). Wenn dein System Latin-1 statt UTF-8 verwendet, bekommst du %FC — ein Byte statt zwei. Diese Diskrepanz verursacht Zeichensalat. Immer UTF-8 verwenden.

Beispiele

Suchanfrage mit Sonderzeichen codieren

Ein Benutzer sucht nach "C++ tutorials & guides" — alle drei Sonderzeichen brauchen Codierung.

Input

C++ tutorials & guides

Output

C%2B%2B%20tutorials%20%26%20guides

Tracking-URL-Parameter decodieren

Eine Marketing-URL enthält einen codierten Redirect — decodiere ihn, um zu sehen, wohin er tatsächlich führt.

Input

https%3A%2F%2Fexample.com%2Flanding%3Futm_source%3Dnewsletter%26utm_campaign%3Dspring

Output

https://example.com/landing?utm_source=newsletter&utm_campaign=spring

Funktionen

Codieren- und Decodieren-Modi mit sofortigem Wechsel
Verwendet Standard encodeURIComponent/decodeURIComponent — wie Browser
Verarbeitet Unicode, Emoji und Multi-Byte-Zeichen korrekt
Zeigt Ergebnisse während der Eingabe — kein Absende-Button nötig
Ein-Klick-Kopie in die Zwischenablage
Läuft 100% im Browser — null Netzwerkanfragen, keine Datenerfassung

Häufig Gestellte Fragen

Was ist der Unterschied zwischen encodeURI() und encodeURIComponent()?

encodeURI() ist zum Codieren einer vollständigen URL — es lässt :, /, ?, # und & unberührt, weil sie strukturell sind. encodeURIComponent() codiert alles außer A-Z, 0-9 und - _ . ! ~ * ' ( ). In der Praxis willst du fast immer encodeURIComponent(), weil du einen Wert codierst, um ihn in eine URL einzusetzen, nicht die URL selbst.

Warum bricht meine URL, wenn ich & oder = in einem Parameterwert habe?

Weil & Parameter trennt und = Schlüssel von Wert trennt in Query-Strings. Wenn dein Wert diese Zeichen wörtlich enthält, teilt der Parser dort. Codiere den Wert: "Tom & Jerry" wird zu "Tom%20%26%20Jerry". Jetzt sieht der Parser einen Parameter mit einem codierten Ampersand, nicht zwei separate Parameter.

Soll ich %20 oder + für Leerzeichen verwenden?

Kommt auf den Kontext an. Im Query-String von application/x-www-form-urlencoded (HTML-Formulare) bedeutet + Leerzeichen. In URL-Pfad-Segmenten ist nur %20 gültig. JavaScripts encodeURIComponent() erzeugt immer %20. Die meisten Server akzeptieren beides in Query-Strings, aber wenn du Pfad-Segmente baust, nimm %20.

Wie werden Unicode-Zeichen wie Emoji oder Umlaute codiert?

Das Zeichen wird zuerst in UTF-8-Bytes konvertiert, dann wird jedes Byte prozentcodiert. Das Emoji 🎉 sind 4 UTF-8-Bytes: F0 9F 8E 89, wird also zu %F0%9F%8E%89. Das ü sind 2 Bytes: C3 BC → %C3%BC. Dieses Tool erledigt alles automatisch — einfach einfügen und es funktioniert.

Was verursacht Doppelcodierung und wie behebe ich sie?

Doppelcodierung passiert, wenn du einen bereits codierten String nochmal codierst. %20 wird zu %2520, weil das % zu %25 codiert wird. Häufige Ursache: dein Framework codiert automatisch, und du rufst zusätzlich encodeURIComponent() auf. Lösung: erst decodieren (um den Rohwert zu bekommen), dann einmal codieren. Oder prüfe, ob deine HTTP-Bibliothek die Codierung bereits handhabt (die meisten tun es — axios, fetch mit URLSearchParams, etc.).

Tipps und verwandte Workflows

Müssen Sie stattdessen Binärdaten kodieren? Nutzen Sie unseren Base64-Encoder.
Formatieren Sie JSON-Daten, bevor Sie sie URL-kodieren, mit unserem JSON-Formatierer.
Erstellen Sie einen QR-Code für Ihre kodierte URL mit unserem QR-Code-Generator.
Hashen Sie Ihre URL für Cache-Invalidierung mit unserem Hash-Generator.