1、,版本:1.08/14/2023,课程介绍:AJAX介绍,课程目标,通过学习本课程,对Ajax的有一个总体的认识了解 Ajax 的产生背景了解 Ajax 的现实原理了解 Ajax 的特性,课程概要,Ajax 的实现原理Ajax 的相关概念Ajax 的应用样例,实现原理,传统 Web 交互模式,采用Form提交的模式与servlet进行交互,并刷新整个页面,重新获取页面数据。,基于Ajax的 Web 交互模式,JavaScript,HTTP Request,XML Data数据,HTML/CSS,Ajax交互模式与传统交互模式的对比,传统的基于HTML Form的交互模式传统交互模式的缺点Aja
2、x交互模式Ajax交互模式解决了传统交互模式的缺点,为用户带来了更好的交互体验,Ajax的优势,减轻服务器的负担。因为Ajax的根本理念是“按需取数据”,所以最大可能在减少了冗余请求和响影对服务器造成的负担 也可以把以前的一些服务器负担的工作转嫁到客户端,利于客户端闲置的处理能力来处理,减轻服务器和带宽的负担,节约空间和带宽租用成本更好的用户体验,无刷新更新页面,减少用户实际和心理等待时间基于标准化的并被广泛支持和技术Ajax使Web中的界面与应用分离(也可以说是数据与呈现分离)能提供同步、异步的请求方式,概念介绍,Ajax介绍,Ajax(Asynchronous JavaScript and
3、 XML)是一种概念,最初由Jesse James Garrett在一篇论文中提出论文:http:/采用的技术基于XHTML/CSS由DOM(Document Object Model)实现动态显示与交互通过XML和XSLT进行数据交换及处理使用XMLHTTPRequest对异步数据读取使用JavaScript整合上述技术,Ajax不是一种新技术,基于XHTML/CSS/JavaScript开发的复兴新瓶装旧酒客户端(浏览器端)技术的重新包装更加适合企业应用,与服务器端结合更加紧密不是某种具体的开发技术或者开发框架浏览器端一系列技术相结合的统称,Ajax核心技术,JavaScriptXMLHT
4、TPRequestvar req=new ActiveXObject(Microsoft.XMLHTTP)var req=new XMLHttpRequest()DOM(Document Object Model)HTML DOM(Level 0),Ajax的使用,Ajax的应用环境,This is a relatively new approach,our understanding of where Ajax can best be applied is still in its infancy.Jesse James GarrettAjax适合于那些对URL不敏感的web应用。如果一个应
5、用对URL的关心程度大于对交互特性关心程度,那么就不要考虑使用采用AJAX。Ajax不适用于所有地方,它的适用范围是由它的特性所决定的,AJAX适用于交互较多,频繁读数据,数据分类良好的WEB应用。,Ajax的应用场景,菜单级联树型组件DataWindow提交按钮(Email)信息查询省市县三级联动,Ajax存在的问题,一些手持设备(如手机、PDA等)现在还不能很好的支持Ajax;用JavaScript作的Ajax引擎,JavaScript的兼容性和DeBug都是让人头痛的事;Ajax的无刷新重载,由于页面的变化没有刷新重载那么明显,所以容易给用户带来困扰用户不太清楚现在的数据是新的还是已经更
6、新过的;现有的解决有:在相关位置提示、数据更新的区域设计得比较明显、数据更新后给用户提示等;对流媒体的支持没有FLASH、Java Applet好;,Ajax安全,JS的安全性JS是开源的,大量的运用JS会轻易的被攻击XMLHttpRequest安全性ActiveX安全DoS(拒绝服务)攻击,应用样例,Ajax应用(GoogleMaps),Ajax应用(列表提示),Ajax应用(三级联动),Ajax中间库,DWR,add a servlet declaration to web.xml Use dwr.xml to let DWR know what objects will receive
7、requests through the XMLHttpRequest object ApartmentDAO.countApartments(loadTotal,bedrooms,bathrooms,price)function loadTotal(data)document.getElementById(totalRecords).innerHTML=data;,JSF与Ajax,Using JavaServer Faces Technology with Ajax,在这篇文章中给出了在JSF中使用AJAX的三种策略Java BluePrints 在标准化过程中必须解决Ajax复杂性问题、
8、标准问题、不同浏览器执行的问题、编译以及开源等等问题IceFaces基于Sun JSF参考实现,与Ajax相结合,IceFaces中运用Ajax,Render kitsIceFaces使用Direct-to-DOM技术(暂未通过的专利)基于标准的JSF应用向IceFaces应用转移步骤:将普通的JSP转化为JSP Document(XML-compatible JSP)在web.xml中注册ICEfaces Servlets通过Direct-to-DOM技术使用AJAX使用IceFaces存在的问题非开源项目、使用混淆技术还不够成熟、不够稳定、在多语言支持方面还需要完善,Frameworks对Ajax的支持,相关网站,AJAX概念的提出:http:/Patterns:http:/ajaxpatterns.org/Main_Pagehttp:/,结论与启示,Ajax目前并不成熟许多公司、个人都提供了不同的实现。需要以非常清醒的头脑来做出选择。无论做出什么选择,目前来看,JavaScript编码能力还是需要的,Html、Dom的了解还是需要的Ajax的最大挑战并不是技术,主要挑战是如何使用 Ajax 设计应用程序建议参考各个厂商的Ajax实现,完成自己独立技术的Ajax引擎,小结,了解Ajax的实现原理Web发开带来的好处,Thank you,Neusoft Co.,Ltd.,谢谢,