Ajax / Rich Internet Applications ICW Lecture 21 Errol Thompson

Proposed learning Clarify the divide between client and server in web programming Expand understanding of client programming options – Asynchronous interaction options – Rich internet applications Thinking outside the box

The client / server divide What is the nature of A desktop application A browser based application A server-based application Is it possible to treat them as the same thing? If not, why not? If so, why and how?

Assumed knowledge – Protocols Transport protocol TCP/IP and sockets Application protocols smtp, http, https, ftp What did you have to implement with your browser? What do you expect the server to be doing?

Assumed knowledge – Static content What does it mean to have static content? What does the server have to do? What does the browser have to do What is the problem with static pages?

A scenario Jack want an application that will allow him to enter information about cyclists who enter his road race events. He wants it to be a web application as he wants to integrate the list with a system for commissaires to manage the race and for reporting race progress and results. Will this work with static pages? – Why or why not?

Dynamic content – Server based Where is the servlet or JSP code run? What does it do? What protocols are involved? What happens in the browser? Where is Javascript code run? What does Javascript do? What are its limitations?

Removing page reload - AJAX On what technologies and protocols is AJAX coding based? In what respect is it asynchronous? What type of requests can be made? How are responses to requests handled? What are the states that nee to be considered? Why check the status codes in a response? What do you need to do to have changes reflected on the web page? What is the impact of browser caching and how can it be resolved?

Transferring data How is parameter data passed to the server? ‘GET’ parameters ‘POST’ data How is data returned from the server? Is there any limitations on the data transferred? Why or why not?

Formatting data for transfer What data formats can be used? Anything that you can handle Write your own logic XML Work with a document object model (DOM) JSON (JavaScript Object Notation) Uses “normal” JavaScript

JSON Rider data {“rider”: [ { “number”, 231, “name”, “Fred Dagg”, “club”, “UofB Cycling Club”, “sponsor”, “” } ] };

Accessing JSON data var rider= eval(‘(‘ + request.responseText + ‘)’ ); var name = rider.rider[0].name; var number = rider.rider[0].number;.

Issues with AJAX How vulnerable is AJAX code to attack? How easy is it to maintain the DOM model? Is it possible to use other protocols with AJAX type coding? How compatible are browsers?

Application in the browser – Rich Internet Applications (RIA) Can we code for the browser in the same way that we can browse for the desktop? Flex/Flash, JavaFX, Silverlight What are the issues? Browser support Install of virtual machine (VM)

Cloud computing Applications accessible through the browser Configurable to individual customer needs Removes need for company to manage their own application servers

Breaking the boundaries The future of the browser Collaboration over the web Portability between desktop and mobile device Remove the boundaries between browser and desktop

Next time Review