$.Ajax-Datentyp in jQuery

$.ajax verwendet die Option dataType, um die Art der Antwort anzugeben, die Ihr Code erwartet. Sie beeinflusst, wie jQuery die Antwort nach ihrem Eingang verarbeitet. Davon zu unterscheiden ist contentType, das das Format der Daten im Anforderungstext beschreibt. Eine Anfrage kann beispielsweise JSON senden und zugleich eine Textantwort erwarten. Wählen Sie jede Option passend zu ihrer jeweiligen Richtung.

Was dataType in $.ajax bedeutet

Setzen Sie dataType auf eine Zeichenfolge wie "json" oder "html". Der Wert bezeichnet das Antwortformat, das Ihr Erfolgs-Handler verarbeiten soll. Es handelt sich nicht um einen MIME-Typ: Verwenden Sie "json" statt "application/json". Wenn Sie die Option weglassen, kann jQuery anhand des Content-Type der Antwort ableiten, wie sie zu verarbeiten ist. Wenn Ihre Anwendung auf ein bestimmtes Format angewiesen ist, macht die Angabe des erwarteten Typs diese Absicht deutlich.

Der Server muss weiterhin Inhalte zurückgeben, die dem angeforderten Format entsprechen. Wenn Sie dataType: "json" setzen, wird beliebiger Antworttext dadurch nicht zu gültigem JSON. Ebenso legt contentType nicht fest, wie die Antwort geparst wird.

dataType in einer einfachen $.ajax-Anfrage setzen

Fügen Sie die Option in das Einstellungsobjekt ein, das Sie an $.ajax übergeben. Ersetzen Sie die Beispiel-URL durch einen Endpunkt Ihrer Anwendung. Dieses eigenständige JavaScript-Beispiel veranschaulicht ein Einstellungsobjekt und gibt den erwarteten Antworttyp aus; es ruft $.ajax nicht auf und sendet keine Netzwerkanfrage.

Führen Sie dieses Beispiel aus:

Der Code und die angezeigten Bezeichnungen oder Ausgaben in diesem Abschnitt bleiben auf Englisch.

const request = {
  url: "/api/employees",
  method: "GET",
  dataType: "json"
};
console.log(`${request.method} ${request.url}: expecting ${request.dataType}`);

Ausgabe:

GET /api/employees: expecting json

In einer Anwendung, die jQuery lädt, übergeben Sie diese Einstellungen an $.ajax und verarbeiten die geparste Antwort anschließend in success oder in einem Promise-Callback. Wenn eine Anfrage einen Body sendet, setzen Sie contentType passend zu dessen Format und verwenden Sie data für den Inhalt. Fügen Sie einer GET-Anfrage ohne Body nicht ohne Grund einen Content-Type für den Anforderungstext hinzu.

Einen Antworttyp auswählen

Wählen Sie den Wert passend zu der Antwort, die Ihre Anwendung verarbeiten muss:

• "xml" ist für ein XML-Dokument gedacht, das Ihr Code untersuchen oder verarbeiten soll.
• "html" ist für ein HTML-Fragment oder -Dokument gedacht, das Ihr Code als Markup verwendet. Behandeln Sie zurückgegebenes Markup als nicht vertrauenswürdig, sofern Ihre Anwendung keine sichere Verarbeitungsstrategie hat.
• "script" ist für eine Antwort gedacht, die als JavaScript ausgeführt werden soll. Verwenden Sie diesen Typ nur bei einer vertrauenswürdigen Quelle und wenn die Ausführung eines entfernten Skripts angemessen ist.
• "json" ist für strukturierte Daten gedacht, die Ihr Code als JavaScript-Wert verwendet, etwa ein Objekt oder ein Array.
• "jsonp" ist für einen JSONP-Endpunkt gedacht, der eine in einen Callback eingebettete Antwort zurückgibt. Das ist ein eigener Antwortmechanismus und keine allgemeine Möglichkeit, beliebige JSON-Endpunkte domänenübergreifend anzufragen.
• "text" ist für eine einfache Zeichenfolge gedacht, die Ihr Code selbst verarbeitet.

Die Option sollte zur tatsächlichen Antwort des Endpunkts passen. Wenn das Antwortformat oder das Serververhalten von der Annahme abweicht, untersuchen Sie die Antwort und die Anfrage, statt den Optionstyp willkürlich zu ändern.

Beispiele für jeden Antworttyp

Jede der folgenden Zeilen ist ein beispielhaftes Einstellungsobjekt für $.ajax, keine ausgeführte Anfrage. Die Endpunktpfade sind Platzhalter. Ersetzen Sie jeden durch eine URL, die das angegebene Format zurückgibt, und ergänzen Sie die Erfolgsbehandlung, die Ihre Anwendung benötigt.

• XML: $.ajax({ url: "/placeholder.xml", method: "GET", dataType: "xml" }) erwartet eine XML-Antwort, die Ihr Code untersuchen oder verarbeiten kann.
• HTML: $.ajax({ url: "/placeholder.html", method: "GET", dataType: "html" }) erwartet Markup. Verwenden Sie für zurückgegebenes HTML eine sichere Verarbeitungsstrategie.
• Script: $.ajax({ url: "/trusted-script.js", method: "GET", dataType: "script" }) ist für JavaScript gedacht, das ausgeführt werden soll. Verwenden Sie diesen Typ nur bei einer vertrauenswürdigen Quelle und wenn die Ausführung eines entfernten Skripts angemessen ist.
• JSON: $.ajax({ url: "/api/employees", method: "GET", dataType: "json" }) erwartet strukturierte Daten, beispielsweise ein Objekt oder ein Array, für den Erfolgs-Handler.
• JSONP: $.ajax({ url: "/jsonp-capable-endpoint", method: "GET", dataType: "jsonp" }) setzt einen Server voraus, der JSONP unterstützt und die vom Client erwartete Callback-Form zurückgibt.
• Text: $.ajax({ url: "/status", method: "GET", dataType: "text" }) erwartet eine einfache Zeichenfolge, die Ihr Code verarbeiten oder anzeigen kann.

Diese Beispiele zeigen, wie sich jede Option einem passenden Endpunkt-Platzhalter zuordnen lässt. Sie bedeuten weder, dass die Endpunkte existieren, noch dass eine Anfrage gesendet wurde.

Parsing, Caching und domänenübergreifendes Verhalten

Das Parsen von Antworten, das Cache-Verhalten und die domänenübergreifende Verarbeitung können von der jQuery-Version und dem Kontext der Anfrage abhängen. Die Beispiele hier versprechen kein bestimmtes Ergebnis bei fehlerhaftem oder leerem JSON, beim Caching von Skripten oder bei der Umwandlung zwischen JSON und JSONP. Prüfen Sie die Dokumentation der von Ihrer Anwendung verwendeten Version und vergewissern Sie sich, dass der Endpunkt den gewählten Antworttyp unterstützt.

JSONP ist nicht mit gewöhnlichem JSON austauschbar: Es erfordert einen Endpunkt, der eigens eine in einen Callback eingebettete Antwort zurückgibt. Auch eine ursprungsübergreifende Anfrage hängt vom Verhalten des Browsers und des Servers ab; die Auswahl von "json" allein ermöglicht keinen ursprungsübergreifenden Zugriff. Schlägt eine Anfrage fehl, prüfen Sie den Antworttext, die Antwort-Header, die Browserkonsole und die Serverkonfiguration und vergleichen Sie diese anschließend mit dem Typ, den Ihr Code erwartet.