网站建议:179001057@qq.com

AjaxPro 由浅入深之使用篇 转

技术2022-05-11  2

谈起Ajax做过web开发的都非常熟悉,就是通过xmlhttp request与服务器端通信而避免页面刷新。关于Ajax是如何运作的,网上有很多帖子解释其各js文件的作用及调用xmlhttp的原理。但Ajax到底是怎么调用服务器端的C#代码的呢?怎么让后台的方法运行并将结果反馈给xmlhttp的呢?曾经有个同事问起我这个问题,我还真懵了!本以为象.Net 1.1下通过form传递必要的EventNameEventPara等参数传给服务器端继而解析后执行对应的事件一样来调用C#代码的(.net调用事件机制也不全是这么回事,待探讨),但通过仔细研究,发现原来远不是这么回事,而网上更深入的文章却少之又少。

我们由浅到深吧,先看看相对表象的东西,即前台Ajax相关的JavaScript代码部分。之所以说相对肤浅和表象,是因为这些资料很多网友已经撰文解读过。

凡要使用AjaxPro,我们大致要做以下工作:

1)  在项目中引用AjaxPro.dll(我用的是AjaxPro.2.dll,版本6.6.13.2),并在web.confighttpHandlers配置节添加:<add verb="POST,GET" path="ajaxpro/*.ashx" type="AjaxPro.AjaxHandlerFactory, AjaxPro.2"/>

2)  在要使用Ajax功能的页面.cs文件上注册Ajax,例如:

        protected void Page_Load(object sender, EventArgs e)

        {

            // 注册Ajax

            AjaxPro.Utility.RegisterTypeForAjax(typeof(Default));

        }

3)  .cs文件中声明可以被Ajax调用的函数(或属性),如:

        [AjaxPro.AjaxMethod]

        public string GetChild(string parentId)

        {           

            return "return value from .cs file";

        }

4)  .aspx文件中用JavaScript调用Ajax,如:

            <script language="javascript">          

                    var items =  DynLoadTree.Default.GetChild( "aa" ).value;  // 通过Ajax调用后台代码

                    alert(items);

            </script>

做好以上四步,我们就基本实现了Ajax页面不刷新的功能了。那么它是怎样通过xmlhttp与服务器通讯的呢?运行后我们可以看到HTML文件的源代码多了几行.ashx文件的引用:<script type="text/javascript" src="/ajaxpro/prototype.ashx"></script><script type="text/javascript" src="/ajaxpro/core.ashx"></script><script type="text/javascript" src="/ajaxpro/converter.ashx"></script><script type="text/javascript" src="/ajaxpro/DynLoadTree.Default,DynLoadTree.ashx"></script>

   实际上这些.ashx就是在上面第2AjaxPro.Utility.RegisterTypeForAjax注册Ajax时自动将这些引用添加到Html文档输出的。那这些文件是什么文件呢?再看第1步中在web.config中添加到httpHandlers节中的配置,它告诉系统凡是收到ajaxpro路径下已经ashx为后缀的请求就全部交给AjaxPro.AjaxHandlerFactory这个类来处理,而这些ashx经过处理后返回的就是一些JavaScript文件,和普通的js引用没有实质区别。

原文地址:http://www.cnblogs.com/qguohog/archive/2009/03/19/1397987.html


最新回复(0)