AJAX-Alternative zu JSON: HTTP-Header nutzen

Header und Body sind per se bereits voneinander getrennt

Das XHR-Object erlaubt zum einen, mit xhr.setRequestHeader() einen bestimmten Header für den Request zu setzen. Zum Anderen ist es auch möglich, mit xhr.getResponseHeader() bestimmte Header der Response zu ermitteln. Damit ergeben sich einige programmiertechnische Vereinfachungen wenn es darum geht strukturierte Daten zu senden, insbesondere wenn der Request wahlweise per Javascript oder als gewöhnlicher Link ausgelöst werden soll (progressive Enhancement). Beispielsweise soll per Klick eine Grafik mit Beschreibung als Response angefordert werden. Ist Javascript aktiv, sollen sowohl die Beschreibung als auch die Grafik im Browser erscheinen, ist Javascript nicht aktiv, soll der Browser nur die Grafik ausgeben. Dieses Beispiel macht deutlich, daß auf eine Serialisierung mit JSON sowohl serverseitig als auch clientseitig verzichtet werden kann, weil die Trennung der Response-Header vom Response-Body ohnehin Bestandteil des HTTP-Protokolls ist. Praktisch wird die Grafik im Response-Body gesendet, die Beschreibung hingegen in einem custom-Response-Header.

Das Beispiel zum ausprobieren

Zum Einen der direkte Link zur Grafik Ohne Javascript, das gibt die Gafik direkt im Browser aus, zurück mit dem Back-Button. Andererseits geht der Request per AJAX (mit JavaScript) raus, wenn Sie hier klicken. In diesem Fall sehen Sie die Beschreibung und die Grafik untenstehend.

Die entscheidende Vereinfachung besteht darin, daß serverseitig keine weiteren Kontrollstrukturen erforderlich sind, d.h., daß die Response sowohl für AJAX als auch für den nativen Request dieselbe ist und auch der Request-URI samt seiner Parameter.

Anmerkungen bezüglich Custom-HTTP-Header

Gemäß Nomenklatur beginnen Custom-Header mit x- gefolgt vom Namen des Headers, bspw. x-descr. Der Name selbst darf lt. HTTP nur ASCII-Zeichen enthalten, was man mit Builtinfunktionen recht einfach sicherstellen kann:

$('#descr').text(decodeURIComponent(this.getResponseHeader('x-descr'))); // JavaScript
uri_escape('Bildbeschreibung, auch Umlaute sind da möglich');                  # Perl

The maximum total size of the HTTP origin response headers is 8192 bytes. If the origin serves a response with a header size that is greater than 8192 bytes, we will serve a 502 to the client.

Umlaute und UTF-8 in HTTP-Header

Auch wenn lt. HHTP-Standards nur ASCII in den Headern notiert sein soll ist es dennoch möglich, beliebige Bytes da unterzubringen. Außer Zeilenumbrüchen, denn mit einen Zeilenumbruch beginnt ja ein neuer Header. Es ist jedoch so, daß Javascript in HTTP-Headern keine kodierten Zeichen erwartet sondern ASCII, also Bytes bis zur Wertigkeit 127. Von daher ist es notwendig, bei diesen Bytes die Kodierung wiederherzustellen und das geht so:

    let uml = this.getResponseHeader('x-uml');
    let uha = new Uint8Array(uml.length);
    uha.forEach( function(a,i){ 
        uha[i] = uml.charCodeAt(i); 
    });
    let dec = new TextDecoder();
    console.log(dec.decode(uha));

Datenschutzerklärung: Diese Seite dient rein privaten Zwecken. Auf den für diese Domäne installierten Seiten werden grundsätzlich keine personenbezogenen Daten erhoben. Das Loggen der Zugriffe mit Ihrer Remote Adresse erfolgt beim Provider soweit das technisch erforderlich ist. sos@rolfrost.de.