Home > Article > Backend Development > Examples to explain the basic knowledge of HTTP messages and ajax
This article will explain the basic knowledge of HTTP messages and ajax with examples. The content passed by the client to the server and the content passed by the server to the client are both HTTP messages. Ajax is a method in client JS that is used to send requests to the server. This article will share with you the basic knowledge of HTTP messages and ajax. Friends who are interested should take a look.
HTTP message
The content passed by the client to the server and the content passed by the server to the client belong to the HTTP message
Starting line: Request starting line Response start Starting line
Header: Request header Response header Common header (both request and response) Custom header
Body: Request body Response body
The client passes it to the server Terminal data:
The question mark after the request URL is used to pass parameters to the server /getList?name=zhangsan&age=7
Set the header of the request (set the request header information)
Set the request body and put the content passed to the server in the request body and pass it to the server
Data passed from the server to the client:
Set the response header information
Set the response Main content
Ajax: async javascript and xml Asynchronous JS and XML (extensible markup language, the tags used in the XML file are all extended by themselves, using their own extended regular tags to store relevant Data)
Ajax is a method in client JS, used to send requests to the server (can also be passed to server-side data), and then obtain the content returned by the server (Ajax is generally run on in the client's browser).
Ajax four steps:
Create an Ajax object (the following writing method is not supported in IE6 and lower browsers)
var xhr = new XMLHttpRequest;
Basics before sending Information configuration: configure the request method (GET, POST, PUT, DELETE, HEAD...)
Open a URL address (configure which server address to send the request to)
Synchronous or asynchronous ( true represents asynchronous, false represents synchronous, the default is true)
[username] Provides the requested user name to the server
[userpass] Provides the requested user password to the server. These two values are generally neither Write, only if the server has implemented security restrictions and only allows specific users to access, we will pass it
xhr.open('get',"/data.txt",false,[username],[userpass]);
Bind a method to the onreadystatechange event to listen for state changes (as long as the state changes, the method will be triggered Execution)
xhr.onreadystatechange = function(){
The parameter configuration before sending has been completed)
2 headers_received The response header information has been accepted
3 loading The main returned content is being prepared for processing on the server side
4 done The response body The content has been successfully returned to the client
xhr.status: HTTP network status code, describing the status of the server response content
200 OR ^2\d{2} (200 or starting with 2 ) -> It means that the content of the response body has been returned successfully
301 Permanent redirection/permanent transfer
302 Temporary redirection/temporary transfer server load balancing
304 The content obtained this time is to read the data in the cache
400 There is an error in the parameters passed by the client to the server
401 No permission to access
404 The client accessed The address does not exist
500 Unknown server error
503 The server has been overloaded
if(xhr.readyState===4 && /^2\d{2}$/.test(xhr.status)){ var val = xhr.responseText; } }
Send the request: The parameter is the content passed to the server in the request body
xhr.send(null);
Related recommendations:
Detailed explanation of the example of setting the http message header by the PHP header function
Comprehensive summary of related methods based on ajax in jQuery
The above is the detailed content of Examples to explain the basic knowledge of HTTP messages and ajax. For more information, please follow other related articles on the PHP Chinese website!