AJAX Application and Client Connectivity

AJAX is a superb technology but it has some sharp edges. Here are couple of things that I came across when developing AJAX enabled applications. Let's say that you have a page which sends request to the server using ASP.NET 2.0 Client Callbacks (Behind the scenes the client callbacks calls the XmlHttp object but in a different way as the request is still processed on the server side). The request is send using a HTML input button control.

protected void Page_Load(object sender, EventArgs e)

{

// register callbacks

RegisterCallbacks();

}

private void RegisterCallbacks()

{

string script = String.Empty;

string cbRef = ClientScript.GetCallbackEventReference(this, "arg", "callback", String.Empty);

if (!ClientScript.IsClientScriptBlockRegistered("CallServer"))

{

script = "function makeServerCall(arg,context) {" + cbRef + "}";

// inject the script

ClientScript.RegisterClientScriptBlock(this.GetType(), "CallServer", script, true);

}

}

public string GetCallbackResult()

{

System.Threading.Thread.Sleep(5000);   // only for demonstration purposes

return _argument;

}

public void RaiseCallbackEvent(string eventArgument)

{

_argument = eventArgument;

}

 

Here is the button code that actually makes the request:

<input type="button" value="Call Server" onclick="callServer()" />

function

callServer()

{

makeServerCall('Hello World','');

}

function

callback(response)

{

alert(response);

}

Everything works fine until the user got disconnected from the internet or the application server goes down. Now, the user presses the input button and nothing happens. No data is returned since the data is assigned at the server side and since there is no connection or server is down then there is no data returned. In this case the callback function is also not fired.

The question is how will you notify the user that nothing happened? How will you tell the user that "Hey! the user interface is dead!". I guess the answer is to notify the user that something has happened instead of notifying that something has not happened. The scenario that I discussed might be too vague for this example but consider a "School Testing Application" where the students are taking an online exam. They have 50-100 questions (multiple choice) and they select the answer. As, soon as the answer is selected the choice is saved in the database and a message is displayed "Successfully Saved!". If the message is not displayed then it means that there is some problem. You can also reload the page after every 5 minutes to get the fresh copy out of the database. This will put an extra protection of loosing unsaved answers. On the other hand if the user clicks two answers very quickly then there is a possibility that only one of them got saved. I have discussed this problem below:

Another common problem with using AJAX enabled applications is making two AJAX requests one after the other. This will cancel the first request and the later request will be made. In the code above I am purposely making the thread to sleep for 5 seconds now, if during that time another request comes then the old request will be killed. Dino Esposito also discussed this problem in his talk in DNR and he concluded that this is an architecture problem of ASP.NET framework.

What problems did you faced when developing an AJAX application and how did you solved it?

Print | posted @ Thursday, November 01, 2007 10:42 AM

Twitter