Ajax introduction
- 1. AJAX • Asynchronous JavaScript And XML • AJAX is based on JavaScript and HTTP requests.
- 2. HISTORY • 1995 – Java Applets • 1996 – MS IE5 IFrame • 1999/2000 – MS IE5 XMLHTTP ActiveX Control • By 2004 – Other browsers - XMLHttpRequest object • 2005 – Google made it popular through google suggest, gmail and other apps • 2006 – W3C released the first draft specification
- 3. Technologies • HTML and CSS for marking up and styling information. • The DOM accessed with JavaScript. • The XMLHttpRequest (XHR) object is usually used for exchanging data asynchronously between browser and server. • Common data exchange formats include XML, pre- formatted HTML, plain text, and JSON.
- 4. Advantages • Page reload avoided to display same common content every time. • The use of asynchronous requests allows the client's Web browser UI to be more interactive and to respond quickly to inputs. • Reduce connections to the server. • State can be maintained throughout a web site.
- 5. Disadvantages • Browser's "back" button issue. • Difficult for a user to bookmark a particular state of the application. • Web crawlers do not execute JavaScript code, making it difficult to index public pages. • Browser that do not support Ajax or JavaScript, or simply have JavaScript disabled. • The Same origin policy prevents some Ajax techniques from being used across domains. • Testing for malicious attacks and debugging difficult.
- 6. XMLHttpRequest (XHR) • The open method – (type, url, async, user, password) • The setRequestHeader method – Content-Type, User-Agent, etc • The send method – Parameter content to be sent • The onreadystatechange event listener – readyState (1 for open, 2 for send, 3 for loading, 4 for complete) • The HTTP response – responseXML, responseText
- 8. Ajax Libraries • JQuery • ExtJs • Dojo • Prototype • GWT