An analysis of Ajax technology and its principle

The technology that Ajax contains
We all know that Ajax is not a new technology, but a combination of several original technologies. It is a combination of the following technologies.
1. Use CSS and XHTML for presentation.
2. Use the DOM model for interactive and dynamic display.
3. Use XMLHttpRequest to communicate with the server asynchronously.
4. Use JavaScript to bind and invoke.
In the above technologies, all other technologies, except XMLHttpRequest objects, are based on web standards and have been widely used, and xmlhttprequest, though not yet accepted by the consortium, is a fact standard, Because almost all of the mainstream browsers now support it.

Ajax Principles and XMLHttpRequest objects
The principle of Ajax is simply to send an asynchronous request to the server via the XMLHttpRequest object, get the data from the server, and then use JavaScript to manipulate the DOM and update the page. One of the most critical steps is getting the request data from the server. To understand this process and principle, we must have an understanding of XMLHttpRequest.
XMLHttpRequest is the core mechanism of Ajax, which is introduced first in IE5 and is a technology that supports asynchronous requests. Simply put, JavaScript is the time to request and process responses to the server without blocking the user. No refreshing effect is achieved.
So let's start with XMLHttpRequest and see how it works.
First, let's look at the properties of the XMLHttpRequest object.
Its properties are:
onReadyStateChange the event handler for the event that triggers each state change.
ResponseText A string form that returns data from a server process.
Responsexml a DOM-compliant document data object returned from a server process.
Status number code returned from the server, such as common 404 (not Found) and 200 (ready)
Status Text string information accompanying the status code
ReadyState Object State Value
0 (uninitialized) object established, but not initialized (the open method has not been called)
1 (initialization) object established, send method has not been called
2 (send data) The Send method has been invoked, but the current state and HTTP headers are unknown
3 (data transfer) has received part of the data, because the response and HTTP headers are incomplete, then get some data through Responsebody and ResponseText error,
4 (complete) The data is received and the complete response data can be obtained by Responsexml and ResponseText.

The advantages of Ajax
The advantages that Ajax brings to us are basically deeply appreciated, and here I just briefly say a few things:
1, the biggest point is the page does not refresh, in the page with the server communication, to the user experience is very good.
2, the use of asynchronous way to communicate with the server, do not need to interrupt the user's operation, with more rapid response capabilities.
3, can put some of the previous server burden to the client, the use of idle client capacity to deal with, reduce the burden of server and bandwidth, save space and broadband rental costs. and reduce the burden on the server, the principle of Ajax is "on-demand data", can minimize redundant requests, and respond to the burden on the server.
4, based on standardized and widely supported technology, do not need to download plug-ins or small programs.

Disadvantages of Ajax
Here's what I'll focus on about Ajax flaws, because most of our attention is about the benefits that Ajax brings to us, such as the improvement of the user experience. And the drawbacks of Ajax are overlooked.
The Ajax flaws described below are inherent in this.
1, Ajax killed the back button, that is, the browser backward mechanism of the damage. The Back button is an important feature of a standard web site, but it does not work well with JS. This is a more serious problem with Ajax, because users often want to be able to undo the previous operation by backing back. So is there a way to do that? The answer is yes, Gmail to know that the following Ajax technology to solve this problem, under Gmail can be backward, but it does not change the AJAX mechanism, it is only a more stupid but effective way, that is, when the user clicks the Back button to access the history To reproduce changes on the page by creating or using a hidden iframe. (for example, when a user clicks back in Google Maps, it searches in a hidden iframe and then reflects the search results onto AJAX elements to restore the application state to its current state.) ）
But while this problem can be solved, the cost of development is very high, contrary to the rapid development required by the AJAX framework. This is a very serious problem brought by Ajax.
2, security issues
Technology also poses a new security threat to IT companies, and Ajax technology is like establishing a direct channel for enterprise data. This allows developers to inadvertently expose more data and server logic than before. Ajax logic can hide the security scanning technology of the client, allowing the hacker to create new attacks from the remote server. Ajax also makes it difficult to avoid some known security vulnerabilities, such as cross-site attacks, SQL injection attacks, and credentials vulnerabilities.
3, the search engine support is weaker.
4, the failure of the program's abnormal mechanism. At least for now, these Ajax frameworks, like Ajax.dll,ajaxpro.dll, can disrupt the program's exception mechanism. On this issue, I have encountered in the development process, but looked up the Internet almost no relevant introduction. Then I did a test myself, using Ajax and the traditional form submission model to delete a piece of data ... To our debugging has brought a lot of difficulties.
5, in addition, some other problems, such as the violation of the URL and resource positioning of the original intention. For example, I give you a URL address, if you use Ajax technology, perhaps you see below the URL address and I see under this URL address is different. This is a departure from the original purpose of resource orientation.
6, some handheld devices (such as mobile phones, PDAs, etc.) are not good enough to support Ajax, such as our mobile browser to open the use of AJAX technology site, it is currently not supported, of course, this problem and we do not have much relationship.