1 / 24

AJAX

AJAX. By Steven Hernandez Research Analyst NIATEC. Introduction. Who I am Education AAS Electronic Systems AAS Lasers and Electro-Optics BBA CIS from COB at ISU Currently working towards MBA in IA Experience Network Administration Desktop Support/Helpdesk Management

teo
Download Presentation

AJAX

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. AJAX By Steven Hernandez Research Analyst NIATEC

  2. Introduction • Who I am • Education • AAS Electronic Systems • AAS Lasers and Electro-Optics • BBA CIS from COB at ISU • Currently working towards MBA in IA • Experience • Network Administration • Desktop Support/Helpdesk Management • Systems Administration Consulting • Research Analyst

  3. NIATEC • National Information Assurance Training and Education Center • SFS: Scholarship for Service • Undergrads: Junior Rising or Candidates with 2 years remaining • Grad students – MBA • http://niatec.info/

  4. Goals and Objectives • Overview of AJAX • History • Technologies Involved • Limitations & Uses • Implementations • Basic Terms and Components • Basic Objects

  5. AJAX History Microsoft Remote Scripting • First to make use of asynchronous scripting • IFRAME based JSRS (2000) • Image/Cookie techniques (2000) • JavaScript on Demand (2002) • User-community mod to Remote scripting: • XMLHttpRequest • Asynchronous JavaScript and XML • Jesse James Garrett of Adaptive Path

  6. The Good • Interactive • Very GUI and fun to play with! • Very responsive • Supported by features found in all major browsers on most existing platforms • Examples of AJAX done right • Google Maps, Mail, and Suggest • http://www.flickr.com/

  7. The Bad • There’s no going back baby! • Back button functionality • Sessions and cookies work around this • Response time concerns • Network Latency Considerations • Feedback to the user • Preloading of data • Proper use of XMLHttpRequest • Devices

  8. The Ugly • JavaScript MUST be enabled! • Elaborate Error handling • Browser Handling • Learning Curve and Development • Early Stages • Sharp Learning Curve • Crafty use of CSS, DHTML, XML, XHTML, and JS • More of an Art than a Science at present

  9. Security Considerations • Securing AJAX • New technology • Client Side Processing • Federal Guidelines • Man in the Middle attacks

  10. Accessibility Considerations • WAI accessibility Guidelines • AJAX relies heavily on features present in desktop graphical browsers • If unable to use the AJAX interface • Would the page still be usable? • Performance? • Feel? • Content?

  11. Browsers Supporting AJAX • Microsoft IE 5.0 and above • (Mac OS versions Not supported) • Gecko based Browsers • Mozilla • Firefox • Netscape 7.1 and up • Khtml API • Konqueror 3.2 and up • Apple’s Safari 1.2 and up • Opera 8.0 and up

  12. Who’s Using AJAX • Google • Google Maps • Google Suggest • Google Mail • http://www.meebo.com/ • Online messenger system • http://www.flickr.com/ • Online Photo system • http://www.interaktonline.com/Products/KTML/Live-Demos/?from=ajax • Online webpage development

  13. AJAX Innards • HTML • JavaScript • DHTML • Dynamic HTML • DOM • Document Object Model

  14. HTML • Hypertext markup language • Build webforms • Identify Fields for use

  15. JavaScript • Core Code Running! • Facilitates communications with the server

  16. DHTML • Dynamic HTML • Helps update forms dynamically • Mostly “div” and “span”

  17. DOM • Document Object Model • Used through JavaScript • Used in heavy-duty Java and C/C++ • No worries • Used mostly for XML • Just know its out there • Another lecture in itself

  18. XMLHttpRequest • JavaScript Object • Heart of AJAX • Layer between Server and Client • Makes things “asynchronous” • Example: • Create a new XMLHttpRequest Object • <script language="javascript" type="text/javascript"> var xmlHttp = new XMLHttpRequest(); </script>

  19. JavaScript Functions • Common Example • // Get the value of the "phone" field and stuff it in a variable called phone var phone = document.getElementById("phone").value; // Set some values on a form using an array called response document.getElementById("order").value = response[0]; document.getElementById("address").value = response[1];

  20. Browser Considerations • Microsoft Internet Explorer • var xmlHttp = false; try { xmlHttp = new ActiveXObject("Msxml2.XMLHTTP"); } catch (e) { try { xmlHttp = new ActiveXObject("Microsoft.XMLHTTP"); } catch (e2) { xmlHttp = false; } }

  21. Browser Considerations • Mozilla/Firefox (Non-IE) • var xmlHttp = new XMLHttpRequest object;

  22. Multi-Browser Support • /* Create a new XMLHttpRequest object to talk to the Web server */ var xmlHttp = false; /*@cc_on @*/ /*@if (@_jscript_version >= 5) try { xmlHttp = new ActiveXObject("Msxml2.XMLHTTP"); } catch (e) { try { xmlHttp = new ActiveXObject("Microsoft.XMLHTTP"); } catch (e2) { xmlHttp = false; } } @end @*/ if (!xmlHttp && typeof XMLHttpRequest != 'undefined') { xmlHttp = new XMLHttpRequest(); }

  23. Conclusions • New Technology • Standards and common criteria are still in development • More of an art than a science • Beautiful interfaces and webpages • The future • AJAX.NET and similar

  24. Questions/Comments • Thanks!

More Related