返回总目录 本篇目录 Ajax Notification Message UI block和busy Logging 其他工具功能 说在前面的话

不知不觉，我们送走了2015，同时迎来了2016。我相信，每一个人，都会在过去的一年有所失，但我更相信，我们所得到的更多。过去的就过去了，不要再计较了，但要从过去的各种不顺中汲取经验，这样，在全新的2016年里继续留下2015年遗憾的概率才会大大降低！祝大家在新的一年里，代码bug越来越少！

本来给这个 ABP理论学习系列 的预算时间是2016年春节前完成，当时还恐怕完成不了任务，现在没想到在2016年元旦假期就完成了。原本计划两个月的完成的任务，结果用了不到一个月就完成了，我的效率还是蛮高的嘛！不过，这多亏了各位园友的鼓励和支持，才让我有了坚持下去的动力，在此谢谢了！

ABP理论学习完了，基本上的东西也就懂了！接下来，就需要好好地实战一把了！虽然我写了 一步一步使用ABP搭建正式项目教程 ，但是那完全是让新手能迅速使用ABP搭建的项目跑起来。接下来，我会写一个 ABP项目进阶教程 系列，教大家使用ABP框架搭建一个完整的例子，实战的同时，讲解一些难点的基本原理，也希望热爱ABP的园友们多多关注。

先声明一下，这篇文章稍长，希望大家多点耐心。

ABP提供了一些对象和函数集，使得了javascript开发简单且标准化。

下面，我们一一讲解ABP中的这些javascript API。

使用Ajax调用服务端的服务，并返回服务端响应的内容。因为ABP对于Ajax调用会返回一个标准的响应，因此，建议使用该方法处理标准的返回值。

Ajax操作的问题

现代应用程序频繁使用Ajax调用，特别是在SPA中，它几乎是和服务器交互的唯一方式。

Ajax调用包含了许多重复性的步骤：

一般来讲，在客户端javascript代码应该提供一个URL，data是否提供是可选的，以及选择一个执行Ajax调用的方法（Post,Get...）。必须等待然后才能处理返回的值。当向服务端发起调用时可能会发生错误（一般是网络错误）。服务端也可能发生错误，服务器可能发送了一个具有错误信息的失败响应。客户端代码应该处理服务端响应的错误，并选择性地通知用户（可能展示一个error对话框）。如果没有错误，且服务器返回了数据，客户端也必须处理。此外，一般它会阻塞一些（或者整个）屏幕区域，并展示一个繁忙的指示标志，直到Ajax操作结束。

服务端应该接收请求，然后执行服务端的代码，捕获任何异常并返回一个有效的响应给客户端。在发生错误的情况下，它可以有选择地发送一个错误消息给客户端；成功时，它可以返回数据给客户端。

ABP采用的方式

ABP通过使用 abp.ajax 函数封装Ajax的调用，自动化了这其中的一些步骤。一个ajax调用的例子如下：

var newPerson = { name: 'Dougles Adams', age: 42 }; abp.ajax({ url: '/People/SavePerson', data: JSON.stringify(newPerson) }).done(function(data) { abp.notify.success('created new person with id = ' + data.personId); });

abp.ajax以一个对象作为接收 选项 。你可以传递任何在jQuery的$.ajax方法中有效的任何参数。这里有一些 默认 的值：dataType是‘json’，type是‘POST’，contentType是‘application/json’（因此，在发送到服务器之前，我们可以调用JSON.stringify将javascript对象转成JSON字符串）。你可以通过将选项传给abp.ajax重写默认值。

abp.ajax返回了 promise 。因此，你可以写done,fail,then等处理函数。上面的例子中，我们向 PeopleController的SavePerson 的action发送了简单的Ajax请求。在 done 处理函数中，我们获得了新添加的person的数据库Id，而且展示了一个成功的通知。让我们看一下该Ajax请求的 MVC控制器 ：

public class PeopleController : AbpController { [HttpPost] public JsonResult SavePerson(SavePersonModel person) { //TODO:将新的person保存到数据库，并返回该person的Id return Json(new {PersonId = 42}); } }

SavePersonModel包含了Name和Age属性。SavePerson标记有 HttpPost 特性，因为abp.ajax默认的方法是POST。这里通过返回一个匿名的对象简化了方法的实现。

这个看上去简单明了，但是ABP背后处理了许多重要的事情。让我们深入细节看一下：

Ajax返回的消息

虽然我们直接返回了一个具有PersonId=2的对象，但是ABP会使用一个 MVCAjaxResponse 对象封装了它。实际的Ajax响应是像下面那样的：

{ "success": true, "result": { "personId": 42 }, "error": null, "targetUrl": null, "unAuthorizedRequest": false }

这里，所有的属性都是camelCase的（因为在javascript中这是惯例），即使在服务端代码中是PascalCased的。下面解释一下所有的字段：

success :一个布尔值，表示操作的成功状态。如果是true，abp.ajax会解析该promise，并调用 done 处理函数。如果是false（如果在方法调用中发生了异常），它会调用 fail 处理函数并使用abp.message.error函数展示一个 error 消息。 result ：控制器的action返回的实际值。如果success是true，而且服务器发送了一个返回值，它才有效。 error ：如果success是false，那么该字段是一个包含了 message 和 detail 字段的对象。 targetUrl :这为服务器提供了一种重定向客户端到其他Url的可能性。 unAuthorizedRequest :这为服务器提供了通知客户端该操作没有授权或者用户没有认证的可能性。如果该值是true，那么abp.ajax会 重新加载 当前的页面。

通过从 AbpController 类中派生就可以将返回值转换成一个封装的Ajax响应。 abp.ajax 会识别并计算该响应。因此，它们成对工作。如果没有发生错误的话，那么abp.ajax的done处理函数会获得控制器返回的实际值（一个具有personId属性的对象）。

当从 AbpApiController 类派生时，也会存在相同的机制。

处理错误

正如上面描述的，ABP会处理服务器中的所有异常，并返回一个具有错误信息的对象，如下所示：

{ "targetUrl": null, "result": null, "success": false, "error": { "message": "An internal error occured during your request!", "details": "..." }, "unAuthorizedRequest": false }

可以看到，success是false，result是null。abp.ajax处理该对象，而且使用abp.message.error函数展示一个错误信息给用户。如果你的服务端代码抛出了一个 UserFriendlyException 类型的异常，它会直接给用户显示异常信息。否则，它会隐藏实际的错误（将错误写到日志中），并展示一个标准的“服务器内部错误...”信息给用户。所有的这些都是ABP自动处理的。

动态Web API 层