XMLHttpRequest.overrideMimeType() — Methode · JavaScript-Referenz

Signatur

XMLHttpRequest.prototype.overrideMimeType(mimeType)

Beschreibung

Mit overrideMimeType() legen Sie fest, wie der Browser die Antwort einer XMLHttpRequest-Anfrage auswerten soll, und zwar unabhängig vom Content-Type-Header, den der Server schickt. Hilfreich ist das vor allem dann, wenn ein Server falsche oder fehlende MIME-Typen liefert, etwa XML als text/plain oder Text in einem falsch deklarierten Zeichensatz.

Typische Anwendungsfälle sind:

XML erzwingen: Mit overrideMimeType("text/xml") wird responseXML auch dann befüllt, wenn der Server einen anderen Typ meldet.
Zeichensatz korrigieren: Mit "text/plain; charset=ISO-8859-1" werden Umlaute aus alten Latin-1-Dateien richtig dekodiert.
Binärdaten als Rohtext (Altlast): Mit "text/plain; charset=x-user-defined" ließen sich Bytes früher über responseText auslesen. Heute nimmt man dafür besser responseType = "arraybuffer" oder "blob".

Die Methode muss vor send() aufgerufen werden. Genauer: bevor die Antwort geladen wird, also solange readyState noch nicht LOADING (3) oder DONE (4) ist. Sie verändert nur, wie der Browser die Daten auswertet. Die tatsächlichen Antwort-Header bleiben gleich, getResponseHeader("Content-Type") liefert also weiterhin den Wert des Servers.

Parameter

Name	Typ	Default	Beschreibung
$mimeType Pflicht	string		Der MIME-Typ, mit dem die Antwort ausgewertet werden soll, z. B. `"text/xml"` oder `"text/plain; charset=UTF-8"`. Ein optionaler `charset`-Parameter legt die Zeichenkodierung für `responseText` fest. Ist der Wert ungültig, wird `application/octet-stream` verwendet.

Rückgabewert

Typ

void

Beschreibung

Kein Rückgabewert (undefined).

Beispiele

XML-Antwort trotz falschem Content-Type als Dokument auswerten

const xhr = new XMLHttpRequest();
xhr.open("GET", "/api/feed"); // Server liefert fälschlich text/plain
xhr.overrideMimeType("text/xml");

xhr.addEventListener("load", () => {
  const doc = xhr.responseXML;
  const titles = [...doc.querySelectorAll("item > title")].map((t) => t.textContent);
  console.log(titles);
});

xhr.send();

["Erster Artikel", "Zweiter Artikel"]

Latin-1-Textdatei mit korrekten Umlauten laden

const xhr = new XMLHttpRequest();
xhr.open("GET", "/daten/alt-export.txt");
// Server sendet keinen Zeichensatz, die Datei ist ISO-8859-1-kodiert
xhr.overrideMimeType("text/plain; charset=ISO-8859-1");

xhr.onload = () => {
  console.log(xhr.responseText.split("\n")[0]);
  // Der Header selbst bleibt unverändert:
  console.log(xhr.getResponseHeader("Content-Type"));
};

xhr.send();

Größe;Straße;Maß text/plain

Promise-Wrapper mit optionalem MIME-Override

const request = (url, mimeType) =>
  new Promise((resolve, reject) => {
    const xhr = new XMLHttpRequest();
    xhr.open("GET", url);
    if (mimeType) xhr.overrideMimeType(mimeType); // vor send()!
    xhr.onload = () =>
      xhr.status >= 200 && xhr.status < 300
        ? resolve(xhr)
        : reject(new Error(`HTTP ${xhr.status}`));
    xhr.onerror = () => reject(new Error("Netzwerkfehler"));
    xhr.send();
  });

const main = async () => {
  const xhr = await request("/config.xml", "application/xml");
  console.log(xhr.responseXML.documentElement.nodeName);
};

main();

config

// Wichtig · Fallstricke

Zeitpunkt: Wird die Methode aufgerufen, wenn readyState bereits LOADING oder DONE ist, wirft sie eine InvalidStateError-DOMException. Rufen Sie sie also immer vor send() auf.
Nur die Auswertung ändert sich: Die Methode beeinflusst responseText, responseXML und response. Den Anfrage-Header Accept und die Antwort-Header ändert sie nicht. Soll der Server ein bestimmtes Format liefern, verwenden Sie setRequestHeader(\"Accept\", …).
Verhältnis zu responseType: Bei responseType = \"json\" wird immer als UTF-8 dekodiert, ein charset im Override wird dann ignoriert. Mit \"document\" entscheidet der überschriebene MIME-Typ, ob HTML oder XML geparst wird.
Binärdaten: Der alte Trick mit charset=x-user-defined funktioniert zwar noch, ist aber überholt. Für Binärdaten eignen sich responseType = \"arraybuffer\" bzw. \"blob\" besser.
Sicherheit: Ein Override hebelt keine CORS-Prüfungen aus. Wer HTML-Antworten, die als Text erzwungen wurden, per innerHTML einfügt, riskiert XSS.
Kompatibilität: Die Methode wird von allen modernen Browsern unterstützt (nicht von IE ≤ 10). In Service Workern gibt es kein XMLHttpRequest. Die Fetch-API hat kein direktes Gegenstück: Dort liest man response.arrayBuffer() und dekodiert selbst mit TextDecoder oder DOMParser.

Siehe auch

XMLHttpRequest XMLHttpRequest.setPrivateToken() XMLHttpRequest.setRequestHeader() XMLHttpRequest.abort() XMLHttpRequest.getResponseHeader()