[转]Ajax在Sun上的理论
[转]Ajax在Sun上的理论
http://developers.sun.com/prodtech/javatools/jscreator/reference/techart/2/ajax_overview.html
截取部份内容:
AJAX, which is growing rapidly in popularity, is a technique for creating improved web browser user interfaces for a web application. It is becoming so widely used that you probably have seen AJAX at web sites you have accessed, perhaps without even realizing it. AJAX can help increase the speed and usability of an application's web pages by updating only part of the page at a time, rather than requiring the entire page to be reloaded after a user-initiated change.
Furthermore, AJAX uses capabilities already present in modern web browsers and does not require any plug-ins. To better understand AJAX, let's look at a simple example of a web application that includes AJAX and then compare it with HTML and DHTML.
In summary, web application developers are also excited about AJAX is because it allows DHTML-like interactive web page techniques to be used with data requested from the server after user interactions with the page.
AJAX Technical Overview
There are many different tools and technologies for building web application including Java Studio Creator, PHP, J2EE, Ruby on Rails, DotNet, and others. AJAX can be used by all these communities because an AJAX web application only requires a modern web browser. AJAX is not tied to any specific tool, web application framework, or industry vendor. For these reasons a broad range of communities have an active interest in using AJAX. Let's now take a more technical look at AJAX.
First let's dive right in with a look at the steps to using AJAX in a web application.
Figure 3 shows the processing steps taken over time, from the user, browser, and server perspectives, for a web application with AJAX. The steps are numbered according to their sequence in time, with time increasing from top to bottom in the table.
These steps correspond to a scenario such as the one described for Google Suggest. They show how processing moves in a defined sequence among the server, browser, and user. Let's walk through these steps in the order they occur.
http://developers.sun.com/prodtech/javatools/jscreator/reference/techart/2/ajax_overview.html
截取部份内容:
What is AJAX?
AJAX, which is growing rapidly in popularity, is a technique for creating improved web browser user interfaces for a web application. It is becoming so widely used that you probably have seen AJAX at web sites you have accessed, perhaps without even realizing it. AJAX can help increase the speed and usability of an application's web pages by updating only part of the page at a time, rather than requiring the entire page to be reloaded after a user-initiated change.
Furthermore, AJAX uses capabilities already present in modern web browsers and does not require any plug-ins. To better understand AJAX, let's look at a simple example of a web application that includes AJAX and then compare it with HTML and DHTML.
AJAX and DHTML
A web application that uses DHTML can also offer an improved user experience over a simple HTML application. With DHTML we could easily pop-up a list of choices that update dynamically as the user types in an input field. Both AJAX and DHTML leverage the capabilities of JavaScript running in a web browser.
In summary, web application developers are also excited about AJAX is because it allows DHTML-like interactive web page techniques to be used with data requested from the server after user interactions with the page.
AJAX Technical Overview
There are many different tools and technologies for building web application including Java Studio Creator, PHP, J2EE, Ruby on Rails, DotNet, and others. AJAX can be used by all these communities because an AJAX web application only requires a modern web browser. AJAX is not tied to any specific tool, web application framework, or industry vendor. For these reasons a broad range of communities have an active interest in using AJAX. Let's now take a more technical look at AJAX.
First let's dive right in with a look at the steps to using AJAX in a web application.
Figure 3 shows the processing steps taken over time, from the user, browser, and server perspectives, for a web application with AJAX. The steps are numbered according to their sequence in time, with time increasing from top to bottom in the table.
|
These steps correspond to a scenario such as the one described for Google Suggest. They show how processing moves in a defined sequence among the server, browser, and user. Let's walk through these steps in the order they occur.
- Web server sends page with AJAX component
When a page includes AJAX then the AJAX-specific part is considered to be an AJAX component. An AJAX component corresponds to an HTML component, but it has enhanced AJAX processing in both the browser and the server. For Google Suggest, an HTML input component is enhanced to become what may be generically described as an "Auto-Complete Text Field" AJAX component.
- Browser displays web page with AJAX component
Although the display to the user at this point often is no different than the display for a non-AJAX component, JavaScript code for the page is waiting beneath the covers to play its part in the AJAX processing.
- User provides input to AJAX component in web browser
For our Google Suggest example, the user types "aja". Processing can happen as soon as the first letter is typed, or, as in the case of Google Suggest, quickly typed letters may be lumped together and sent as one request to the server to reduce server load.
- Browser runs JavaScript code to process user input
In this step, JavaScript processes the user inputs in the same way as for a page leveraging DHTML. These user inputs may result in JavaScript events. For example, a user types some text into an input field and this may invoke JavaScript events. In a web application with AJAX, these JavaScript events may request data from the server (described in the next step).
- Browser asynchronously requests data from server according to user input
JavaScript code running in the browser makes a call to the server that is asynchronous from the normal HTTP request response processing for the page. Typically the data request is based on the user's inputs. For the Google Suggest example, the data request includes the string "aja" typed by the user.
- Server processes and responds to browser request for data
The browser uses an HTTP or HTTPS URL to request data from the server. The server can implement an HTTP response by choosing from the many technologies and frameworks used in web applications. Typically the browser request includes parameters, such as "aja", and the server can use the request parameters to form a response. The server response data can be formatted in different ways, just like an HTTP response, and the server indicates the format by setting the "Content-Type" header. XML is a convenient response format for processing in the browser.
- Browser updates display using data received from server
In the Google Suggest example, JavaScript code processes the response returned from the server and uses that data to display the list of suggestions shown in Figure 1.
- User selects from the suggestions
In this scenario, the next step is that the user selects from the list displayed in step 7 or continues typing (as in step 3).
- Browser processes the user's selection and submits the page
JavaScript processes the user's selection: It sets the text field to the selection, closes the display of suggestions, and then, if this is the last field on the form as it is in this simple scenario, submits the page via a standard HTTP request. If there are additional fields on the form, which is the typical case, JavaScript continues to process these fields. In fact, inputs into one component may very well cause side effects that change the presentation of other components on the same page, all without a complete page refresh.
- Server responds to HTTP request
In the example, Google's server prepares a web page with search results based on the user's selection.
- Browser displays HTTP response
The search results page displays in the user's web browser. This is the last step in the scenario.
================================
/\_/\
(=^o^=) Wu.Country@侠缘
(~)@(~) 一辈子,用心做一件事!
--------------------------------
学而不思则罔,思而不学则怠!
================================
/\_/\
(=^o^=) Wu.Country@侠缘
(~)@(~) 一辈子,用心做一件事!
--------------------------------
学而不思则罔,思而不学则怠!
================================
posted on 2006-05-23 10:39 Wu.Country@侠缘 阅读(918) 评论(0) 编辑 收藏 举报