4.10.1 XMLHttpRequest
4.10.1.1 XMLHttpRequest properties
  • XMLHttpRequest. Onreadystatechange triggered when the readyState attribute changes
  • XMLHttpRequest. ReadyState (read-only) returns the XHR agent in the state
value state describe
0 UNSENT The proxy is created, but the open() method has not yet been called.
1 OPENED The open() method has been called.
2 HEADERS_RECEIVED The send() method has been called and the header and state are available.
3 LOADING Download; The responseText property already contains some data.
4 DONE The download operation is complete.
  • Response (read-only) Returns the response body
  • ResponseText (read-only) returns all data returned by the back end
  • ResponseType An enumerated property that returns the type of the response data
value describe
“” When responseType is an empty string, the default type DOMString is used, the same as if it were text
arraybuffer Response is a JavaScript ArrayBuffer containing binary data
blob Response is a Blob object that contains binary data
document Response is either an HTML Document or an XML XMLDocument, depending on the MIME type of the data received. See HTML in XMLHttpRequest for more information on retrieving HTML content using XHR.
json Esponse is a JavaScript object. This object is obtained by parsing the received data type as JSON.
text Response is a text represented as a DOMString object.
  • XMLHttpRequest. ResponseURL (read only) to return to the serialized (serialized) the response of the URL, if the URL is empty, it returns an empty string.
  • XMLHttpRequest. ResponseXML (read only) to return a Document, which contains the request of the response, if the request is not successful, has not been sent, or could not be parsed as XML or HTML, it returns null.
  • Xmlhttprequest. status (read only) returns an unsigned short number representing the response status of the request.
  • XMLHttpRequest. StatusText (read-only) returns a DOMString, containing the HTTP server returns the response status. Unlike xmlHttprequest.status, it contains the complete response status text (for example, “200 OK”).
  • Timeout An unsigned long number that indicates the maximum time in milliseconds for a request. If this time is exceeded, the request will terminate automatically.
  • Upload (read only) XMLHttpRequestUpload, representing the upload progress.
  • WithCredentials A Boolean value (en-US) that specifies whether cross-domain Access-Control requests should carry authorization information, such as cookies or authorization headers.
4.10.1.2 XMLHttpRequest method
  • Absort () aborts the request immediately if it has already been issued
  • GetAllResponseHeaders () returns all crLF-delimited response headers as a string, or null if no response was received.
  • GetResponseHeader () returns a string containing the specified response header, or null if the response has not yet been received or the header does not exist in the response.
  • Open () initializes a request. This method can only be used in JavaScript code; to initialize the request in native code, use openRequest().
  • OverrideMimeType () overrides the MIME type returned by the server.
  • Send () Sends a request. If the request is asynchronous (the default), this method will return as soon as the request is sent.
  • SetRequestHeader () sets the value of the HTTP request header. The setRequestHeader() method must be called after open() but before send().
4.10.1.3 XMLHttpRequest event
  • Abort /onabort Is triggered when the request is stopped, such as when the program calls xmlHttprequest.abort ().
  • Error/onError This parameter is triggered when the request encounters an error.
  • Load/onLOAD XMLHttpRequest triggered when the request completes successfully.
  • Loadend/loadEnd is triggered when a request ends, whether the request succeeds (load) or fails (abort or error).
  • Loadstart/onLoadStart Is triggered when response data is received.
  • Progress/onProgress Fires periodically when the request receives more data.
  • Timeout /ontimeout Triggered when no response has been received within the preset time.
4.10.1.2 Creating an XmlHttpRequest Instance
let xhr; function createXhr(){ if(window.XMLHttpRequest){ xhr = new XMLHttpRequest(); // }else if(window.ActiveXObject){ xhr = new ActiveXObject("Microsoft.XMLHTTP"); //IE } }Copy the code
4.10.1.3 Sending HTTP and HTTPS Instances
xhr.open("get",url,true);
xhr.onreadystatechange = function(){
    if(xhr.readyState === XMLHttpRequest.DNOE && xhr.status === 200){
        console.log(xhr.responseText);
    }
}
xhr.send
Copy the code
4.10.1.3 Adding Events
Xhr. onabort = function(e){} xhr.addEventListener("abort",function(e){}) xhr.addEventListener("abort",handlerEvent) function handlerEvent(e){ }Copy the code