Summer 2007 Florida Atlantic University Department of Computer Science & Engineering COP 4814 – Web Services Dr. Roy Levow Part 1 – Introducing Ajax

February 2006 Jesse James Garrett of Adaptive Path Conceives alternative to Macromedia Flash using Asynchronous HTTP Request JavaScript XML Publishes ideas online Ajax: A New Approach to Web Applications See also article form June 2006 Wiredarticle Intro to Ajax film clipfilm clip Ajax is Born Web Services – Summer 2007

Introduced in HTML 4.0 Allow page to be loaded into portion of browser window Use discouraged in XHTML because of poor interaction with back button Hidden frame technique Use 1-pixel frame to contain form (thus hidden) Fill in form from JavaScript and submit Receive response asynchronously to update page Iframes Independent of frameset Go anywhere on page and can be hidden Frames Web Services – Summer 2007

On Browser Ajax Engine (JavaScript code) Generates display using HTML and CSS Receive JS calls from user intefface Sends HTTPRequest to Server Receives Data from Server Server Recieves HTTPRequest from Browser Interacts with local database Sends Data to Browser The Real Ajax Web Services – Summer 2007

Hypertext Transfer Protocol Accepts requests from browser Transfers responses to browser Fetch web pages but has many other uses HTTPRequest format [ ] HTTP Web Services – Summer 2007

Many request types GET and POST are of interest in Ajax Example GET GET / HTTP/1.1 Host: User-Agent: Mozilla/5.0 (Windows; U; Windows NT 5.1; en-US; rv:1.7.6) Gecko/ Firefox/1.0.1 Connection: Keep-Alive Get request for root node with HTTP version Originating client and information on client Request to maintain connection for more transfers HTTP Request Web Services – Summer 2007

Item following GET is path to page to load GET /index.html HTTP/1.1 Parameters can be appended to the url with URL?name1=value1&name2=value2&… HTTP Request Web Services – Summer 2007

POST Example POST / HTTP/1.1 Host: User-Agent: Mozilla/5.0 (Windows; U; Windows NT 5.1; en-US; rv:1.7.6) Gecko/ Firefox/1.0.1 Content-Type: application/x-www-form-urlencoded Content-Length: 40 Connection: Keep-Alive name=Professional%20Ajax&publisher=Wiley Adds Content-Type, Content-Length, and data POST Web Services – Summer 2007

GET vs POST GET Data coded and sent as part of URL Data visible (and modifiable) by user Use for smaller amount of data Slightly less transmission overhead POST Data sent separately from URL Invisible to user Can easily handle large amount of data Web Services – Summer 2007

Response format [ ] Example HTTP/ OK Date: Sat, 31 Dec :59:59 GMT Content-Type: text/html; charset=ISO Content-Length: 122 HTTP Responses Web Services – Summer 2007

200 (OK) – the one we want 304 (NOT MODIFIED) – used to check cached page 401 (UNAUTHORIZED) 403 (FORBIDDEN) 404 (NOT FOUND) Response Codes Web Services – Summer 2007