topic

Whether there are problems with safety at use AJAX?

If the user will choose browse mode of the initial text of HTML-page (view page source), he can see all JavaScript-scripts contained on this page as the usual text.

But JavaScript by default has no access to local file system if the user specially will not give such rights. AJAX-interaction can be carried out only with those server components which contain on the same server, the current web-page whence has been loaded. For AJAX-interactions with external services it is necessary to use proxy-patterns.

You should to be careful and not open model of the application so that at the unfair user the opportunity of reception of access to initial codes or decompiling of your server components has appeared. <In case of an exchange of the confidential information, it is necessary to think of use of report HTTPS for creation of the protected connection.

When it is necessary to use synchronous search instead of asynchronous?

At abbreviation AJAX knowingly there is a word "asynchronous". The synchronous search will block processing any events on page before reception of the answer from the server (as a matter of fact, in this case the browser will cease to react to any actions of the user before end of synchronous search). And I practically do not present, in what cases the synchronous search would be more preferable asynchronous.

How about applets and plugins?

Do not hurry up to refuse those parts of your application which use plug-ins or applets. Though AJAX and DHTML can carry out " drag and drop " and other actions with GUI, nevertheless for these technologies there are restrictions, is especial when it concerns support of browsers. Applets and plug-ins exist already for a long time and they for a long time can carry out searches similarly AJAX. Applets contain the big set of components GUI and have API which gives developers literally all.

Many ignore applets and plug-ins since for their initial initialization time is necessary at start of the application, and also there is no guarantee, that at the client version JVM is established necessary for job of the applet or a plug-in. Besides applets and plug-ins are not always capable to manipulate objects DOM on page.

However if your application will always work in an identical environment or you presume to yourselves dependence on the concrete version <JVM or the accessible version of a plug-in (as in case of a corporate environment), the decision on the basis of applets / plug-ins quite is proved.

One moment to which it is necessary to pay attention - sharing AJAX and applets / plugins. For example, Flickr uses a combination of AJAX/DHTML-interactions for marks of pictures and plugin for manipulations with separate photos and their sets.

If you develop own server components, it would be good, that they could work with both types of clients (AJAX/DHTML and the applet / plugin).

How to process pressing buttons " Back " and "Forward"?

Certainly, you can create own decision for tracking the current status of your application, but I recommend to leave it to experts. Dojo allows to execute navigation irrespective of a browser how it is shown in an example below:

function updateOnServer (oldId, oldValue, itemId, itemValue) {

var bindArgs = {

url: "faces/ajax-dlabel-update",

method: "post",

content: {"component-id": itemId, "component-value": itemValue},

mimetype: "text/xml",

load: function (type, data) {

processUpdateResponse (data);

backButton: function () {

alert (" old itemid was " + oldId);

forwardButton: function () {

alert (" forward we must go! ");

}

};

dojo.io.bind (bindArgs);

}

The resulted example will update value on the server with the help of a call dojo.io.bind (). Pay attention, that to the properties responsible for processing of events from buttons of a browser "Back" i "Forward", corresponding functions are appropriated{given}. You can restore value in oldValue or execute other necessary actions. All details of realization of how event from pressing the corresponding button of a browser is found out, it is latent from the developer inside library Dojo.

Link AJAX: How to Handle Bookmarks and Back Buttons contains details on the given problem and offers JavaScript-library Really Simple History framework (RSH), specializing only on questions back-and forward-navigation.

How with help AJAX to send the image?

In some applications, such as Google Maps to you can seem, that, during AJAX-interaction images are sent. Actually there is a following: as the answer to AJAX-search are sent URL images and the images which are taking place on it URL, then with help DHTML are inserted into the document.

In an example resulted below, as a result of AJAX-interaction the XML-document comes back and on the basis of his{its} data the table of categories is filled.

<cat-id> 1 </cat-id>

<name> Books </name>

<image-url> books_icon.gif </image-url>

</category>

<cat-id> 2 </cat-id>

<name> Electronics </name>

<description> Must have gadgets </description>

<image-url> electronics.gif </image-url>

</category>

</categories>

Pay attention, that the element image-url contains URL (site) of the graphic file representing the given category.

The Callback-method of the given AJAX-interaction will analyse the received XML-document and will call function addCategory () for each category present in this XML-document. Function addCategory () searches in a body of the document for the table "categoryTable" and adds in it{her} a line with the element - image.

...

function addCategory (id, name, imageSrc) {

var categoryTable = document.getElementById ("categoryTable");

var row = document.createElement ("tr");

var catCell = document.createElement ("td");

var img = document.createElement ("img");

img.src = ("images" + imageSrc);

var link = document.createElement ("a");

link.className = "category";

link.appendChild (document.createTextNode (name));

link.setAttribute ("onclick", " catalog? command=category*catid = " + id);

catCell.appendChild (img);

catCell.appendChild (link);

row.appendChild (catCell);

categoryTable.appendChild (row);

}

</script>

...

<table>

<tr>

</td>

</tr>

</table>

Pay attention, that src an element img the full way to a file of the image is set to attribute: "images" + imageSrc. The image will be loaded after the line with the specified img-element will be added in the table categoryTable. As a result of the subsequent HTTP-search the graphic file with URL "images/books_icon.gif" or "images/electronic_icon.gif" will be loaded