在ASP.NET MVC3 中利用JSONP跨域登录WEB系统

　　在信息系统开发的时，根据相关业务逻辑难免会多系统之间互相登录。一般情况下我们需要在多系统之间使用多个用户名和密码。这样客户就需要在多个系统之间重复登陆。每次登录都需要输入用户名和密码。最近比较流行的就是OAuth。新浪微博这个开放系统做的就很好。但OAuth并非本文讨论范畴。这里主要讨论jQuery1.5 jsonp 在Asp.net MVC3 中的应用。

　　本文应用场景：

　　假设您的开发团队欲为某集团公司开发一整套信息管理系统，目前首要开发的就是一套订单系统和一套内部OA系统。前提是这两套系统使用同一套数据库。只是两个不同的MVC3.0 Web项目。也就是说会在同一个IIS上部署两个虚拟目录。  我们的目标是在不使用WCF、WebService 等技术实现跨域登录。也就是说用户用同一个帐号登录了订单系统，那么客户就可以直接登录OA系统。而不需要在OA系统上再输入一次用户名和密码。反之亦成立。

　　jQuery1.5 JSONP 使用：

   
   
   
   

    
    
    
    <
    
    
    
    script type
    
    
    
    =
    
    
    
    "
    
    
    
    text/javascript
    
    
    
    "
    
    
    
    >
    
    
    
    
     $(
    
    
    
    function
    
    
    
     () {
         
    
    
    
    var
    
    
    
     oAUri 
    
    
    
    =
    
    
    
     
    
    
    
    "
    
    
    
    @ViewBag.OAVRUri
    
    
    
    "
    
    
    
    ;
         
    
    
    
    var
    
    
    
     user 
    
    
    
    =
    
    
    
     
    
    
    
    "
    
    
    
    @ViewBag.User
    
    
    
    "
    
    
    
    ;
         
    
    
    
    var
    
    
    
     pwd 
    
    
    
    =
    
    
    
     
    
    
    
    "
    
    
    
    @ViewBag.PassWord
    
    
    
    "
    
    
    
    ;

         $.ajax({
             type: 
    
    
    
    "
    
    
    
    GET
    
    
    
    "
    
    
    
    ,
             url: String.format(
    
    
    
    '
    
    
    
    {0}Account/AppLogOn?UserName={1}&PassWord={2}&callback=?
    
    
    
    '
    
    
    
    , oAUri, user, pwd),
             cache: 
    
    
    
    false
    
    
    
    ,
             error: 
    
    
    
    function
    
    
    
     () {
                 alert(
    
    
    
    "
    
    
    
    程序出错,请联系管理员.
    
    
    
    "
    
    
    
    );
             },
             dataType: 
    
    
    
    "
    
    
    
    jsonp
    
    
    
    "
    
    
    
    ,
             jsonp: 
    
    
    
    '
    
    
    
    callback
    
    
    
    '
    
    
    
    ,
             success: 
    
    
    
    function
    
    
    
     (result) {

             }
         });

     });

    
    
    
    <
    
    
    
    /
    
    
    
    script>
   
   
   
   

　　在MVC3.0中建立JSONP专用ActionResult。

　　代码如下：

   
   
   
   

    
    
    
    public
    
    
    
     
    
    
    
    class
    
    
    
     JsonpResult
    
    
    
    <
    
    
    
    T
    
    
    
    >
    
    
    
     : ActionResult
{
    
    
    
    
    public
    
    
    
     T Obj { 
    
    
    
    get
    
    
    
    ; 
    
    
    
    set
    
    
    
    ; }
    
    
    
    
    public
    
    
    
     
    
    
    
    string
    
    
    
     CallbackName { 
    
    
    
    get
    
    
    
    ; 
    
    
    
    set
    
    
    
    ; }

    
    
    
    
    public
    
    
    
     JsonpResult(T obj, 
    
    
    
    string
    
    
    
     callback)
    {
        
    
    
    
    this
    
    
    
    .Obj 
    
    
    
    =
    
    
    
     obj;
        
    
    
    
    this
    
    
    
    .CallbackName 
    
    
    
    =
    
    
    
     callback;
    }

    
    
    
    
    public
    
    
    
     
    
    
    
    override
    
    
    
     
    
    
    
    void
    
    
    
     ExecuteResult(ControllerContext context)
    {
        var js 
    
    
    
    =
    
    
    
     
    
    
    
    new
    
    
    
     System.Web.Script.Serialization.JavaScriptSerializer();
        var jsonp 
    
    
    
    =
    
    
    
     
    
    
    
    this
    
    
    
    .CallbackName 
    
    
    
    +
    
    
    
     
    
    
    
    "
    
    
    
    (
    
    
    
    "
    
    
    
     
    
    
    
    +
    
    
    
     js.Serialize(
    
    
    
    this
    
    
    
    .Obj) 
    
    
    
    +
    
    
    
     
    
    
    
    "
    
    
    
    )
    
    
    
    "
    
    
    
    ;

        context.HttpContext.Response.ContentType 
    
    
    
    =
    
    
    
     
    
    
    
    "
    
    
    
    application/json
    
    
    
    "
    
    
    
    ;
        context.HttpContext.Response.Write(jsonp);
    }
}
   
   
   
   

　　JsonpResult 简单调用如下：

   
   
   
   

    
    
    
    public
    
    
    
     ActionResult AppLogOn(
    
    
    
    string
    
    
    
     UserName, 
    
    
    
    string
    
    
    
     PassWord, 
    
    
    
    string
    
    
    
     callback)
{
  
    
    
    
    return
    
    
    
     
    
    
    
    new
    
    
    
     JsonpResult
    
    
    
    <
    
    
    
    object
    
    
    
    >
    
    
    
    (
    
    
    
    new
    
    
    
     { success 
    
    
    
    =
    
    
    
     
    
    
    
    true
    
    
    
    , rankName 
    
    
    
    =
    
    
    
     rankName }, callback);
}
   
   
   
   

　　AppLogOn的action参数完全和上文中的jquery $.ajax 参数一致：

   
   
   
   

    
    
    
    url: String.format(
    
    
    
    '
    
    
    
    {0}Account/AppLogOn?UserName={1}&PassWord={2}&callback=?
    
    
    
    '
    
    
    
    , oAUri, user, pwd)
   
   
   
   

　　小结：

　　Jsonp的服务器端的原理其实就是回调一个js函数名（这里是callback参数）将该参数传给服务端，接着再由服务器端执行这个callback js函数, 同时附上该js函数的参数。比如上文的C#代码： var jsonp = this.CallbackName + "(" + js.Serialize(this.Obj) + ")";还有一点我们要注意的就是安全隐患问题： 在使用jsonp由于涉及到跨域，需要考虑到对方站点或者对方系统的安全性问题。应当避免安全隐患，不能滥用jsonp。