创新源于理解 轻松打造自己的AJAX框架(2)

2016-02-19 18:49 2 1 收藏

下面是个创新源于理解 轻松打造自己的AJAX框架(2)教程,撑握了其技术要点,学起来就简单多了。赶紧跟着图老师小编一起来看看吧!

【 tulaoshi.com - Web开发 】

AJAX介绍

  AJAX并不是一种新的技术,而是一些已有技术的有机结合,主要包括:XmlHttp、Reflect。一个AJAX框架基本上包括:一个自定义的HttpHandler、一段JavaScript代码。

  AJAX运行机制:

  以前我们使用XmlHttp实现无刷新页面的时候,是用XmlHttp来请求一个隐藏的页面,使用(Asp/Asp.Net)自带的HttpHandler,而在AJAX中,我们请求的也是一个隐藏的页面,不同的是这个页面的HttpHandler是由我们自己来实现。 打造自己的AJAX:

  1. 首先我们要实现一个Http处理程序(HttpHandler)来响应客户端的请求:

  实现自定义的HttpHandler需要实现IHttpHandler接口。

  该接口包含一个属性和一个方法:

bool IHttpHandler.IsReusable
void IHttpHandler.ProcessRequest(HttpContext context)
Example:
bool IHttpHandler.IsReusable
{
 get { return true; }
}
void IHttpHandler.ProcessRequest(HttpContext context)
{
 context.Response.Clear(); //获取要调用的方法
 string methodName = context.Request.QueryString["me"];
 //获取程序集信息。
 //Czhenq.AJAX.Class1.Dencode是自定义的字符串编码方法
 string AssemblyName = Czhenq.AJAX.Class1.Dencode(context.Request.QueryString["as"]); //获取方法的参数
 string Arguments = context.Request.QueryString["ar"]; //开始调用方法
 Type type = Type.GetType(AssemblyName);
 MethodInfo method = type.GetMethod(methodName, BindingFlags.NonPublic | BindingFlags.Public | BindingFlags.Static | BindingFlags.Instance);
 if (method != null)
 {
  //参数使用","分隔
  string[] args = Arguments.Split(",".ToCharArray());
  ParameterInfo[] paras = method.GetParameters();
  object[] argument = new object[paras.Length];
  for (int i = 0; i argument.Length; i++)
  {
   if (i args.Length) {
    //因为XmlHttp传递过来的参数全部时String类型,所以必须进行转换
    //这里只将参数转换为Int32,并不做其他考虑。
    argument[i] = Convert.ToInt32(args[i]);
   }
  }
  object value = method.Invoke(Activator.CreateInstance(type, true), argument);
  if (value != null) context.Response.Write(value.ToString());
  else context.Response.Write("error");
 }
 //处理结束
 context.Response.End();
}

  2. 客户端Javascript代码:

function CallMethod(AssemblyName,MethodName,Argus)
{
 var args = "";
 for(var i=0;i  args += Argus[i] + ",";
  if(args.length0) args = args.substr(0,args.length-1);
  var xmlhttp = new ActiveXObject('Microsoft.XMLHTTP');
  url = "AJAX/AJAX.czhenq?as=" + AssemblyName + "&me=" + MethodName +"&ar="+ args;
  xmlhttp.open("POST",url,false);
  xmlhttp.send();
  alert(xmlhttp.responseText);
}

  3.一个简单的AJAX框架已经实现。现在写段代码来测试.

  使用自己的AJAX:

(本文来源于图老师网站,更多请访问https://www.tulaoshi.com/webkaifa/)

  1.新建一个网站,并应用刚才你编写的HttpHandler。并在网站的Web.config中注册你的HttpHandler,说明那些请求将使用你编写的Handler来处理。下面的内容说明:所有以"czq"结尾的请求,都将使用"Czhenq.HttpHandlerFactory"来处理。

  2.添加一个web页面,将刚才的脚本拷贝到页面中,并添加一个你要调用的方法。

private string Add(int i, int j)
{
 return TextBox1.Text;
}

(本文来源于图老师网站,更多请访问https://www.tulaoshi.com/webkaifa/)

  3.在页面中放置一个HiddenField控件,命名为AssemblyName。 并在Page_Load中添加如下代码:

string assemblyName = Czhenq.AJAX.Class1.Encode(typeof(_Default).AssemblyQualifiedName);
AssemblyName.Value = assemblyName;

  4.页面中添加如下脚本:

var assemblyName = document.getElementById("AssemblyName");
var argus = new Array();
argus.push("100");
argus.push("200");
CallMethod(assemblyName,"Add",argus);

  总结:

  AJAX并不是一种新的技术,它只是一些已有技术的有机结合.我们可以将AJAX简单的理解为:AjAx是对JavaScript调用XmlHttp的封装.它改变的是代码书写方式.

  附 Encode 与 Dencode实现:

public static string Encode(string value)
{
 byte[] bytes = ASCIIEncoding.ASCII.GetBytes(value);
 return Convert.ToBase64String(bytes);
}
public static string Dencode(string value)
{
 byte[] bytes = Convert.FromBase64String(value);
 return ASCIIEncoding.ASCII.GetString(bytes);
}

来源:https://www.tulaoshi.com/n/20160219/1619077.html

延伸阅读
  ZK 开发小组宣布发布ZK 2.2 版本。ZK 是一个基于XUL嵌入AJAX事件驱动的Java 框架,用于丰富用户网络应用程序界面。  ZK 开发小组宣布发布ZK 2.2 版本。 ZK 是一个基于XUL嵌入AJAX事件驱动的Java 框架,用于丰富用户网络应用程序界面。 ZK包括一个基于AJAX可...
标签: Web开发
  函数是进行模块化程序设计的基础,编写复杂的Ajax应用程序,必须对函数有更深入的了解。javascript中的函数不同于其他的语言,每个函数都是作为一个对象被维护和运行的。通过函数对象的性质,可以很方便的将一个函数赋值给一个变量或者将函数作为参数传递。在继续讲述之前,先看一下函数的使用语法: function func1(){} var fun...
标签: Web开发
话说Buffalo是姓中的写的,支持下国产! 来先顶一个。 Buffalo处理Ajax有多牛,嘿嘿 我还真没有正儿八经的整过。惭愧啊,争取在最近好好研究下吧。 Buffalo支持和Spring整合。嘿嘿 这也是一个亮点。亮的有些不自在。为啥?   假如你用Spring+Struts+Hibernate来构建的轻量级J2EE框架,Spring和Struts整合有好几种方式,有一种方式不要要论...
标签: Web开发
核心ajax(options)函数中,包含了建立xmlhttprequest,提取数据,判断是否回复成功等,基本满足了日常需求。 代码如下: // A generic function for performming AJAX requests // It takes one argument, which is an object that contains a set of options // All of which are outline in the comments, below function ajax( option...
标签: Web开发
看了itcast里面老师的讲课,下面是我一些体会 (function(){ window['czf'] = {} 命名空间 var $$= function(){ alert('这个是私有的方法'); } window['czf']["$"] = $$; ...

经验教程

311

收藏

44
微博分享 QQ分享 QQ空间 手机页面 收藏网站 回到头部