综述ASP.NET下的AJAX模式
本文内容:
一、导言
二、XMLHttp+WebForm模式
三、XMLHttp+HttpHandler模式
四、ASP.NET 2.0/3.5回调模式
五、AJAX框架模式
--------------------------------------------------------------------------------------------------
一、导言
在这篇文章中,将介绍在ASP.NET环节下的几种常用的AJAX模式。例如:XMLHttpRequest+WebForms,XMLHttpRequest+HttpHandlers,CallBacks,以及使用AJAX框架等,下面将以示例结合的方式展开介绍这一系列常用模式。本文之后将提供示例代码下载。
二、XMLHttp+WebForm模式
或许大家都比较清楚的记得,XMLHttp+WebForm模式是ASP.NET下最原始的AJAX模式。在这种模式下,是通过JavaScript去操作XMLHttpRequest对象,发送异步请求到服务器端的WEB窗体的形式。另一方面,在服务端创建WEB窗体可以直接用来接受XMLHTTP的请求。以此,浏览器的XMLHttpRequest对象便成了服务器端和客户端的一种良好的沟通方式。
在这一节将结合一个简单的示例来介绍,希望能够帮助大家更直观的理解XMLHttp+WebForm模式的这种AJAX模式。
(1)、客户端
客户端里创建XMLHttpRequest对象以及发起异步请求我们将其JavaScript封装在一个Ajax.js文件里。这样部分方法可以达到重用,在Ajax.js里有三个方法,newXmlHttpReqeust,sendRequest和onSuccessCallBack方法,详细如下:
2var xmlHttp;
3function newXMLHttpRequest() {
4
5 if (window.XMLHttpRequest) {
6 xmlHttp = new XMLHttpRequest();
7 } else if (window.ActiveXObject) {
8 try {
9 xmlHttp = new ActiveXObject("Msxml2.XMLHTTP");
10 } catch (e1) {
11 try {
12 xmlHttp = new ActiveXObject("Microsoft.XMLHTTP");
13 } catch (e2) {
14 }
15 }
16 }
17 return xmlHttp;
18}
19
20//发起异步请求
21function sendRequest(){
22 newXMLHttpRequest();
23 var url="AjaxForm.aspx?name="+document.getElementById("txtName").value;
24 xmlHttp.open("GET",url,true);
25 xmlHttp.onreadystatechange=onSuccessCallBack;
26 xmlHttp.send(null);
27}
28
29//回调处理函数
30function onSuccessCallBack(){
31 if (xmlHttp.readyState == 4)
32 {
33 if (xmlHttp.status == 200)
34 {
35 document.getElementById("result").innerHTML = xmlHttp.responseText;
36 }
37 else
38 {
39 document.getElementById("result").innerHTML=result.status;
40 }
41 }
42}
客户端调用异步发起请求前首先执行创建XmlHttpRequest对象的方法,最后通过回调函数更新页面显示。
(2)、服务端
服务端就是一个WebForm,接受客户端传递的参数然后将其转化为大写后返回给客户端。
2{
3 if (!IsPostBack)
4 {
5 string name = Request.QueryString["name"];
6 Response.Write(name.ToUpper());
7 Response.Flush();
8 Response.End();
9 }
10}
三、XMLHttp+HttpHandler模式
此模式和上一种形式上没有太大的差别,只是服务端的处理对象不同,一个是WebForm一个则是HttpHandler。在HttpHandler里通过Request对象获取请求的参数,然后通过Response对象将结果返回,是直接通过HttpHandler的ProcessRequest方法来处理的。OK,既然是这样,那么我们只需要在上一模式的基础上将请求Url修改为HttpHandler就OK了,如下:
2{
3
4 public void ProcessRequest(HttpContext context)
5 {
6 context.Response.ContentType = "text/plain";
7 string name = context.Request.QueryString["name"];
8 context.Response.Write(name.ToUpper());
9 }
10
11 public bool IsReusable
12 {
13 get
14 {
15 return false;
16 }
17 }
18}
四、ASP.NET 2.0/3.5回调模式
ASP.NET的回调,其实很好理解,就是使用ICallbackEventHandler接口,通过实现RaiseCallbackEvent()和GetCallbackResult()方法来实现回调,最后通过调用ClientScript.GetCallbackEventReference()方法实现Ajax效果。看看下面这个示例:
2{
3 public partial class AjaxForm : System.Web.UI.Page,ICallbackEventHandler
4 {
5 protected void Page_Load(object sender, EventArgs e)
6 {
7
8 }
9
10 string text = string.Empty;
11
12 public string GetCallbackResult()
13 {
14 return text;
15 }
16
17 public void RaiseCallbackEvent(string eventArgument)
18 {
19 text = DateTime.Now.ToLocalTime().ToString();
20 }
21 }
22}
上 面便是实现了ICallbackEventHandler,在RaiseCallbackEvent方法里将当前时间返回,客户端通过调用 ClientScript.GetCallbackEventReference()方法,来实现Ajax,客户端代码如下:
2function receiveServerData(arg,context)
3{
4 document.getElementById("result").innerHTML=arg;
5}
6
7function callServer(arg,context)
8{
9 <%=ClientScript.GetCallbackEventReference(this,"arg","receiveServerData","context") %>;
10}
11</script>
现在我们就可以通过调用callServer方法去回调服务端的方法了,html如下:
2 <hr />
3 <div id="result">
4
5 </div>
以上三种模式相比成型的AJAX框架来说使用起比较麻烦,没有框架那么直接,通过调用一个请求方法就搞定AJAX请求。不过各自也有各自的好处,在我们的实际开发中应该根据实际需求来选择适合自己的AJAX模式。
五、AJAX框架模式
此模式,顾名思义就是使用成型的AJAX框架来开发AJAX应用。如:JQuery,ASP.NET AJAX等等。具体的使用我在这里就不在做重复的示例和介绍了,有兴趣的朋友可以看看我写的其他有关AJAX框架的文章。
相关文章:JavaScript与Web Service组合实现无刷新交互 ----使用ASP.NET AJAX
ASP.NET MVC中使用AJAX(XMLHttpRequest、Microsoft AJAX Library......) ----包括JQuery
参考文献:http://aspalliance.com/1740_Summarizing_AJAX_Patterns_Under_ASPNET
示例下载:点击下载示例代码
综述ASP.NET下的AJAX模式相关推荐
- .net ajax 服务器,以服务器端为中心的 ASP.NET AJAX 模式(2)-陈广琛 | Microsoft Docs
以服务器端为中心的 ASP.NET AJAX 模式 (Part 2 - Control) 01/05/2009 本文内容 作者:陈广琛 在上一篇文章当中,也就是<以服务器端为中心的 ASP.NE ...
- 【转】ASP.NET MVC框架下使用MVVM模式-KnockOutJS+JQ模板例子
KnockOutJS学习系列----(一) 好几个月没去写博客了,最近也是因为项目紧张,不过这个不是借口,J. 很多时候可能是因为事情一多,然后没法静下来心来去写点东西,学点东西. 也很抱歉,突然看到 ...
- Asp.net中的AJAX学习记录之一 AJAX技术的崛起与Asp.net AJAX的诞生
最近开始学习Asp.net中的AJAX,可能我的高手朋友们会说:"走还不稳呢!怎么就想学跑了?"呵呵!主要是我在做项目中体会到AJAX真的是很好的一门技术,应该好好的学习一下, ...
- .Net环境下基于Ajax的MVC方案
现在,越来越多人开始尝试基于Ajax进行无刷新的Web开发,不过,在.Net环境下,应用Ajax并不是非常方便,这主要可能是由以下一些原因造成的: •由于Ajax基于javascript的本质,使得开 ...
- ASP的2种开发模式
一.ASP.Net的两种开发模式 1.1 ASP.Net WebForm的开发模式 (1)处理流程 在传统的WebForm模式下,我们请求一个例如http://www.aspnetmvc.com/bl ...
- ASP.NET 2.0 AJAX中Webservice调用方法示例
ASP.NET 2.0 AJAX中能够在客户端js中很方便地调用服务器Webservice,以下为一些调用的示例.笔者安装的ASP.NET 2.0 AJAX 版本为AJAX November CTP. ...
- iMeta | 南科大宋毅组综述逆境胁迫下植物向微生物组求救的遗传基础(附招聘)
点击蓝字 关注我们 Review:植物向微生物群"呼救"策略的遗传基础 https://doi.org/10.1002/imt2.8 2022/3/14 ● 2022年3月14日, ...
- ASP.NET 调味品:AJAX
发布日期 : 1/6/2006| 更新日期 : 1/6/2006 Karl Seguin 适用于: AJAX(异步 JavaScript 和 XML) Microsoft AJAX.NET Micro ...
- 让你的主机运行ASP.NET 2.0 AJAX程序
以下文字转自:http://www.cnblogs.com/JeffreyZhao/archive/2006/10/23/deploy_asp_net_ajax_assembly_in_virtual ...
最新文章
- android矢量动画 充电,android矢量动画
- kaggle比赛模型融合指南
- php set error handler,php的set_error_handler正确用法
- [占坑] 近几天正在准备的文章
- 银河证券王锦炎:大数据在金融领域应用
- suse配置dhcp服务器
- Python绘制直方图案例一则
- 世界上最漂亮的写作工具Typora(创作者必备软件)
- c++获取串口设备名称_RTThread PIN设备学习笔记
- 高职高考数学可以用计算机吗,高职高考数学的考察范围有哪些,有没有什么解题技巧?...
- C++关键字分析系列
- express实现图片上传
- Spring Boot电商项目57:订单模块六:【前台:生成支付二维码】接口;(支付url的拼凑;利用zxing生成二维码;二维码图片的存储;真实地址与可访问地址的转换;)
- js鼠标移动让字体旋转360度
- 解决微信内红域名无需申诉过白
- Linux应用开发【第十二章】I2C编程应用开发
- 修改json字符串中某个key对应的value值
- 银河麒麟操作系统使用
- Java互联网支付系统源码,基于SpringBoot,含支付宝,微信,银联详细代码案例
- linux刷新本地dns命令_Linux网络命令