Heim >Web-Frontend >js-Tutorial >Probleme mit asynchronen Ajax-Anfragen im XMLHttpRequest-Objekt

Probleme mit asynchronen Ajax-Anfragen im XMLHttpRequest-Objekt

一个新手
一个新手Original
2017-09-28 09:12:231431Durchsuche

XMLHttpRequestObjekt

1. XMLHttpRequest-Objekt

1 basiert auf XMLHttpRequest in JavaScript

2. Das XMLHttpRequest-Objekt ist ein abstraktes Objekt, das es Skripten ermöglicht, zurückgegebene eXML-Daten vom Server abzurufen oder Daten an den Server zu senden

5.

Sie müssen ein XMLHttpRequest-Objekt erstellen, bevor Sie

XMLHttpRequest verwenden, um Anfragen zu senden und Antworten zu verarbeiten

6.XMLHttpRequest ist kein W3C-Standard und kann erstellt werden Verwendung von JavaScript auf vielfältige Weise XMLHttpRequest-Instanz7.

In

IE wird XMLHttpRequest als ActiveX-Steuerelement implementiert, während andere Browser es als integriertes JavaScript-Objekt implementieren

2. XMLHttpRequest-Objekt erstellen1422626fe7510bebf8672f513a6a2cd1

3. XMLHttpRequest-Objekteigenschaften (aktuellen Status empfangen und anzeigen)1.readySate- Zeichnet den Status der zurückgegebenen Anfrage auf

.

0 – für die Initialisierung: Das Objekt wurde erstellt, die Einheit wurde initialisiert und die offene Methode wurde nicht aufgerufen;

1-Initialisierung: Das Objekt wurde erstellt, aber die Sendemethode wurde nicht aufgerufen, um die Anfrage zu senden

.

2-Daten senden: Die Sendemethode wurde aufgerufen, aber der HTTP-Header ist unbekannt.

3-Datenübertragung: Teildaten wurden akzeptiert, aber die Antwort ist unvollständig

.

4-Abgeschlossen: Die Datenannahme ist abgeschlossen und die vollständigen Rückgabedaten können zu diesem Zeitpunkt abgerufen werden 2.responseText-Empfangen Sie den Textinhalt der HTTP-Antwort des Clients

. Nur lesen

. Wenn

readySate 1/2 ist, ist der ResponseText-Wert eine leere Zeichenfolge

. Wenn

readyState 3 ist, werden die Antwortinformationen empfangen und sind noch nicht abgeschlossen

. Wenn

readyState 4 ist, bedeutet dies, dass die Antwortinformationen empfangen wurden

.

xmlHttp-Standard-Antwortdatenkodierung ist UTF-83.responseXML-Nachdem send() ausgeführt wurde, werden die zurückgegebenen Informationen in ein XML-Dokumentobjekt formatiert

. Der durch Content-Type angegebene MIME-Typ sollte text/HTML

sein. Wenn Content-Type diesen Typ nicht enthält, erhält ResponseXML beim Empfang von

einen Nullwert. 4. Status – Nachdem send() ausgeführt wurde, kann Status zum Lesen des Status von Dingen

. Lange ganzzahlige Daten

. Gibt den

HTTP-Statuscode

der aktuellen Anfrage zurück. Dieses Attribut wird nur verwendet, wenn

readyState 3 oder 4 ist, andernfalls tritt beim Lesen des Status

ein Fehler auf.

100 – Der Kunde muss die Anfrage weiter senden

.

200-Transaktion erfolgreich

.

400-Bad Request

.

403 – Anfrage nicht zulässig

.

404-Datei, Abfrage, URL

nicht gefunden.

Interner 500-Server-Fehler

. 502-Server ist vorübergehend nicht verfügbar

. 505 – Der Server unterstützt die HTTP-Version im Anforderungsheader nicht oder lehnt sie ab

5 Nachdem statusText-send() ausgeführt wurde, kann der Status des Dings über statusText

. Gibt die Statuszeile

der aktuellen

HTTP-Anfrage zurück. Dieses Attribut kann nur verwendet werden, wenn readyState 3 oder 4 ist, andernfalls tritt beim Lesen des Status

6 ein Fehler auf . Normalerweise wird der Name der Handlerfunktion

onreadystatechange zugewiesen, um die Ereignisbehandlung

für das XMLHttpRequest-Objekt anzugeben. Führen Sie in der Ereignisverarbeitungsfunktion die entsprechende Verarbeitung

basierend auf dem Statuswert von

readyState durch. Beispiel:

4. XMLHttpRequest-Objektmethode (dynamische Verarbeitung verschiedener Informationen: Senden und Empfangen von Daten, Verarbeitung von Anfragen und Antworten usw.)

1.abort()-terminate der aktuelle Vorgang
function test(){
xmlHttp.onreadystatechange=showInfo;
var url=”/ajax/urlInfo”;//请求路径
xmlHttp.open(“GET”,url,true);
xmlHttp.send(null);
}
Function showInfo(){
If(xmlHttp.readyState==4){
alert(“success”);
}
}

. Stoppen Sie die vom

XMLHttpRequest-Objekt gestellte HTTP-Anfrage und stellen Sie das Objekt in seinem ursprünglichen Zustand wieder her

2.open()-xmlHttp.open(method,url,mode,user,pwd)

. Erstellen Sie eine neue

HTTP-Anfrage und geben Sie die Anfragemethode, URL, Verifizierungsinformationen usw. an.

. Methode: POST, GET, PUT (Groß-/Kleinschreibung kann ignoriert werden)

. URL: Angefragte Zieladresse

. Modus: Gibt an, ob die Anforderung asynchron ist. Der Standardwert ist „true“. Wenn sich der Status ändert, wird die durch das Attribut „onreadystatechange“ angegebene Verarbeitungsfunktion

aufgerufen. Nach dem Aufruf von open() setzt das XMLHttpRequest-Objekt das Attribut readyState auf 1, stellt die Anfangswerte von ResponseText, ResponseXML, Status, StatusText und anderen Attributen wieder her und setzt die Anforderungsheaderinformationen zurück

Aufrufe Wenn open(), readyState 4 ist, setzt das XMLHttpRequest-Objekt den obigen Wert zurück

3.send()-xmlHttp.send(content) . Senden Sie eine Anfrage an den Server und akzeptieren Sie die Antwort

4.setRequestHeader()-setRequestHeader(header, value)

. Legen Sie die

HTTP-Header-Informationen

individuell für eine Anfrage fest. Wenn readyState 1 ist, kann diese Methode nach send() aufgerufen werden, andernfalls wird eine Ausnahme

zurückgegeben. Wenn bereits ein HTTP-Header mit diesem Namen vorhanden ist, werden die ursprünglichen Informationen mit

überschrieben. Header-Header-Name: Zeichenfolgentyp

. Wert – Der Wert des Header-Namens: Zeichenfolgentyp

5.getResponseHeader() – Liest den Header der vom Server gesendeten Nachricht

.

HEAD-Anfragen ignorieren Inhalte, daher sind ihre Antworten kleiner als Antworten auf GET oder POST

Inhalt abrufen:

.

Inhaltstyp: Inhaltstyp

. Inhaltslänge: Inhaltslänge

. Last-Modify: Das Datum der letzten Änderung

. Beispiel: Funktion getHeadInfo() {

. Beim Abrufen von Header-Informationen können nicht alle Informationen abgerufen werden

6.getAllResponseHeaders()-Alle Header-Informationen abrufen
if(xmlHttp.readyState==4){
if(headeyType==”Content-Type”){
window.alert(“Content-Type:”+xmlHttp.getResponseHeader(“Content-Type”);
}
else if(headType==”Content-Length”){
window.alert(“Content-Length:”+xmlHttp,getResponseHeader(“Content-Length”);
}
else if(headType==”Last-Modify”){
window.alert(“Last-Modify:”+xmlHttp.getResponseHeader);
}
}
}

。在获取时只用HEAD即可获取

。例:fuction headRequest(){

creatXMLHttpRequest();
xmlHttp.onreadystatechange=getHeadInfo;
xmlHttp.open(“HEAD”,”url”,false);
xmlHttp.send(null);
}
function getHeadInfo(){
if(readyState==4){
Alter(xmlHttp.getAllResponseHeaders());
}

Das obige ist der detaillierte Inhalt vonProbleme mit asynchronen Ajax-Anfragen im XMLHttpRequest-Objekt. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Stellungnahme:
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn