Js+MVC~公用ＡＰＩ的设计，返回jsonp后使ajax的error属性生效！

相关知识说明

　　项目用公用的ＡＰＩ事实上就是其它子项目，包括非子项目需要从这个项目中得到一个公用的信息，这种产生信息的接口我们称为公用的ＡＰＩ(application program interface)，例如：一个Ａ网站，它有用户模块，产品模块，订单模块，帮助中心模组成，而在Ａ网站旗下有它的Ａ论坛，Ａ社区，Ａ微博等，而这些子网站的用户来源是从Ａ网站来的，而如果在子网站中希望得到用户的详细信息，就需要我们在主网站提供一个开放的ＡＰＩ，而这个ＡＰＩ是如果通过ＧＥＴ请求直接访问的，这是正常的，但如果在Ａ微博中需要异步得到信息，即以ajax方式得到信息，直接访问是不可以的，必须使用jsonp的方式！而对于jsonp来说，如果主网站的接口出现问题了，在默认情况下是不能通知到子网站的，这是jsonp自己的事，而jquery也提供了应对的方法，那就是jquery.jsonp插件，可以在这里下载！

说干就干

对于ＭＶＣ开发环境来说，在视图渲染上提供了对html,javascript,text,json等渲染方式，如果jsonp来说，mvc本身并没有提供，事实上jsonp只是向页面输出json文本信息的变种，我们完全可以自己去伪造一个，当然把它封装的好一些就是要继承JsonResult，并在渲染方法ExecuteResult作一个文章就可以了，看代码：

　 /// <summary>
    /// 返回jsonp上下文
    /// </summary>
    public class JsonpResult : JsonResult
    {
        const string CALLBACKNAME = "callback";
        /// <summary>
        /// 复写渲染视图方法
        /// </summary>
        /// <param name="context"></param>
        public override void ExecuteResult(ControllerContext context)
        {
            if (context == null)
            {
                throw new ArgumentNullException("当前请求上下文出错");
            }
            if ((JsonRequestBehavior == JsonRequestBehavior.DenyGet)
                && String.Equals(context.HttpContext.Request.HttpMethod, "GET"))
            {
                throw new InvalidOperationException("Jsonp只能是ＧＥＴ请求");
            }
            var response = context.HttpContext.Response;
            if (!String.IsNullOrEmpty(ContentType))
            {
                response.ContentType = ContentType;
            }
            else
            {
                response.ContentType = "application/json";
            }
            if (ContentEncoding != null)
            {
                response.ContentEncoding = this.ContentEncoding;
            }
            if (Data != null)
            {
                String buffer;
                var request = context.HttpContext.Request;
                var serializer = new JavaScriptSerializer();
                if (request[CALLBACKNAME] != null)
                    buffer = String.Format("{0}({1})", request[CALLBACKNAME], serializer.Serialize(Data));
                else
                    buffer = serializer.Serialize(Data);
                response.Write(buffer);
            }
        }
    }

而对于公用的ＡＰＩ来说，我们可以在controller里这样去写：

 　　　　/// <summary>
        /// 跨域ＡＰＩ
        /// </summary>
        /// <returns></returns>
        public JsonpResult GetUserAPI(string userID)
        {
            JsonpResult result = new JsonpResult()
            {
                Data = new { name = "zzl", res = true, },
                JsonRequestBehavior = JsonRequestBehavior.AllowGet
            };
            return result;//反回一个callback(msg)对象
        }

ＯＫ，底层获到公用信息的工作已经完成了，再看一下如何在Ａ微博页面上去调用它：

 //跨域调用公用的ＡＰＩ，如果希望它相应error事件，需要使用$.jsonp，而不是JQ的$.ajax
    function jsonpFun() {
        $.ajax({
            dataType: 'jsonp', //跨域使用它
            jsonp: 'callback', //可以省略，但如果显示声明它，必须是callback，因为在JsonResult里jsonp字符串已经被规定成它了
            url: 'http://www.jsonp.com/Common/GetUserAPI',
            data: { userID: 1 },
            type: 'GET',
            success: function (data) {
                alert(data.name);
            },
            error: function (data) {
                alert("获取用户信息失败");
            }
        });
    }

上面的代码应该改为：

      $.jsonp({
            url: 'http://www.jsonp.com/Common/GetUserAPI?userID=1',
            callbackParameter: 'callback',
            success: function (data) {
                alert(data.name);
            },
            error: function (xOptions, textStatus) {
                alert("获取用户信息失败");
            }
        });

 

好了，前面已经说了对于jsonp来说，ajax的error属性是不好使的，我们需要在页面上引用jquery.jonsp这个js插件才行：

<script src="http://www.cnblogs.com/Scripts/jquery.jsonp-2.3.0.min.js" type="text/javascript"></script>

ＯＫ，我们测试一下吧：

没有问题，信息已经得到了，再看看fiddler所捕获的消息：

我们的ＵＲＬ上自己加上了callback，而这个串是Ａ网站与Ａ微博网站自己规定的，如果您不知道它们的规范，这个请求是会失败的，这是正常的，呵呵。

通过ＧＥＴ请求，直接可以返回你要的字符，这也是正常的，当然实现项目中，我们会在双方进行密文的设计的！