aspnet教程详解(10)

AJAX简介•没有AJAX会怎么样？普通的ASP.Net每次执行服务端方法的时候都要刷新当前页面，比如实现显示服务器的时间。每次都要刷新页面的坏处：页面刷新打断用户操作、速度慢、增加服务器的流量压力。如果没有AJAX，在youku看视频的过程中如果点击了“顶、踩”、评论、评论翻页，页面就会刷新，视频就会被打断。•AJAX（AsynchronousJavaScriptandXML，异步JavaScript和XML）是一种进行页面局部异步刷新的技术。用AJAX向服务器发送请求和获得服务器返回的数据并且更新到界面中，不是整个页面刷新，而是在HTML页面中使用JavaScript创建XMLHTTPRequest对象来向服务器发出请求以及获得返回的数据，就像JavaScript版的WebClient一样，在页面中由XMLHTTPRequest来发出Http请求和获得服务器的返回数据，这样页面就不会刷新了。XMLHTTPRequest是AJAX的核心对象XMLHTTPRequest•开发一个AJAX功能需要开发服务端和客户端两块程序。以一个显示服务端时间为例。首先开发一个GetDate1.ashx，输出当前时间。在HTML页面中放一个按钮，在按钮的onclick中创建XMLHTTP向GetDate1.ashx发送请求，获得返回的数据并且显示到界面上。代码见备注。面试常考：不使用UpdatePanel、JQuery等AJAX库编写一个AJAX程序。•也可以在xmlhttp.open中向服务器传递参数：xmlhttp.open(POST,GetDate1.ashx?id=1,false)，如果传递给服务器的请求里有中文，则需要使用Javascript函数encodeURI来进行URL编码。•案例：用AJAX实现汇率转换，页面放一个文本框（输入人民币）、一个下拉列表（美元，日元，港币）、一个按钮，点击按钮在一个span中显示转换后的金额。汇率计算在服务器端完成，假设汇率（人民币/外币）：7、0.1、0.9。JQueryAJAX•newActiveXObject(Microsoft.XMLHTTP)是IE中创建XMLHttpRequest对象的方法。非IE浏览器中创建方法是newXmlHttpRequest()。为了兼容不同的浏览器需要编写很多代码，见备注。•回调函数中data参数为服务器返回的数据，textStatus为服务器返回状态码，textStatus为success表示成功。•JQuery中提供了简化ajax使用的方法。$.ajax()函数是JQuery中提供的ajax访问函数，$.post()是对$.ajax()的post方式提交ajax查询的封装，$.get()是对$.ajax()的get方式提交ajax查询的封装。推荐用post方式，因为post方式没有缓存的问题，演示，get方式中缓存处理的处理方法。代码见备注。•如果有请求参数则在第二个参数用字典方式来设置。$.post(GetDate1.ashx,{id:2},function(data,textStatus){。JQuery帮我们进行了URL编码，因此参数中有中文也不用担心。•案例：JQueryAJAX版的汇率转换。注意status指的是通讯是否成功案例练习•案例：新闻的无刷新评论，防止打断视频播放。刚进入界面的时候评论也是页面显示后才加载，“正在加载评论”。界面上有一个表格，逐条显示评论，页面刚进来的时候显示已有评论。用户在评论文本框中输入文本，点击评论按钮，向服务器发出ajax请求，将用户的评论内容发给服务器，如果服务器返回“插入成功”的消息则将用户的评论动态添加到现有表格中，如果用户评论中含有“TMD”、“去死”等不良信息则提示用户“请文明用语”。•练习：完成上述内容，并且实现评论“看到时”才加载，参考•练习1：AJAX校验用户名是否存在，焦点离开用户名、点击【检查用户名】的校验。分别用XMLHttp和JQueryAJAX实现。•练习2：填入商品名称，AJAX自动带出价格填充到价格框。Json•AJAX传递复杂数据如果自己进行格式定义的话会经历组装、解析的过程，因此AJAX中有一个事实上的数据传输标准JSon。Json将复杂对象序列化为一个字符串，在浏览器端再将字符串反序列化为JavaScript可以读取的对象。看一下Json的格式。Json被几乎所有语言支持。•C#中将.Net对象序列化为Json字符串的方法：JavaScriptSerializer().Serialize(p)，JavaScriptSerializer在System.Web.Extensions.dll中，是.Net3.x中新增的类，如果在.Net2.0中则需要用第三方的组件。•JQueryAJAX得到的data是Json格式数据，用$.parseJSON(data)方法将JSon格式数据解析为JavaScript对象案例练习•案例练习：无刷新分页。AJAX比较难的应用。•案例练习：无刷新删除行，配合JQueryUI中的Effect实现动态删除效果，要考虑删除失败的情况。•练习：鼠标放到图片上，AJAX方式去后台取图片相关信息并且展示出来。•练习1：新闻的无刷新评论用方式Json实现，要分页。评论实现“看到才加载”。•练习2：实现一个看帖页面，页面中有“赞成”、“反对”两个按钮，点击“赞成”按钮则增加赞成数，并且在“赞成”按钮上显示最新的赞成个数，“反对”按钮同样如此。（*）同一个IP在24小时之内只能投票一次。讨论方案。select*from**whereip=.....anddatediff(hour,投票时间,getdate())24如果条数大于0就说明24小时之内投过票了。•练习3：每隔十秒钟刷新一次数据库中的最新评论。微软AJAX解决方案（*）•ASP.Net中内置的简化AJAX开发的控件UpdatePanel–放入ScriptManager，将要实现AJAX效果的控件放到UpdatePanel中即可。–UpdatePanel原理探秘，用HttpWatch看。–只把需要无刷新更新的部分放到UpdatePanel中。–UpdatePanel用来实现一些对性能要求不高的需求非常方便。•Timer实现定时AJAX效果，原理分析。•UpdateProgress显示“正在加载数据”。•AJAXToolkit简介。WCF简化AJAX（*）•开发步骤：–添加一个Web项目，在Web项目中新建“新建项”→“Web”→“启用了AJAX的WCF服务”（2008中在“C#”根类别下）–页面上拖放ScriptManager控件，ScriptManager的Services属性中新增一项，Path属性设置为服务路径，比如“~/Service1.svc”–调用服务端方法的时候Service1.DoWork(OnDoWorkSucceed,OnDoWorkFailed),(net.itcast.cn)Service1为服务类名，DoWork为方法名，OnDoWorkSucceed是调用成功时被回调的函数（Javascript中的委托），OnDoWorkFailed是调用失败时被回调的函数。两个函数都是有一个参数result的，成功函数的result值为函数返回值，失败函数的result值为错误消息。调用都是异步的。注意这是Javascript代码！•注意“~Service1.svc要加在ScriptManager的Services属性中，而不是Scripts属性中。如果写Javascript的时候没有自动提示，把aspx关掉再打开就行。如果还不行的话手动写。•服务端还可以返回复杂对象，JS端可以直接从result读取复杂对象的字段值。全局文件•添加Web→全局应用程序类，注意文件名不要改。–全局文件是对Web应用声明周期的一个事件响应的地方–将Web应用启动时初始化的一些代码写到Application_Start中，比如后面讲的Log4Net的初始化等。应用关闭的时候Application_End调用。–当一个Session启动的时候Session_Start被调用，Session结束（用户主动退出或者超时结束）Session_End被调用。–当一个用户请求来的时候Application_BeginRequest方法被调用–当应用中出现未捕获异常，Application_Error被调用（常考，ASP.Net中的错误处理机制），用HttpContext.Current.Server.GetLastError()获得异常信息，然后用Log4Net记录到日志中。•案例练习：实现图片的防盗链，讨论。•案例练习：屏蔽指定的IP地址。URL重写(UrlRewrite)•为什么要URL重写？1、有利于SEO，带参数的URL权重较低；2、地址看起来更正规，推广uid。看看如鹏网的URL重写。•伪静态：看起来像普通页面，而非动态生成的页面。•原理：在Global.asax的Application_BeginRequest中读取Request.Url得到请求的URL（View-3.aspx），然后用HttpContext.Current.RewritePath(ReWriteUrl)进行重写（也就是交由另外一个页面处理这个请求）(View.aspx?tid=3格式)•也可以使用微软的URLRewrite，只要修改配置文件就可以进行URL重写。照着文档自学配置。见备注