1 / 11

Introducing Ajax: A New Approach to Web Applications

This article explores the birth of Ajax, its key features, and how it revolutionized web applications. It also delves into the concepts of HTTP, requests, and responses in the context of Ajax.

annal
Download Presentation

Introducing Ajax: A New Approach to Web Applications

An Image/Link below is provided (as is) to download presentation Download Policy: Content on the Website is provided to you AS IS for your information and personal use and may not be sold / licensed / shared on other websites without getting consent from its author. Content is provided to you AS IS for your information and personal use only. Download presentation by click this link. While downloading, if for some reason you are not able to download a presentation, the publisher may have deleted the file from their server. During download, if you can't get a presentation, the file might be deleted by the publisher.

E N D

Presentation Transcript

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

  2. Ajax is Born • February 2006 • Jesse James Garrett of Adaptive PathConceives 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 Wired • Intro to Ajax film clip Web Services – Summer 2007

  3. Frames • 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 Web Services – Summer 2007

  4. The Real Ajax • 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 Web Services – Summer 2007

  5. HTTP • Hypertext Transfer Protocol • Accepts requests from browser • Transfers responses to browser • Fetch web pages • but has many other uses • HTTPRequest format <request-line> <headers> <blank line> [<request body>] Web Services – Summer 2007

  6. HTTP Request • Many request types • GET and POST are of interest in Ajax • Example GET GET / HTTP/1.1 Host: www.wrox.com User-Agent: Mozilla/5.0 (Windows; U; Windows NT 5.1; en-US; rv:1.7.6) Gecko/20050225 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 Web Services – Summer 2007

  7. HTTP Request • 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&… Web Services – Summer 2007

  8. POST • POST Example POST / HTTP/1.1 Host: www.wrox.com User-Agent: Mozilla/5.0 (Windows; U; Windows NT 5.1; en-US; rv:1.7.6) Gecko/20050225 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 Web Services – Summer 2007

  9. 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 GET vs POST Web Services – Summer 2007

  10. HTTP Responses • Response format <status-line> <headers> <blank line> [<response-body>] • Example HTTP/1.1 200 OK Date: Sat, 31 Dec 2005 23:59:59 GMT Content-Type: text/html; charset=ISO8859-1 Content-Length: 122 Web Services – Summer 2007

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

More Related