Get the response on the server side (obsolete)

Ajax status code

Each step in the process of creating an Ajax object, configuring an Ajax object, sending the request, and receiving the server-side response data corresponds to a value called the Ajax status code.

  • 0: The request is not initialized (open() has not been called)
  • 1: The request has been established, but has not yet been sent (send() has not been called)
  • 2: The request has been sent
  • 3: The request is being processed, usually with some data already available in the response
  • 4: The response is complete, and the server’s response can be retrieved and used
Xhr. readyState // Get the Ajax status codeCopy the code

The onreadystatechange event

This event is automatically triggered when the Ajax status code changes.

The difference between the two ways to get server-side responses

You are advised to use the onload event to improve execution efficiency.

Ajax error handling

Run xhr.status to obtain the HTTP status code. If the value is not 200, an error occurs.

  1. The network is smooth, the server can receive the request, and the result returned by the server segment is not the expected result.

You can judge the status code returned by the server and process it separately. Xhr. status Obtains the HTTP status code

  1. The server does not receive the request and returns the 404 status code.

Check if the address is wrong

  1. The network is smooth, the server can receive the request, and the server returns 500 status code.

Server side error, find back-end programmer to communicate

  1. The network is interrupted, and the request cannot be sent to the server.

The onError event below the XHR object is raised, and the error is handled in the onError event handler

Cache problems of Internet Explorer of earlier versions

Problem: In earlier versions of Internet Explorer, Ajax requests have a serious caching problem, meaning that only the first request is actually sent to the server without changing the address of the request, and subsequent requests are retrieved from the browser’s cache. Even if the data on the server is updated, the client still gets the old data in the cache.

Solution: Add request parameters after the request address to ensure that each request parameter value is not the same.

 xhr.open('get', 'http://www.example.com?t=' + Math.random());
Copy the code

Ajax asynchronous programming

Synchronous asynchronous concept

synchronous

  • A person can only do one thing at a time. Only when one thing is done can he do another thing.
  • To implement the code is to execute the next line of code after the previous line of code is completed, that is, the code is gradually executed.
console.log('before');
console.log('after');
Copy the code

asynchronous

  • When a person is halfway through doing one thing, he or she moves on to something else, and when the other things are done, he or she goes back to the unfinished work.
  • When it comes to code, the asynchronous code takes time to execute, but the program does not wait for the completion of the asynchronous code before continuing to execute the subsequent code. Instead, the program directly executes the subsequent code, and then looks back to see if the asynchronous code returns the result after the completion of the subsequent code execution. If it has returned the result, The prepared callback function is called to process the result of asynchronous code execution.
console.log('before'); setTimepit( () => { console.log('last'); }, 2000); console.log('after');Copy the code

Ajax encapsulation

Problem: Too much code to send one request, redundant and repetitive code to send multiple requests. Solution: Encapsulate the request code into a function that can be called when the request is sent.

ajax({ type: 'get', url: 'http://www.example.com', success: function (data) { console.log(data); }})Copy the code

Object to cover

The first argument is the object to be overwritten, and the second argument is the object to be overwritten.

Object.assign(defaults, options);
Copy the code