encode URI, decode URI

Query Strings verschlüsseln

Die Probleme beginnen mit Sonderzeichen in Dateinamen von PDF-Dokumenten und Bildern: https://www.pretty-name.de/PDF mit hübschen Kätzchen.pdf und laufen in den Query-Strings bei Shops mit Produktnamen, Autoren und Ortsnamen zur Höchstform auf. Solche URLs müssen encodiert – konvertiert oder verschlüsselt – werden.

https://www.pretty-name.de/PDF%20mit%20h%C3%BCbschen%20K%C3%A4tzchen.pdf

Damit jede Maschine alles korrekt lesen kann, sind in URLs (und in Query Strings) nur Buchstaben des Alphabets, Ziffern und die Handvoll Sonderzeichen erlaubt, die in einer URL oder Webadresse vorkommen können. Alle anderen Zeichen müssen kodiert – encodiert – werden, damit keine Probleme oder sogar Sicherheitslücken entstehen.

Auch bei Cookies codiert man den Wert vor dem Speichern, denn Werte von Cookies dürfen keine Kommas, keine Semikolons oder Leerzeichen enthalten.

encodeURI

encodeURI(s) nimmt den unverschlüsselten String gibt die encodierte Version eines Strings zurück. Dabei werden bestimmte Zeichen durch ein, zwei oder drei UTF-8-Escape-Sequenzen ersetzt. Der Original-String bleibt unverändert.

• entweder zu zwei Ziffern (%xx) oder
• ihrem hexadezimalen Äquivalent (%uxxxx) mit vier Ziffern.

Ein Leerzeichen wird z.B. durch %20 und ein Semikolon durch %3B dargestellt.

Durch die Codierung wird der Query-String von Formularen portabel und kann auf allen Systemen, die Ascii unterstützen, korrekt dargestellt werden.

encodeURI(string) verschlüsselt alle Zeichen außer

	
<input type="text" id="myString" value="" />
<input type="text" id="encoded" disabled />
<input type="text" id="decoded" disabled />
	
const myString = document.getElementById('myString').value;
const encoded = document.getElementById('encoded');
const decoded = document.getElementById('decoded');
	
encoded.value = encodeURI(myString);
decoded.value = decodeURI(encoded.value);

encodeURI() wandelt den übergebenen Parameter in eine URL um, wobei encodeURI( "meine Webseite.html#oben" ) meine%20Webseite.html#oben zurückgibt – das Trennzeichen für einen HTML-Anker wird nicht in die hexadezimale Form %23 umgewandelt. Wenn die URL als Parameter an ein CGI-Skript übergeben werden soll, muss encodeURIComponent() verwendet werden.

encodeURI() sollte aus Sicherheitsgründen mit jeder Benutzereingabe, die als Teil einer URI übergeben wird, aufgerufen werden. Wird die Eingabe nicht codiert, würde eine Benutzereingabe wie Meier &id=cid als "name=Meier%20&id=cid" übertragen und anstelle eines POST-Schlüssels für name hätten wir zwei POST-Schlüssel name und id. Wenn in einem PHP-Backend Register Globals aktiviert ist, kann eine fehlende Encodierung zu Sicherheitslücken führen.

decodeURI

decodeURI() ersetzt die Sonderzeichen in einer Escape-Sequenz, die mit encodeURI() erzeugt wurde, wieder durch die ursprünglichen Zeichen.

encodeURIComponent, decodeURIComponent

encodeURI () kodiert eine volle URL, während encodeURIComponent () für einen Komponente wie einen Query-String gedacht ist. 11 Zeichen werden von encodeURI () nicht kodiert, wohl aber von encodeURIComponent ().<(p>)>

encodeURIComponent(string) verschlüsselt alle Zeichen außer

Der Unterschied zwischen encodeURI und encodeURIComponent liegt in einer Differenz von 11 Zeichen. Während encodeURI die Sonderzeichen eines Query-Strings in einer URL unangetastet lässt, verschlüsselt encodeURICompontent auch &, /, : und +.

Wenn im Query-String z.B. ein Buchtitel »Leben, Leiden und Frust mit @« vorkommt, müssen das »,« und das »@« verschlüsselt werden – also

const title = encodeURIComponent ('Leben, Leiden und Frust mit @');
const autor = encodeURIComponent ('rüdiger@xxx.xx');
const url = encodeURI ('https://www.xxx.xx/?title=' + title + '&autor=' + autor);

document.getElementById('resp1').innerHTML = 
   encodeURI ('https://www.xxx.xx/?title=' + 
               title + '&autor=' + autor);

document.getElementById('resp2').innerHTML = 
    decodeURI ('https://www.xxx.xx/?title=' + 
                decodeURIComponent(title) + 
                '&autor=' + 
                decodeURIComponent(autor));

Zuerst die Kompontenten mit encodeURIComponent verschlüsseln, dann die URL mit encodeURI verschlüssen.

Auf dem Weg zurück müssen zuerst die Komponenten entschlüsselt – dekodiert – werden.