encodeURIComponent-Tool
Ein Leerzeichen wird zu %20, & zu %26 und = zu %3D, sodass aus hello world & café die Folge hello%20world%20%26%20caf%C3%A9 wird, die in einen einzigen Abfragewert passt. Jeder Wert folgt den Regeln von encodeURIComponent; Dekodieren kehrt sie um. Kostenlos in Ihrem Browser.
- Kostenlos
- Läuft in Ihrem Browser
- Ohne Anmeldung
- Ihre Daten bleiben auf Ihrem Gerät
Im Browser ausführen – kostenlos
Rechenbeispiel
- Text
- hello world & café
- Produktionsmenge
- hello%20world%20%26%20caf%C3%A9
- Berechnungsmodus
- Encode
- Eingabe
- hello world & café
- Länge
- 31
Beim Zusammenbauen eines Query-Strings kann ein einziges nicht maskiertes Und-Zeichen oder Leerzeichen einen Parameter zerteilen und eine Integration lahmlegen. Dieses encodeURIComponent-Tool wendet dieselben Regeln an wie JavaScript encodeURIComponent und decodeURIComponent: Reservierte Zeichen werden auf dem Hinweg zu prozentkodierten Sequenzen, und gültige %XX-Sequenzen werden auf dem Rückweg wieder zu lesbarem Text.
Was encodeURIComponent tatsächlich schützt
Eine vollständige URL ist kein einzelner undurchsichtiger Block. Schemata, Pfadtrenner, Query-Trennzeichen und Fragment-Marker haben strukturelle Bedeutung. encodeURIComponent ist die Funktion, die Sie verwenden, wenn der Wert als Daten innerhalb dieser Struktur reisen muss, ohne die Struktur selbst umzuschreiben. Leerzeichen werden zu %20, Und-Zeichen zu %26, Gleichheitszeichen zu %3D, und Nicht-ASCII-Text wie Buchstaben mit Akzent oder Emojis wird in UTF-8-Prozentsequenzen ausgeschrieben, damit Proxys und Server die Byte-Grenzen nicht falsch lesen.
Das unterscheidet sich von encodeURI, das viele reservierte Zeichen unangetastet lässt, weil es davon ausgeht, dass Sie eine ganze Adresse kodieren. Kodieren Sie einen kompletten https://-Link mit Komponentenregeln, verwandeln sich die Doppelpunkte und Schrägstriche in %-Sequenzen und der Link funktioniert nicht mehr. Lassen Sie einen frei eingegebenen Suchbegriff unkodiert und fügen ihn hinter ?
ein, sieht ein eingebettetes & wie ein neuer Parameter aus. Dieses Tool verwendet stets Komponenten-Semantik, sodass jeder Wert sicher hinter einem Schlüssel, zwischen Pfadsegmenten (wenn das Segment Daten ist) oder in einem Formular-Body platziert werden kann, der später zu einem Query wird.
Wie Sie den Endpunkt aufrufen und das Ergebnis lesen
Senden Sie ein Feld text mit der Zeichenkette, die Sie umwandeln möchten, und optional ein Feld mode mit dem Wert encode oder decode. Encode ist die Vorgabe: Die Engine führt encodeURIComponent auf der Eingabe aus und liefert mode, die ursprüngliche Eingabe, die transformierte Ausgabe und die Ausgabelänge zurück, damit Pipelines Größenbudgets ohne einen zweiten Durchlauf prüfen können. Decode führt decodeURIComponent aus und liefert dieselbe Form mit der wiederhergestellten Zeichenkette in output.
Leere Zeichenketten sind gültig und laufen als leere Zeichenketten durch den Round-Trip. Fehlendes text scheitert ebenfalls an der Validierung, bevor irgendeine Transformation läuft.
Wo Komponentenkodierung in echte Workflows passt
Such- und Filter-Oberflächen bauen teilbare Links aus vom Nutzer getippten Phrasen mit Leerzeichen, Anführungszeichen und nicht-lateinischen Schriften; jedes Feld vor dem Zusammensetzen zu kodieren hält den geteilten Link stabil über E-Mail-Clients und Chat-Apps hinweg, die nackte URLs umschreiben. Log- und Support-Tools zeigen oft rohe Anfragezeilen mit Prozentsequenzen; das Dekodieren dieser Werte stellt die ursprünglichen Suchbegriffe oder Dateinamen für die Untersuchung wieder her, ohne in eine Wegwerf-Konsole einzufügen.
Datenmigrationen machen doppelt kodierte Spalten rückgängig, wenn ältere Exporter zweimal kodierten, oder wenden eine einzige konsistente Komponentenkodierung an, wenn Werte gespeichert werden, die später in Redirects eingespleißt werden. Lehr- und Code-Review-Checklisten nutzen eine bekannt gute encodeURIComponent-Referenz, damit Nachwuchsentwickler sprachspezifische Helfer gegen die JavaScript-Baseline vergleichen und Bibliotheken erkennen können, die Pluszeichen oder Tilden anders behandeln.
Anwendungsfälle
Sichere Query-Parameter-Werte
Kodieren Sie E-Mails, Namen und frei eingegebene Filter, bevor Sie sie an ?key=value-Paare anhängen, damit reservierte Zeichen den Query-String niemals zerteilen.
Anfrage-Logs und Exporte dekodieren
Wandeln Sie prozentkodierte Pfad- oder Query-Fragmente aus Zugriffs-Logs und CSV-Exporten zurück in lesbares UTF-8 für Support und Analyse.
Konsistenzprüfungen über Stacks hinweg
Vergleichen Sie den URL-Encoder einer anderen Sprache mit der Ausgabe von JavaScript encodeURIComponent, damit sich gemischte Microservices auf dieselben Escape-Regeln einigen.
Häufige Fragen
Was ist der Unterschied zwischen encodeURIComponent und encodeURI?
encodeURIComponent maskiert reservierte Zeichen wie &, =, ? und /, damit ein Wert als Daten sicher ist. encodeURI lässt diese Strukturzeichen für ganze URLs unangetastet. Dieses Tool verwendet stets Komponenten-Semantik.
Kann ich mit demselben Endpunkt kodieren und dekodieren?
Ja. Setzen Sie mode auf encode (Vorgabe) oder decode. Die Antwort enthält immer mode, input, output und length.
Was passiert, wenn die Dekodier-Eingabe fehlerhaft ist?
Korrigieren Sie die Zeichenkette oder behandeln Sie sie als undurchsichtige Daten, statt sie zu dekodieren.
Verarbeitet es Unicode und Emojis?
Ja. Die Kodierung nutzt UTF-8-Prozentsequenzen, die JavaScript encodeURIComponent entsprechen, sodass Text mit Akzenten und Emojis beim Dekodieren korrekt durch den Round-Trip laufen.
Sollte ich die ganze Abfrage oder jeden Wert einzeln kodieren?
Kodieren Sie jeden Wert für sich und verbinden Sie die Werte danach mit normalen & und =. Wer eine fertige Abfrage kodiert, maskiert auch die Trennzeichen, und der empfangende Server erkennt nicht mehr, wo ein Wert endet und der nächste beginnt.
Verwandte Tools
Für Entwickler — API-Zugang
Alles auf dieser Seite ist auch per API verfügbar. Dieser Abschnitt richtet sich an Teams, die es in ihre eigenen Systeme einbinden möchten; alle anderen nutzen einfach das Tool oben.
Endpunkt
Authentifizierung per Bearer-Token. Ein einziger POST stellt die Aufgabe in die Warteschlange; das Ergebnis erhalten Sie per Webhook oder über einen signierten Link.
Aufruf aus Ihrem Stack
curl -X POST https://api.kit.forhosting.com/enc/url-component \
-H "Authorization: Bearer $KIT_KEY" \
-H "Content-Type: application/json" \
-d '{"text":"hello world & café"}'const res = await fetch("https://api.kit.forhosting.com/enc/url-component", {
method: "POST",
headers: {
"Authorization": `Bearer ${process.env.KIT_KEY}`,
"Content-Type": "application/json"
},
body: JSON.stringify({
"text": "hello world & café"
})
});
const { task_id } = await res.json();import os, requests
res = requests.post(
"https://api.kit.forhosting.com/enc/url-component",
headers={"Authorization": f"Bearer {os.environ['KIT_KEY']}"},
json={
"text": "hello world & café"
},
)
task_id = res.json()["task_id"]<?php
$res = file_get_contents("https://api.kit.forhosting.com/enc/url-component", false, stream_context_create([
"http" => [
"method" => "POST",
"header" => "Authorization: Bearer " . getenv("KIT_KEY") . "\r\nContent-Type: application/json",
"content" => '{"text":"hello world & café"}',
],
]));
$task = json_decode($res, true);body := bytes.NewBufferString(`{"text":"hello world & café"}`)
req, _ := http.NewRequest("POST", "https://api.kit.forhosting.com/enc/url-component", body)
req.Header.Set("Authorization", "Bearer "+os.Getenv("KIT_KEY"))
req.Header.Set("Content-Type", "application/json")
res, _ := http.DefaultClient.Do(req)Beispiel-Anfrage
{
"text": "hello world & café"
}Beispiel-Antwort
{
"task_id": "tsk_a1b2c3d4e5f6a1b2c3d4e5f6",
"type": "enc.url_component",
"status": "queued",
"_links": {
"result": "/tasks/tsk_…/result"
}
}Die API arbeitet asynchron: Sie erhalten sofort eine task_id. Polling ist mit 1 Anfrage pro Sekunde erlaubt.
Preis
Der Preis steht auf der Seite – keine Tokens, keine Credits. Fehlgeschlagene Aufgaben werden nicht berechnet.
Fehler
| HTTP | Code | Bedeutung |
|---|---|---|
401 | unauthorized | Der API-Schlüssel fehlt oder ist ungültig – prüfen Sie den Authorization-Header (Bearer). |
402 | insufficient_balance | Ihr Guthaben reicht für diese Aufgabe nicht aus – Aufladungen verfallen nicht. |
404 | unknown_type | Unbekannter Aufgabentyp – prüfen Sie das Feld „type“ gegen den Katalog. |
429 | rate_limited | Zu viele Anfragen – warten Sie kurz; Polling ist mit 1 Anfrage pro Sekunde erlaubt. |
Technische Hinweise
Nutzen Sie es, um Werte vorzubereiten, bevor sie in eine URL wandern, um Kodierungen aus Logs oder Payloads von Drittanbietern rückgängig zu machen und um ein deterministisches Ergebnis zu erhalten — ob Sie gratis im Browser arbeiten oder die KIT-API aufrufen.
Wie Sie den Endpunkt aufrufen und das Ergebnis lesen
Zahlen und Wahrheitswerte werden vor dem Kodieren genauso in Text umgewandelt, wie JavaScript sie stringifiziert, was schnelle API-Tests erleichtert. Fehlerhafte Prozentsequenzen beim Dekodieren, etwa ein einzelnes Prozentzeichen oder ein unvollständiges %X-Ende, lösen invalid_input mit einer Meldung aus, die den Dekodierfehler benennt; diese Aufgaben werden nicht berechnet. Da der Pfad reines Parsen ohne Netzwerk, Modell, Uhr oder Zufallsquelle ist, liefert dasselbe Paar aus text und mode stets dasselbe JSON-Objekt — im gratis Browser-Tool wie in der bezahlten API. Zu $0.002 pro erfolgreicher Anfrage folgt der Preis einer winzigen Edge-Transformation, sodass Sie Tausende Query-Werte in einem Bereinigungsjob kodieren können, ohne über Stufen zu verhandeln. Kodieren Sie lieber jeden Wert einzeln und verbinden ihn dann mit wörtlichen &- und =-Zeichen, statt einen bereits zusammengebauten Query-String zu kodieren, damit Trennzeichen strukturell bleiben und nur Nutzdaten-Zeichen maskiert werden.
Wo Komponentenkodierung in echte Workflows passt
Ausgehende Webhooks sind der klassische Fall: Eine Kunden-E-Mail, ein Ticket-Betreff oder ein frei eingegebener Tag muss in einer Callback-URL sitzen, ohne den Parser des Empfängers zu zerbrechen.
Technische Fragen
Ist das encodeURIComponent-Tool kostenlos?
Das Browser-Tool ist gratis und läuft lokal. API-Aufrufe nutzen vorausbezahltes KIT-Guthaben zum veröffentlichten Basispreis von $0.002; fehlgeschlagene Validierung wird nie berechnet.