使用 AjaxPro 进行交互，很多人都写过文章了，为什么还要继续老生常谈呢。因为有一些细节上的东西我们需要注意，因为这些细节如果不注意的话，那么程序会报错，而且维护性较差。

引言

一.首先，还是那句话，欲练神功，必先自宫。我们开发程序第一步首先是搭建环境。

　　启动Visual Studio ，我的版本是2012啊，不过这个不影响的。先创建一个网站项目， 在项目中加入 Bin 目录，再添加一个 Index 页面。

　　然后，我们需要去网上下载 AjaxPro.2.dll 百度一下就一堆链接，这里我就不多说什么了。然后把下载到的 AjaxPro.2.dll 的文件复制或引入到 Bin 目录中。接着，在 Web.config 的 <system.web> 标签下写入以下内容。

 <httpHandlers>

    <add verb="POST,GET" path="ajaxpro/*.ashx" type="AjaxPro.AjaxHandlerFactory,AjaxPro.2"/>

 </httpHandlers>

　　并且在服务器后台类中，作以下修改：

 using AjaxPro;

 //（1）

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

 //（2）

 [AjaxPro.AjaxMethod]

 //（3）

（1）：引入 AjaxPro 命名空间

（2）：注册类信息到前台页面

（3）：每个前台页面需要调用的函数前面加上这个

　　这里我这有个实例，注意一点：在 Page_Load() 函数当中，使用了一个判断。 if(Page.IsCallback) 它的作用是 获得一个值，表示页面请求是否是回调的结果。它的一个特殊的回传，所以往返总是发生;但是，与传统的回发不同，脚本回调不会重绘整个页面。 这是在别的博主那里爬来的，这是原文，也是个人的一个小编程习惯，我也不知道具体有什么用，但是我就是知道有用。

　　以上，咱们就把这个 AjaxPro.2 环境搭建完了。

二. 接着，就开始调用了。

 <%@ Page Language="C#" AutoEventWireup="true" CodeFile="Index.aspx.cs" Inherits="Index" %>

 <!DOCTYPE html>

 <html xmlns="http://www.w3.org/1999/xhtml">

 <head runat="server">

 <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>

     <title>AjaxPro.2.dll</title>

     <script>

         function show() {

             //（1）     　　

             var name = Index.getName().value;

             alert("My Name is :" + name);

         }

     </script>

 </head>

 <body>

     <form id="form1" runat="server">

     <div>

         <input type="button" value="show" onclick="show()" />

     </div>

     </form>

 </body>

 </html>

　　（1）这里， Index 是这个类的类名，不知道还记不记得。咱们写过这样一段代码 AjaxPro.Utility.RegisterTypeForAjax(typeof(Index)); 在配置环境的时候申明的类名。前端页面也是通过这个找到我们的类的。.value 也是一个重点，我记的我第一次用这个插件的时候。返回一个 Password 判断是否登陆成功，一直都是失败，这个插件页面用日志信息，我就只能一个一个 alert 终于让我抓着了，如果这里不用 value 会获取很多实际应用用不上的信息，这里需要注意。

　　1）以为这样就可以调用成功了？太天真了，这里咱们说第一个细节：改变项目的托管管道模式

鼠标单击选中这个项目，然后按 F4 键，会出现这个项目的属性。将这个属性改成传统型，就行了。如果是集成，则会报 500.23

2） 还有一点，也是一个错误。这种错误编译时不会出错，加载页面时也不出错。只有调用到 AjaxPro.2 的是时候才报错 Uncaught ReferenceError: Index is not defined 大概意思是Index这个类中没有定义这个对象，当调用后台代码的不起作用时就需要注意是否是这个问题，因为这个报错它不会出现在页面，也不会被编译。想要看到这个错误，必须按 F12 页面调试，我知道 Google Chrome 浏览器 的错误显示在 Console 选项卡当中，其他浏览器博主就不是特别清楚了。

　　这个错误的原因啊，博主也查了许多资料，但是很少有具体的描述。这里博主也只能做一个博主自己的总结，如果有人知道哪里有错误，希望各位能积极指正（别客气，互相进步啊！！）。博主的分析呢，就是因为搭建环境时，又什么地方出了问题。 搭建环境博主刚刚也在前文中讲的比较清楚了，如果出现这个错误，应该就是这个原因。

3）这也是一个博主告诉我的细节啊！他这么说的：调用的时候，不一定要用声明的那个类名喔。可以使用  [AjaxNamespace("DEMO")]  这个标签，对这个类进行重命名。博主试了一下，确实是可以的。把这个标签放在被调用的类前面，记得是类前面哦。就可以了。

　　可以看到，效果是实现了的！这个标签还是非常实用的。

　　非常感谢大家观看，也希望各位对博主以上所述的有任何错误指正，请评论告诉我。我会及时验证并修改，希望不要误导他人。非常感谢！

　　

ASP.NET 使用 AjaxPro 实现前端跟后台交互的更多相关文章

  1. Asp.net+jquery+ajaxpro异步仿Facebook纵向时间轴效果

    Asp.net+jquery+ajaxpro异步仿Facebook纵向时间轴效果 在一个项目中,用到了时间轴展示产品的开发进度,为了更好用户体验,想到了Facebook的timeline效果, 搜了一 ...

  2. 在微信框架模块中，基于Vue&Element前端的后台管理功能介绍

    微信开发包括公众号.企业微信.微信小程序等方面的开发内容,需要对腾信的微信API接口进行封装:包括事件.菜单.订阅用户.多媒体文件.图文消息.消息群发.微信支付和企业红包.摇一摇设备.语义理解.微信小 ...

  3. 通过AngularJS实现前端与后台的数据对接（二）——服务（service，$http）篇

    什么是服务? 服务提供了一种能在应用的整个生命周期内保持数据的方法,它能够在控制器之间进行通信,并且能保证数据的一致性. 服务是一个单例对象,在每个应用中只会被实例化一次(被$injector实例化) ...

  4. 通过AngularJS实现前端与后台的数据对接（一）——预备工作篇

    最近,笔者在做一个项目:使用AngularJS,从而实现前端与后台的数据对接.笔者这是第一次做前端与后台的数据对接的工作,因此遇到了许多问题.笔者在这些问题中,总结了一些如何实现前端与后台的数据对接的 ...

  5. 前端和后台对时间数值的增减操作（JavaScript和C#两种方法）

    最近在做一个视频回放项目,记录下一点总结. 应用背景: 假设有一个门禁系统记录着门禁的人员进出刷卡信息,门禁装有视频录像设备,现在要根据人员的刷卡时间调出其刷卡时间点前后一段时间的录像.关于视频回放部 ...

  6. C# 加密–RSA前端与后台的加密&解密

    1. 前言 本问是根据网上很多文章的总结得到的. 2. 介绍 RSA加密算法是一种非对称加密算法. 对极大整数做因数分解的难度决定了RSA算法的可靠性.换言之,对一极大整数做因数分解愈困难,RSA算法 ...

  7. 正确的前端传后台json方式

    DEMO: var data=JSON.stringify({"page": {"pagenow": 1,"pagesize": 20},& ...

  8. 加密–RSA前端与后台的加密&解密

    1. 前言 本问是根据网上很多文章的总结得到的. 2. 介绍 RSA加密算法是一种非对称加密算法. 对极大整数做因数分解的难度决定了RSA算法的可靠性.换言之,对一极大整数做因数分解愈困难,RSA算法 ...

  9. 购物车Demo,前端使用AngularJS,后端使用ASP.NET Web API(2)--前端，以及前后端Session

    原文:购物车Demo,前端使用AngularJS,后端使用ASP.NET Web API(2)--前端,以及前后端Session chsakell分享了前端使用AngularJS,后端使用ASP.NE ...

随机推荐

  1. C# LINQ（5）

    目前都是说的单数据差距,如果多数据进行查询LINQ该如何呢? 那么LINQ就应该使用关键字 join on equals 现有代码: static void Main(string[] args) { ...

  2. SiriShortCut模型建立及数据交互逻辑

    1.模型数据需求 意图: 手机号 密码 网关ID 打开该情景的命令 情景号 情景名 情景背景图 添加该意图时的 token值 主程序登陆共享数据 手机号 token值 2.操作逻辑 1.意图被唤起 获 ...

  3. 20165219 预备作业3 Linux安装及学习

    20165219 预备作业3 Linux安装及学习 安装虚拟机 在安装的过程中遇到了不少的问题,在同学的帮助下都得到了解决.比如在新建虚拟机的时候没有64位这个选项,后来知道需要开启虚拟化,然后是安装 ...

  4. 手动创建spring项目（maven/IDEA环境）

    1.创建maven项目 按照步骤一步一步来 创建项目 这里选择maven的模板 设置包名 设置项目的maven的配置信息.maven仓库路径(会从maven配置文件中获取) 这里设置项目名.项目保存路 ...

  5. bzoj1867钉子和小球

    题目链接 简单$DP$ $$dp[1][1]=1(\text{显然})$$ $$map[i][j]=='*'?dp[i+1][j]+=dp[i][j]/2,dp[i+1][j+1]+=dp[i][j] ...

  6. spark执行例子eclipse maven打包jar

    首先在eclipse Java EE中新建一个Maven project具体选项如下 点击Finish创建成功,接下来把默认的jdk1.5改成jdk1.8 然后编辑pom.xml加入spark-cor ...

  7. np.random.seed(0)的作用：作用：使得随机数据可预测。

    >>>> numpy.random.seed(0) ; numpy.random.rand(4) array([ 0.55,  0.72,  0.6 ,  0.54]) > ...

  8. python参数传递：对象的引用

    大家都知道在python中,一切皆对象,变量也不再具有类型,变量仅仅是对象的一个引用,我们通常用变量来测类型,通常测得就是被这个变量引用得对象的类型. python采用的是传递对象的引用,为了方便说明 ...

  9. Effective Java 3rd.Edition 翻译

    推荐序 前言 致谢 第一章 引言 第二章 创建和销毁对象 第1项:用静态工厂方法代替构造器 第2项:遇到多个构造器参数时要考虑使用构建器 第3项:用私有构造器或者枚举类型强化Singleton属性 第 ...

  10. CBoard 汉化以及元数据存储配置

    汉化配置如图位置: 元数据存储配置为Mysql数据库的位置 版权声明:本文为博主原创文章,需要转载请注明出处. [置顶]Cboard 系列随笔