web应用开发报告.ppt
![资源得分’ title=](/images/score_1.gif)
![资源得分’ title=](/images/score_1.gif)
![资源得分’ title=](/images/score_1.gif)
![资源得分’ title=](/images/score_1.gif)
![资源得分’ title=](/images/score_05.gif)
《web应用开发报告.ppt》由会员分享,可在线阅读,更多相关《web应用开发报告.ppt(83页珍藏版)》请在得力文库 - 分享文档赚钱的网站上搜索。
1、2HTMLCSS层叠样式表(Cascading Style Sheets)精确定位和布局增强HTML页面的表现力示例:body background: grey; 3HTML DOM 文档对象模型(Document Object Model) 动态修改网页结构 改善页面交互性 与平台无关4HTML JavaScript 网页脚本语言 动态操作网页元素 改善用户界面 有安全限制 兼容性问题 基于DOM模型5AJAX AJAX是什么 超文本标记语言AJAX即“Asynchronous JavaScript and XML”(异步JavaScript和XML),AJAX并非缩写词,而是由Jesse
2、James Gaiiett创造的名词,是指一种创建交互式网页应用的网页开发技术。 AJAX 是一种独立于 Web 服务器软件的浏览器技术。 Ajax的核心是JavaScript对象XmlHttpRequest。该对象在Internet Explorer 5中首次引入,它是一种支持异步请求的技术。简而言之,XmlHttpRequest使您可以使用JavaScript向服务器提出请求并处理响应,而不阻塞用户。6AJAX是多种技术组合AJAX并非一种新的技术,而是几种原有技术的结合体。它由下列技术组合而成。 1.使用CSS和XHTML来表示。 2. 使用DOM模型来交互和动态显示。 3.使用XMLH
3、ttpRequest来和服务器进行异步通信。 4.使用javascript来绑定和调用。在上面几中技术中,除了XmlHttpRequest对象以外,其它所有的技术都是基于web标准并且已经得到了广泛使用的,XMLHttpRequest虽然目前还没有被W3C所采纳,但是它已经是一个事实的标准,因为目前几乎所有的主流浏览器都支持它。7AJAX应用意义 AJAX不是一种新的编程语言,而是一种用于创建更好更快以及交互性更强的 Web 应用程序的技术。 通过AJAX,您的JavaScript可使用JavaScript的XMLHttpRequest对象来直接与服务器进行通信。通过这个对象,您的JavaSc
4、ript可在不重载页面的情况与Web服务器交换数据。 AJAX 在浏览器与 Web 服务器之间使用异步数据传输(HTTP 请求),这样就可使网页从服务器请求少量的信息,而不是整个页面。 AJAX 可使因特网应用程序更小、更快,更友好。8AJAX.JS简介1function Ajax()this.nameArray = new Array(0);this.valueArray = new Array(0);this.xmlHttp;this.method = GET;this.url;this.asyn = true;this.callback;this.extraArray = new Arr
5、ay();Ajax.prototype.setParameter = function(a,b)this.nameArray.push(a);this.valueArray.push(b);Ajax.prototype.setCallback = function(a)this.callback = a;9AJAX.JS简介2Ajax.prototype.setMethod = function(a)this.method = a;Ajax.prototype.setUrl = function(a)this.url = a;Ajax.prototype.setAsyn = function(
6、a)this.asyn = a;Ajax.prototype.sendRequest = function().10HTML 5 HTML5是什么 HTML5是用于取代1999年所制定的 HTML 4.01 和 XHTML 1.0 标准的 HTML 标准版本 广义论及HTML5时,实际指的是包括HTML、CSS和JavaScript在内的一套技术组合。它希望能够减少浏览器对于需要插件的丰富性网络应用服务(plug-in-based rich internet application,RIA),如Adobe Flash、Microsoft Silverlight,与Oracle JavaFX的需
7、求,并且提供更多能有效增强网络应用的标准集 强化了 Web 网页的表现性能 追加了本地数据库等 Web 应用的功能 仍处于发展阶段,但大部分浏览器已经支持某些 HTML5 技术11HTML 5优点 提高可用性和改进用户的友好体验 自适应网页设计,解决了传统的一种局面网站为不同的设备提供不同的网页,比如专门提供一个mobile版本,或者iPhone / iPad版本 有几个新的标签,这将有助于开发人员定义重要的内容 可以给站点带来更多的多媒体元素(视频和音频) 可以很好的替代FLASH和Silverlight 当涉及到网站的抓取和索引的时候,对于SEO很友好 将被大量应用于移动应用程序和游戏12
8、HTML 5发展趋势HTML5规范开发完成时,将成为主流。据统计2013年全球将有10亿手机浏览器支持HTML5,同时HTML Web开发者数量将达到200万。毫无疑问,HTML5将成为未来5-10年内,移动互联网领域的主宰者。据IDC的调查报告统计,截至2012年5月,有79%的移动开发商已经决定要在其应有程序中整合HTML5技术。2012年12月,万维网联盟宣布已经完成对HTML5标准以及Canvas 2D性能草案的制定,这就意味着开发人员将会有一个稳定的“计划和实施”目标。有很多的文章都在号召使用 HTML5,并大力宣传它的的好处。此前,站长之家曾经做过一期调查,调查显示只有36.16%
9、的站长正在学习中,另外的63.76%表示正在观望中。从性能角度来说,HTML5首先是缩减了HTML文档,使这件事情变得更简单。第一,从用户可读性上说,原先一大堆东西,像初学者第一次看到这些东 西是看不懂的,而HTML5的声明方式对用户来说显然更友好一些。13支持HTML 5的浏览器 支持Html5的浏览器包括Firefox(火狐浏览器),IE9及其更高版本,Chrome(谷歌浏览器),Safari,Opera等;国内的傲游浏览器(Maxthon),以及基于IE或Chromium(Chrome的工程版或称实验版)所推出的360浏览器、搜狗浏览器、QQ浏览器、猎豹浏览器等国产浏览器同样具备支持HT
10、ML5的能力。14WEB应用 Web客户端 浏览器 移动程序 桌面程序 Web组件 Servlet JSP页面 Web服务端点15WEB服务器 部署Web应用(Web容器) 请求调度 安全性 并发性 生命周期管理 命名JNDI等 Weblogic、Websphere、Tomcat、JBoss16WEB模块17WEB模块 上下文根(context root):标识Web应用,在部署Web模块时指定。必须以/作为开始,并以一个字符串作为结束。 Web.xml:Web应用部署描述符。包含Servlet、过滤器或监听器等配置。 *.tld:标签库描述符文件。 classes:包含服务器端类及程序包目录
11、:Servlet、工具类和JavaBeans组件。 tag:包含标签文件的目录,这些标签文件是标签库的实现。 lib:包含由服务器端类所调用库的jar文件。 可全部打包为.war文件。 同一个Web模块在不同的Web服务器上部署方法并不一样。18Servlet 动态处理请求和构建响应 适合面向服务的应用的服务端点 适合面向表示的应用的控制功能 是所有Java Web应用技术的基础19Servlet生命周期 所有的Servlet必须实现Servlet接口(定义了生命周期方法)。 GenericServlet类:service()方法 HttpServlet类:doGet()、doPost()方法
12、 Servlet的加载: 某个请求被映射到某个Servlet。 如果该Servlet的实例不存在,则创建一个实例。 调用init方法来初始化Servlet实例。 调用service方法,传递请求和响应对象。 并发性:同一个Servlet实例同时响应多个请求。20Servlet处理过程以HttpServlet.doPost()为例:从HttpServletRequest请求对象获取请求参数。String param = request.getParameter(param);执行业务处理。从HttpServletResponse响应对象获取一个输出流。PrintWriter out = resp
13、onse.getWriter();以HTML格式输出业务处理结果。out.println(“”);HttpServletResponse响应对象可以通过HTTP响应头给客户端浏览器设置Cookie。21Servlet地位在MVC架构中,处理C端,即控制端。MVC是一个框架模式,它强制性的使应用程序的输入、处理和输出分开。使用MVC应用程序被分成三个核心部件:模型、视图、控制器。它们各自处理自己的任务。最典型的MVC就是JSP + servlet + javabean的模式。22MVC简介视图视图是用户看到并与之交互的界面。对老式的Web应用程序来说,视图就是由HTML元素组成的界面,在新式的W
14、eb应用程序中,HTML依旧在视图中扮演着重要的角色,但一些新的技术已层出不穷,它们包括Adobe Flash和像XHTML,XML/XSL,WML等一些标识语言和Web services.MVC好处是它能为应用程序处理很多不同的视图。在视图中其实没有真正的处理发生,不管这些数据是联机存储的还是一个雇员列表,作为视图来讲,它只是作为一种输出数据并允许用户操纵的方式。6模型模型表示企业数据和业务规则。在MVC的三个部件中,模型拥有最多的处理任务。例如它可能用像EJBs和ColdFusion Components这样的构件对象来处理数据库,被模型返回的数据是中立的,就是说模型与数据格式无关,这样一
15、个模型能为多个视图提供数据,由于应用于模型的代码只需写一次就可以被多个视图重用,所以减少了代码的重复性。6控制器控制器接受用户的输入并调用模型和视图去完成用户的需求,所以当单击Web页面中的超链接和发送HTML表单时,控制器本身不输出任何东西和做任何处理。它只是接收请求并决定调用哪个模型构件去处理请求,然后再确定用哪个视图来显示返回的数据。23MVC优劣优点 耦合性低 重用性高 生命周期成本低 部署快 可维护性高 有利软件工程化管理24MVC优劣缺点 没有明确的定义 不适合小型,中等规模的应用程序 增加系统结构和实现的复杂性 视图与控制器间的过于紧密的连接 视图对模型数据的低效率访问 一般高级
16、的界面工具或构造器不支持模式25过滤器过滤器(Filter)是一种可以对请求或响应的报头和主体内容进行转换的对象。本身通常不负责创建响应,但可以提供“附加”到任何Web资源的功能。主要功能: 查询请求并进行相应的操作。 阻塞请求响应对,使其不能进一步被传递。 修改其请求报头和数据。 修改响应报头和数据。 和外部资源进行交互。过滤器链由零个、一个或多个按照特定顺序的过滤器组成。26过滤器常见用途:认证、审计、转码、压缩、加密等。过滤器由容器进行实例化、初始化和销毁。Web容器使用过滤器映射来决定如何将过滤器应用到Web资源。过滤器映射通过名称将过滤器与Web组件相匹配,或者是通过URL模式将过滤
17、器与Web资源相匹配。过滤器映射在web.xml中进行定义。用户可将过滤器映射到一个或多个Web资源中,并且可以将多个过滤器映射到一个Web资源。27JSP 静态HTML内容和动态内容的混合体。 能实现Servlet技术的动态功能。 可嵌入访问服务器端对象的表达式语言(EL) 可扩展JSP语言的定义(JSTL和TagLib) 直接支持使用JavaBeans组件 可嵌入Java代码()。 主要承担UI功能。28JSP执行过程29JSP 特性 统一表达式语言EL 动态读取在JavaBeans组件、各种数据结构和隐式对象中保存的应用数据。 动态写入数据到JavaBeans组件中。 调用任意的静态和公
18、共方法。 动态执行算术运算。30JSP 特性标签库调用公共功能,代码重用。增强可维护性提高效率和质量标准标签库(JSTL)31JSP 特性 隐式对象 pageContext:针对JSP页面的上下文。 servletContext:针对JSP页面servlet,以及任何在同一应用中包含的Web组件的上下文。 session:针对客户端的会话对象。 request:触发JSP页面执行的请求。 response:JSP页面所返回的响应。32JSP与Servlet、Filter JSP输入业务数据 Servlet、Filter作为控制层,调用业务服务类完成业务处理功能。 JSP输出处理结果33JDBC
19、 JDBC即Java数据库连接(Java Database Connectivity),一组可执行SQL语句的API。 可跨平台,跨数据库(标准SQL)。 JDBC 基本功能 连接数据库 执行SQL语句 获得执行结果34JDBC驱动程序 JDBC API是一组标准接口,实现类由各数据库厂商的JDBC驱动程序实现。 JDBC驱动程序通常是一组.jar文件。35JDBC访问 JDBC访问示意图36JDBC API DriverManager用于管理JDBC驱动的服务类。主要功能是获取Connection对象。 Connection数据库连接对象,代表一个物理连接会话。它的常用功能是创建Statem
20、ent、PreparedStatement、CallableStatement对象,以及事务控制等。 Statement用于执行SQL语句的接口。可以执行查询、更新、DDL等语句。执行查询时结果集由ResultSet对象返回。37JDBC API PreparedStatement预编译的Statement对象。是Statement的子接口。 ResultSet接收SQL查询结果集。类似于一个游标,通过移动记录指针获得行和列数据。 CallableStatement执行存储过程。38JDBC样例Class.forName(“com.ibm.db2.jcc.DB2Driver”);Connect
21、ion conn = DriverManager.getConnection(“jdbc:db2:/127.0.0.1:50000/test_db”, ”user”, ”passwd”);Statement st = conn.createStatement();ResultSet rs = st.executeQuery(“SELECT userid,name FROM sys_user”);while (rs.next() System.out.println(rs.getString(“userid”) + “:” + rs.getString(“name”);rs.close();st
22、.close();conn.close();39连接池数据库连接的建立和关闭极耗资源,性能影响极大。连接池由容器管理,各应用程序共享连接。容器根据配置和实际需要自动创建、分配、关闭连接。通过DataSource接口获取连接。String jndiName = java:comp/env/jdbc/test_db“;InitialContext ctx = new InitialContext();DataSource ds = (DataSource) ctx.lookup(jndiName);Connection conn = ds.getConnection();/释放数据库连接,归还连接
23、池。conn.close();DBCP、C3P0连接池40Struts 2 MVC架构 视图层(View) 控制层(Controller) 模型层(Model) 源于WebWork,并非Struts 141Model 1 架构42Model 2 架构43WebWork 流程44Struts 2 架构45Struts 2 流程 浏览器发送请求,例如/mypage.do。 核心控制器根据请求调用合适的Action。 拦截器链自动对请求应用通用功能。例如验证、文件上传等。 回调Action的execute方法。该方法可以获得请求参数,调用业务类处理请求。execute方法返回一个字符串。 Actio
24、n的返回结果被转发到相应的视图。可以是HTML、JSP、图像或其他文档,甚至是另一个Action。视图层支持多种模板技术。46Struts 2 配置示例(ACTION)public String listCustomWarnRepairDetail() throws SQLException, ExceptionlistCustomWarnRepairDetail = this.getCustomWarnService().listCustomWarnRepairDetail(customWarnDetailDto);mapMachineTypeAndName = new MachineTyp
25、eService(this.getConnection().getDao().mapIdAndName();mapFModuleCodeAndName = new FModuleService(this.getConnection().getDao().mapIdAndName();mapZModuleCodeAndName = new ZModuleService(this.getConnection().getDao().mapIdAndName();return SUCCESS;47Struts 2 配置示例(请求路径)http:/ WEB应用中,Hibernate可以作为模型层/数据访
- 配套讲稿:
如PPT文件的首页显示word图标,表示该PPT已包含配套word讲稿。双击word图标可打开word文档。
- 特殊限制:
部分文档作品中含有的国旗、国徽等图片,仅作为作品整体效果示例展示,禁止商用。设计者仅对作品中独创性部分享有著作权。
- 关 键 词:
- web 应用 开发 报告
![提示](https://www.deliwenku.com/images/bang_tan.gif)
限制150内