1. AJAX and REST

2. What is AJAX? • It’s an acronym for Asynchronous JavaScript and XML • Although requests need not be asynchronous • It’s not really a single technology but several • HTML / CSS / DOM / XML • It’s used to dynamically update Web pages • or at least parts of them

3. What is AJAX? • It uses the HTTPRequest and HTTPResponse objects to • Make a server request from client JavaScript • And process the server-side response

4. AJAX (model) From W3Schools.com

5. AJAX Frameworks • Most vendors have their own AJAX abstraction layers • ASP has a script manager and an AJAX toolkit • It’s a layer on top of AJAX • There are several for PHP • Phery, CJAX, Quicknet • There are frameworks for Python, Perl, Ruby and others

6. RestFull APIs • These are generally available API that accept and execute AJAX requests • Yahoo has YQL • SQL-like queries are built into the URL (GET request) • I’ll show this in class

7. RestFull APIS • Google has a number of APIs • These use JSON typically • JSON is an alternative to moving the responses around as XML

8. AJAX (The Mechanics) • The XMLHttpRequest object is used to create a request • The request gets configured with the open method • The request gets sent with the send method • The responseText and responseXML properties store the returned information • Use the onreadystatechange event for async requests

9. AJAX XMLHttpRequest • The following creates the request • varreq = new XMLHttpRequest(); • The open method define the type of request • The first argument contains the method to use (GET or POST) • The second argument contains the URL • The third argument contains true (asynchronous) or false (synchronous) • The send method sends the request to the server

10. AJAX XMLHttpRequest (Example) • Create open and send a synchronous request

11. AJAX Response (Synchronous) • When the request completes, we get at the response through the following properties of the XMLHttpRequest object • responseText – gets the response data as a string • responseXML gets the response data as XML, which we can then parse using the DOM • This is the same DOM we talked about

12. AJAX Response (Synchronous)

13. AJAX Response (Asynchronous) • The onreadystatechanged event fires as the request progresses • Initialize • Loading • Loaded • Interactive • Completed • Status and status contain the result status information • 404 – not found / 200 success

14. AJAX Response (Asynchronous)

15. AJAX (jQuery) • As usual, jQuery makes the process simple

16. A Few Words about XML • It’s the extensible markup language • Data is frequently stored and transported as XML • It looks like XHTML 5 • Tags, attributes and elements • Nesting concepts are the same • However the tag and attribute names can be any valid name • .NET knows about them

17. A Few Words about XML • Sample XML document

18. REST • Acronym for Representational State Transfer • REST (restful Web services) is a way of exchanging HTTP requests and responses between client and server • It’s an alternative to Web Services and SOAP • It’s an alternative to Remote Procedure Calls (RPC)

19. REST • For read requests we • Send all data to the server via a URL and GET request • URLs are a logical location, rather than a physical resource • Data is typically returned as XML • It’s not a standard but a way of doing things • An architecture of style • YQL is restful

20. A Few Words about YQL • Yahoo Query Language • Implemented as a Web service, they maintain a number of tables • Finance • Geography and many more http://developer.yahoo.com/yql/guide/yql-opentables-chapter.html#

21. AJAX (References) • http://w3schools.com/ajax/default.asp • http://msdn.microsoft.com/en-us/library/bb924552.aspxhttp://developer.yahoo.com/yql/

22. HTML 5 • http://www.ibm.com/developerworks/library/x-html5/