Ajax technology and Principle Analysis

Source: Internet
Author: User

Technologies included in Ajax
We all know that AJAX is not a new technology, but a combination of several original technologies. It is composed of the following technologies.
1. CSS and XHTML are used for representation.
2. Use the DOM model for interaction and dynamic display.
3. Use XMLHttpRequest to communicate with the server asynchronously.
4. Use JavaScript for binding and calling.

In the above technical procedures, apart from XMLHttpRequest objects, all other technologies are based on web standards and have been widely used. Although XMLHttpRequest has not yet been adopted by W3C, but it is already a standard of fact, because almost all mainstream browsers currently support it.

Ajax principles and XMLHttpRequest objects

The principle of AJAX is simply to use the XMLHTTPRequest object to send asynchronous requests to the server, obtain data from the server, and then use JavaScript to operate the Dom to update the page. The most critical step is to obtain request data from the server. To understand the process and principles, we must understand XMLHttpRequest.
XMLHttpRequest is the core mechanism of Ajax. It is first introduced in ie5. it is a technology that supports asynchronous requests. Simply put, JavaScript can promptly request and process responses to the server without blocking users. Achieve the effect of refreshing.
So let's start with XMLHttpRequest to see how it works.
First, let's take a look at the attributes of the XMLHTTPRequest object.
Its attributes include:
Onreadystatechange event processing triggered by each state changeProgram.
The string format of responsetext returned data from the server process.
Responsexml is a dom-compatible document data object returned by the server process.
Number returned by the server for statusCode, Such as common 404 (not found) and 200 (ready)
String information of the Status text accompanied by the status code
Readystate object status value
0 (not initialized) the object has been created, but has not been initialized (the open method has not been called)
1 (initialization) the object has been created and the send method has not been called
2 (send data) The send method has been called, but the current status and HTTP header are unknown.
3 (in data transmission) Some data has been received. Because the response and HTTP headers are incomplete, an error occurs when retrieving part of data through responsebody and responsetext,

4 (complete) After receiving the data, you can use responsexml and responsetext to obtain the complete response data.

Advantages of AJAX
The benefits brought to us by Ajax are basically profound experiences. Here I will only briefly talk about the following points:
1. The biggest difference is that the page is refreshed and communicates with the server on the page, providing a good user experience.
2. Use asynchronous mode to communicate with the server, without interrupting user operations, so as to have a more rapid response capability.
3. Some of the previous server workload can be transferred to the client, and the client's idle capabilities can be used to handle the workload, reduce the load on servers and bandwidth, and save space and bandwidth rental costs. In addition, it reduces the burden on the server. The Ajax principle is to "retrieve data on demand", which can minimize the burden on the server caused by redundant requests and responses.

4. Based on standardized and widely supported technologies, you do not need to download plug-ins or applets.

Disadvantages of AJAX
Next I will focus on the Ajax defects, because most of our daily attention is the benefits brought to us by Ajax, such as the improvement of user experience. The defects caused by Ajax are ignored.
The Ajax defects described below are inherent in nature.
1. Ajax kills the back button, which destroys the browser's back-up mechanism. The back button is an important feature of a standard web site, but it cannot cooperate well with Js. This is a serious problem caused by Ajax, because users often want to cancel the previous operation by going back. Is there any way to solve this problem? The answer is yes. If you have used Gmail, the Ajax technology used in Gmail solves this problem. You can withdraw from Gmail. However, it cannot change the Ajax mechanism either. It is just a stupid but effective method, that is, when the user clicks the back button to access the history, create or use a hidden IFRAME to reproduce changes on the page. (For example, when a user clicks back in Google Maps, it searches in a hidden IFRAME and then reflects the search result to the Ajax element, to restore the application status to the current state .)
However, although this problem can be solved, it brings about a very high development cost, which is different from the rapid development required by the Ajax framework. This is a very serious problem caused by Ajax.
2. Security Issues
Technology also brings new security threats to IT enterprises. Ajax technology is like establishing a direct channel for enterprise data. This allows developers to inadvertently expose more data and server logic than before. The Ajax logic can be hidden from the client's security scanning technology, allowing hackers to create new attacks from remote servers. There are also known security vulnerabilities that cannot be avoided by Ajax, such as cross-site scripting attacks, SQL injection attacks, and credentials-based security vulnerabilities.
3. weak support for search engines.
4. destroys the abnormal mechanism of the program. At least from the current perspective, Ajax frameworks such as Ajax. dll and ajaxpro. dll will destroy the program's exception mechanism. I have encountered this problem during the development process, but I have found that there is almost no relevant introduction on the Internet. Later, I did a test to delete a piece of data in Ajax and traditional form submission modes ...... It brings great difficulties to our debugging.
5. In addition, some other problems, such as violating the original intention of URL and resource positioning. For example, if Ajax technology is used, what you see under the URL address is different from what I see under the URL address. This is contrary to the original intention of resource positioning.
6. Some handheld devices (such as mobile phones and PDAs) cannot support Ajax yet. For example, when we open a website using Ajax technology on a mobile browser, it is currently not supported. Of course, this problem has nothing to do with us.

Related Article

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.