XMLHttpRequest

Xmlhttprequest (Xhr) ist ein API in Form eines Objekt Deren Methoden Daten zwischen a übertragen Webbrowser und ein Webserver. Das Objekt wird vom Browser bereitgestellt JavaScript Umgebung. Insbesondere das Abrufen von Daten von XHR zum Zwecke der kontinuierlichen Änderung eines geladenen Modifikums Website ist das zugrunde liegende Konzept von Ajax Entwurf. Trotz des Namens kann XHR mit anderen Protokollen als Protokollen verwendet werden Http und Daten können in Form von nicht nur vorhanden sein Xml,^[1] aber auch JSON,^[2] Html oder einfacher Text.^[3]

Waswg unterhält einen xhr -Standard als Lebendes Dokument. Laufende Arbeiten am W3c Um eine stabile Spezifikation zu erstellen, basiert auf Schnappschüssen des Whatwg -Standards.

Geschichte

Das Konzept hinter dem Xmlhttprequest Objekt wurde ursprünglich von den Entwicklern von erstellt Outlook Web Access (von Microsoft) für Microsoft Exchange Server 2000.^[4] Ein Schnittstelle genannt Ixmlhttprequest wurde entwickelt und in die zweite Version der implementiert MSXML Bibliothek mit diesem Konzept.^[4][5] Die zweite Version der MSXML -Bibliothek wurde mit verschickt Internet Explorer 5.0 im März 1999, um Zugriff zu ermöglichen, via ActiveX, zum Ixmlhttprequest Schnittstelle mit dem Xmlhttp Verpackung der MSXML -Bibliothek.^[6]

Internet Explorer -Versionen 5 und 6 definierten die ID XMLHTTPREQUEST -Objektkennung in ihren Skriptsprachen nicht als XMLHTTPrequest -Kennung selbst zum Zeitpunkt ihrer Veröffentlichungen nicht Standard.^[6] Rückwärtskompatibilität kann durch Objekterkennung erreicht werden, wenn die XMLHTTPREquest -Kennung nicht vorhanden ist.^[7] Microsoft fügte die hinzu Xmlhttprequest Objektkennung in seine Skriptsprachen in Internet Explorer 7.0 veröffentlicht im Oktober 2006.^[6]

Das Mozilla Projekt entwickelte und implementierte eine Schnittstelle mit dem Namen NSIXMLHTTPREQUEST in die Gecko Layout -Motor. Diese Schnittstelle wurde so modelliert, dass sie eng mit Microsofts arbeiten Ixmlhttprequest Schnittstelle wie möglich.^[8][9] Mozilla hat eine Wrapper erstellt, die diese Schnittstelle über ein JavaScript -Objekt verwendet hat, das sie aufgerufen haben Xmlhttprequest.^[10] Das Xmlhttprequest Objekt war bereits als Gecko Version 0.6 zugänglich, die am 6. Dezember 2000 veröffentlicht wurde.^[11][12] Aber es war erst so spät wie die Version 1.0 von Gecko, die am 5. Juni 2002 veröffentlicht wurde.^[11][12] Das Xmlhttprequest Objekt wurde ein de facto Standard in anderen wichtigen Web -Clients, implementiert in Safari 1.2 im Februar 2004 veröffentlicht,^[13] Konqueror, Oper 8.0 veröffentlicht im April 2005,^[14] und ICAB 3.0b352 veröffentlicht im September 2005.^[15]

Mit dem Aufkommen von Cross-Browser-JavaScript-Bibliotheken wie z. JQueryEntwickler können xmlHttprequest -Funktionalität indirekt aufrufen.

Standards

Das World Wide Web Konsortium veröffentlicht a Arbeitsentwurf Spezifikation für die Xmlhttprequest Objekt am 5. April 2006, bearbeitet durch Anne van Kesteren von Opera -Software und Dean Jackson von W3C.^[16] Sein Ziel ist es, "eine minimale Reihe interoperierbarer Funktionen zu dokumentieren, die auf vorhandenen Implementierungen basieren, sodass Webentwickler diese Funktionen ohne plattformspezifischen Code verwenden können."

Der W3C veröffentlichte auch einen anderen Arbeitsentwurf Spezifikation für die Xmlhttprequest Objekt "xmlhttprequest Level 2" am 25. Februar 2008.^[17] Stufe 2 besteht aus erweiterten Funktionen zu der Xmlhttprequest Objekt, einschließlich, aber nicht beschränkt auf Fortschrittsereignisse, Unterstützung für Cross-Site-Anfragen und die Behandlung von Byteströmen. Ende 2011 wurde die Spezifikation der Stufe 2 aufgegeben und in die ursprüngliche Spezifikation aufgenommen.^[18]

Ende 2012 die Waswg Die Entwicklung übernahm und einen lebendigen Standard verwenden Web IDL.^[19] Die aktuellen Entwürfe von W3C basieren auf Schnappschüssen der Waswg Standard.

HTTP -Anfrage

Die folgenden Abschnitte zeigen, wie eine Anforderung unter Verwendung der XMLHTTPrequest -Objektfunktionen innerhalb eines konformen Benutzeragenten basierend auf dem W3C -Arbeitsentwurf basiert. Da der W3C -Standard für das XMLHTTPrequest -Objekt weiterhin ein Entwurf ist, halten sich die Benutzeragenten möglicherweise nicht an alle Funktionen der W3C -Definition, und eine der folgenden Aussagen kann sich ändern. Extreme Sorgfalt sollte berücksichtigt werden, wenn das Scripting mit dem XMLHTTPrequest -Objekt über mehrere Benutzeragenten hinweg übereinstimmt. In diesem Artikel wird versucht, die Inkonsistenzen zwischen den Hauptbenutzeragenten aufzulisten.

Das offen Methode

Das Http und Https Anfragen des XMLHTTPrequest -Objekts müssen über die initialisiert werden offen Methode. Diese Methode muss sein aufgerufen Vor dem tatsächlichen Versand einer Anfrage zur Validierung und Behebung der Anforderungsmethode, URL, und Uri Benutzerinformationen, die für die Anfrage verwendet werden sollen. Diese Methode stellt nicht sicher, dass die URL existiert oder die Benutzerinformationen korrekt sind. Diese Methode kann bis zu fünf akzeptieren Parameterbenötigt aber nur zwei, um eine Anfrage zu initialisieren.

Öffnen (Methode, URL, Asynchron, Benutzername, Passwort)

Der erste Parameter der Methode ist a Textzeichenfolge angeben die HTTP -Anforderungsmethode benutzen. Die Anforderungsmethoden, die durch eine Konformierung unterstützt werden müssen User-Agent, definiert durch die W3c Der Entwurf für das XMLHTTPrequest -Objekt ist derzeit als Folgendes aufgeführt.^[20]

• Bekommen (unterstützt von Internet Explorer 7+, Mozilla 1+)
• Post (unterstützt von IE7+, Mozilla 1+)
• Kopf (unterstützt von IE7+)
• STELLEN
• LÖSCHEN
• Optionen (unterstützt von IE7+)

Anforderungsmethoden sind jedoch nicht auf die oben aufgeführten beschränkt. Der W3C -Entwurf gibt an, dass ein Browser nach eigenem Ermessen zusätzliche Anforderungsmethoden unterstützen kann.

Der zweite Parameter der Methode ist ein anderer Textzeichenfolge, dieser an, der das angibt URL der HTTP -Anfrage. Die W3C empfiehlt, dass Browser einen Fehler aufnehmen und die Anfrage von a nicht zulassen sollten URL mit beiden anderen Hafen oder ich beherberge Uri Komponente aus dem aktuellen Dokument.^[21]

Der dritte Parameter a Boolesche Der Wert, der angibt, ob die Anforderung asynchron ist oder nicht, ist kein erforderlicher Parameter durch den W3C -Entwurf. Der Standardwert dieses Parameters sollte angenommen werden, dass ein W3C -Benutzeragent toll ist, wenn er nicht bereitgestellt wird. Eine asynchrone Anfrage ("True") wartet nicht auf eine Serverantwort, bevor sie mit der Ausführung des aktuellen Skripts fortgesetzt wird. Es wird stattdessen aufrufen die OnreadyStatechange Event -Hörer des XMLHTTPrequest -Objekts in den verschiedenen Phasen der Anfrage. Eine synchrone Anfrage ("False") blockiert jedoch die Ausführung des aktuellen Skripts, bis die Anforderung abgeschlossen ist, wodurch die nicht aufgerufen wird onreadyStatechange Event -Hörer. Beachten Sie, dass beginnend mit Gecko 30.0 (Firefox 30.0 / Thunderbird 30.0 / Seamonkey 2.27), Blink 39.0 (Chrome) und Edge 13 synchrone Anfragen am Hauptfaden veraltet wurden der Benutzeroberfläche, während der Thread die Anfrage ausführt.

Die vierten und fünften Parameter sind die Nutzername und Passwort, beziehungsweise. Diese Parameter oder nur der Benutzername können für die Authentifizierung und Autorisierung bereitgestellt werden, falls vom Server für diese Anfrage erforderlich.

var xmlhttp; wenn (Fenster.Xmlhttprequest) {  xmlhttp = Neu Xmlhttprequest();  xmlhttp.offen("ERHALTEN", Dateipfad, FALSCH);  xmlhttp.senden(Null); } 

Das setRequestheader Methode

Bei erfolgreicher Initialisierung einer Anfrage die setRequestheader Die Methode des XMLHTTPrequest -Objekts kann auf Senden aufgerufen werden HTTP -Header mit der Bitte.

setRequestheader (Name, Wert)

Der erste Parameter dieser Methode ist der Text -Zeichenfolge -Name des Headers. Der zweite Parameter ist der Textzeichenwert. Diese Methode muss für jeden Header aufgerufen werden, der mit der Anfrage gesendet werden muss. Alle hier angeschlossenen Header werden beim nächsten Mal entfernt, wenn das nächste Mal offen Die Methode wird in einem W3C -konformen Benutzeragenten aufgerufen.

Das senden Methode

Um eine HTTP -Anfrage zu senden, die senden Die Methode der XMLHTTPrequest muss aufgerufen werden. Diese Methode akzeptiert einen einzelnen Parameter, der den mit der Anforderung zugesandten Inhalt enthält.

schicke Daten )

Dieser Parameter kann weggelassen werden, wenn kein Inhalt gesendet werden muss. Der W3C -Entwurf besagt, dass dieser Parameter jeder Typ sein kann, der der Skriptsprache zur Verfügung steht, solange er in eine Textzeichenfolge verwandelt werden kann, mit Ausnahme des DOM dokumentieren Objekt. Wenn ein Benutzeragenten den Parameter nicht serialisieren kann, sollte der Parameter ignoriert werden. Firefox 3.0.x und frühere Versionen werden jedoch eine Ausnahme auswerfen, wenn senden wird ohne Argument genannt.^[22]

Wenn der Parameter ein DOM ist dokumentieren Objekt, ein Benutzeragenten sollte sicherstellen InputScodierung Eigentum des dokumentieren Objekt. Wenn die Inhaltstyp Anforderungsheader wurde nicht durch hinzugefügt setRequestheader Es sollte jedoch automatisch von einem konformen Benutzeragenten als "Anwendung/XML; CharSet = hinzugefügt werdenCharset," wo Charset ist die Codierung, die zum Codieren des Dokuments verwendet wird.

Wenn der Benutzeragent für die Verwendung a konfiguriert ist Proxy ServerDas XMLHTTPREquest -Objekt ändert die Anforderung angemessen, um eine Verbindung zum Proxy anstelle des Originservers herzustellen und zu senden und zu senden Proxy-Autorisierung Header wie konfiguriert.

Das onreadyStatechange Event -Hörer

Wenn die offen Die Methode des XMLHTTPrequest -Objekts wurde mit dem dritten Parameter aufgerufen auf Stimmt Für eine asynchrone Anfrage die onreadyStatechange Der Ereignishörer wird für jede der folgenden Aktionen automatisch aufgerufen, die die verändern ReadyState Eigenschaft des XMLHTTPrequest -Objekts.

Zustandsänderungen funktionieren wie diese:

• Zustandsbeschreibung

   0 Die Anfrage wird nicht initialisiert. 1 Die Anfrage wurde eingerichtet. 2 Die Anfrage wurde gesendet. 3 Die Anfrage erfolgt. 4 Die Anfrage ist abgeschlossen.

• Nach dem offen Methode wurde erfolgreich aufgerufen, die ReadyState Die Eigenschaft des XMLHTTPrequest -Objekts sollte ein Wert von 1 (geöffnet) zugewiesen werden.
• Nach dem senden Die Methode wurde aufgerufen und die HTTP -Antwortheader wurden empfangen, die ReadyState Die Eigenschaft des XMLHTTPrequest -Objekts sollte ein Wert von 2 (Header_Reced) zugewiesen werden.
• Sobald der HTTP -Antwortinhalt zu laden beginnt, die ReadyState Die Eigenschaft des XMLHTTPrequest -Objekts sollte ein Wert von 3 (Laden) zugewiesen werden.
• Sobald der HTTP -Antwortinhalt das Laden beendet hat, ist der geladen ReadyState Die Eigenschaft des XMLHTTPrequest -Objekts sollte ein Wert von 4 (erledigt) zugewiesen werden.

Der Zuhörer reagiert nur auf staatliche Änderungen, die nach der Definition des Hörers auftreten. Um die Zustände 1 und 2 zu erkennen, muss der Hörer definiert werden, bevor die offene Methode aufgerufen wird. Die offene Methode muss aufgerufen werden, bevor die Send -Methode aufgerufen wird.

var Anfrage = Neu Xmlhttprequest(); Anfrage.onreadyStatechange = Funktion () {  var ERLEDIGT = Dies.ERLEDIGT || 4;  wenn (Dies.ReadyState === ERLEDIGT) {  Alarm(Dies.ReadyState);  } }; Anfrage.offen('ERHALTEN', 'sonpage.xml', Stimmt); Anfrage.setRequestheader("X-Eingereedelte", "Xmlhttprequest");  // sagt Server, dass dieser Anruf für Ajax -Zwecke getätigt wird.  // Die meisten Bibliotheken wie JQuery/Prototype/Dojo tun dies Anfrage.senden(Null);  // Es müssen keine Daten zusammen mit der Anfrage gesendet werden. 

Die HTTP -Antwort

Nach einem erfolgreichen und abgeschlossenen Anruf zum senden Methode der XMLHTTPrequest, wenn die Serverantwort war Gut geformtes XML und die Inhaltstyp Der vom Server gesendete Header wird vom User Agent als verstanden Internet -Medientyp Für XML die responsexml Die Eigenschaft des XMLHTTPrequest -Objekts enthält ein Dom -Dokument -Objekt. Eine andere Eigenschaft, Responsext Enthält die Antwort des Servers im Klartext eines konformen Benutzeragenten, unabhängig davon, ob er als XML verstanden wurde oder nicht.

Cross-Domain-Anfragen

In der frühen Entwicklung der Weltweites NetzEs wurde ermittelt, dass die Sicherheit der Benutzer durch die Verwendung von JavaScript zum Austausch von Informationen von einer Website mit einer anderen weniger seriösem ausgetauscht wurde. Alle modernen Browser implementieren daher a Gleiche Ursprungsrichtlinie das verhindert viele solcher Angriffe, wie z. Cross-Site-Scripting. XMLHTTPrequest -Daten unterliegen dieser Sicherheitsrichtlinie, aber manchmal möchten Webentwickler ihre Einschränkungen absichtlich umgehen. Dies ist manchmal auf die legitime Verwendung von Subdomains zurückzuführen, beispielsweise eine XMLHTTPrequest aus einer Seite, die von erstellt wurde foo.example.com Informationen von bar.example.com wird normalerweise scheitern.

Es gibt verschiedene Alternativen, um diese Sicherheitsfunktion zu umgehen, einschließlich der Verwendung JSONP, Cross-Origin-Ressourcenfreigabe (CORs) oder Alternativen mit Plugins wie z. Blinken oder Silberlicht (beide jetzt veraltet). Cross-Origin XMLHTTPrequest wird in der XMLHTTPREquest-Level-2-Spezifikation von W3C angegeben.^[23] Internet Explorer implementierte CORs erst mit Version 10. Die beiden vorherigen Versionen (8 und 9) boten eine ähnliche Funktionalität über die XDomainRequest (XDR) -API. CORS wird jetzt von allen modernen Browsern (Desktop und Mobile) unterstützt.^[24]

Das CORS -Protokoll weist mehrere Einschränkungen mit zwei Unterstützungsmodellen auf. Das einfach Das Modell erlaubt nicht, benutzerdefinierte Anforderungsheader und -abgabe festzulegen Kekse. Ferner nur der Kopf, Get und Post Anfordern von Methoden werden unterstützt und post nur die folgenden erlaubt MIME Typen: "Text/Plain", "Anwendung/x-www-urlencoded" und "Mehrfachfrist/Formdaten". Nur" Text/Plain "wurde ursprünglich unterstützt.^[25] Das andere Modell erkennt, wann einer der der nicht einfach Funktionen werden angefordert und sendet a Anfrage vor dem Flug^[26] zum Server, um die Funktion zu verhandeln.

Alternative holen

Der Programmfluss mit asynchronem XHR -Rückruf kann Schwierigkeiten mit Lesbarkeit und Wartung darstellen. ECMaskript 2015 (ES6) fügte die hinzu versprechen Konstruktion, um die asynchrone Logik zu vereinfachen. Browser haben seitdem die Alternative implementiert bringen() Schnittstelle, um die gleiche Funktionalität wie XHR zu erreichen Versprechen statt Rückrufe.

Fetch ist auch durch Whatwg standardisiert.^[27]

Siehe auch

• Websocket
• Repräsentationsstaatsübertragung (SICH AUSRUHEN)

Verweise

Externe Links

• Xmlhttprequest Living Standard bis zum Waswg
• XmlHttprequest Level 1 Entwurf von der W3c