Detailed explanation of how JavaScript gets server time, and detailed explanation of javascript

Detailed explanation of how JavaScript gets server time, and detailed explanation of javascript

This example describes how to obtain the server time using JavaScript. We will share this with you for your reference. The details are as follows:

Javascript is a script running on the client. We generally use new Date () to obtain the current time, but the client time is obtained and the client time is changed at will, if you want to implement a product release countdown, it will be a joke if the client time is changed. There are many other scenarios that require server time in the business. How can we get the server time through js alone? In fact, you only need an ajax request to get the current server time by reading the timestamp in the response header of the XMLHttpRequest object!

The principle is as simple as this: when sending a request to the server through ajax, the server can read the timestamp of the response header after receiving the request. The timestamp can be obtained no matter whether the request succeeds or fails. How can I determine if the server has received the request? After an ajax request is sent, the XMLHttpRequest status changes in step 5:

XMLHttpRequest. readyState Value	Meaning
0	Not initialized. An XMLHttpRequest object has been created but not initialized.
1	Not sent. The Code has called the xmlhttprequest open () method and xmlhttprequest is ready to send a request to the server.
2	Sent. A request has been sent to the server through the send () method, but no response has been received. You can read the response header information.
3	Receiving. The http Response Header has been received, but the message body has not been fully received.
4	Loaded and the response has been fully received

 

You can listen to the readystatechange event of XMLHttpRequest to determine the current status. From the table, we can see that when the XMLHttpRequest. readyState value is 2, you can read the response header and get the timestamp. The Code is as follows:

<P id = "time"> </p> <script> ajax () function ajax (option) {var xhr = null; if (window. XMLHttpRequest) {xhr = new window. XMLHttpRequest ();} else {// ie xhr = new ActiveObject ("Microsoft")} // request the current file xhr through get. open ("get", "/"); xhr. send (null); // listen for Request status changes xhr. onreadystatechange = function () {var time = null, curDate = null; if (xhr. readyState = 2) {// obtain the timestamp time in the Response Header = xhr. getResponseHeader ("Date"); console. log (xhr. getAllResponseHeaders () curDate = new Date (time); document. getElementById ("time "). innerHTML = "server time:" + curDate. getFullYear () + "-" + (curDate. getMonth () + 1) + "-" + curDate. getDate () + "" + curDate. getHours () + ":" + curDate. getMinutes () + ":" + curDate. getSeconds () ;}}</script>

At this point, the server time is obtained. In fact, the information in the response header is not only a timestamp, but xhr can be used. getAllResponseHeaders () is used to obtain information about the entire response header. The response header also contains the server type and version number, the requested file type and encoding, and other information (see section 1 ), can be read in this way. In order to prove that obtaining is indeed the server time, I tested it on my mobile phone (see figure 2). Currently, Beijing time is on July 22, April 20, 2015, and PC time is changed to on July 15, February 1, 2015.

Figure 1

 

Figure 2