mvc ajax访问后台时session过期无法跳转到Login页面问题解决

1.通过MVC过滤器实现访问授权

这块儿,前面博文已经写了,可参考:http://www.cnblogs.com/lcawen/p/6235735.html

public class BaseController : Controller
    {
       protected User UserInfo
        {
            set
            {
                Session["UserInfo"] = value;
            }
 
            get
            {
                if (Session["UserInfo"] == null)
                {
                    return null;
                }
                else
                {
                    return (User)Session["UserInfo"];
                }
            }
        }
 
        protected override void OnActionExecuting(ActionExecutingContext filterContext)
        {
            //验证码
            if (filterContext.ActionDescriptor.ActionName.Equals("ValidateCode", StringComparison.CurrentCultureIgnoreCase))
            {
                return;
            }
            #region Session判断
            if (UserInfo==null && !filterContext.ActionDescriptor.ActionName.Contains("Login"))
            {
                filterContext.Result = //new RedirectResult("/Home/Login");//这样也可以
                new RedirectToRouteResult(
                        new System.Web.Routing.RouteValueDictionary { { "controller", "Home" }, { "action", "Login" } });
                //Response.Redirect("/Home/Login");//不建议这个,它会继续往下执行action
                return;
            }
            #endregion
 
            base.OnActionExecuting(filterContext);
        }
 }

前台解决嵌套iframe问题(针对ActionResult返回页面有效,用ajax请求无效)

<script type="text/javascript">
        $(function () {
           //判断一下当前是不是做顶层,如果不是,则做一下顶层页面重定向
            if (window != top) {
                top.location.href = location.href;
            }
        });  
    </script>

针对ajax请求,使用以上方式,ajax请求是没有变化的,ajax返回的状态码302,而Login返回状态码200,理论是显示的,但是:

 

Login的type是xhr即:XMLHttpRequest,正常访问Login页面时候Type为Document,如下:

 

补充:Ajax原生方法,有助于理解为什么是xhr类型:

$('#domID').click(function(){
    //请求的5个阶段,对应readyState的值
        //0: 未初始化,send方法未调用;
        //1: 正在发送请求,send方法已调用;
        //2: 请求发送完毕,send方法执行完毕;
        //3: 正在解析响应内容;
        //4: 响应内容解析完毕;

    var data = 'name=value';
    var xhr = new XMLHttpRequest();        //创建一个ajax对象
    xhr.onreadystatechange = function(event){    //对ajax对象进行监听
        if(xhr.readyState == 4){    //4表示解析完毕
            if(xhr.status == 200){    //200为正常返回
                console.log(xhr)
            }
        }
    };
    xhr.open('POST','url',true);    //建立连接,参数一:发送方式,二:请求地址,三:是否异步,true为异步
    xhr.setRequestHeader('Content-type','application/x-www-form-urlencoded');    //可有可无
    xhr.send(data);        //发送
});

知识积累不够,底层原因并没有分析出来,但是,可以通过如下方式解决这个问题:

参考:http://blog.csdn.net/weinianjie1/article/details/38270477

加入如下对ajax的扩展:

jQuery(function ($) {
    // 备份jquery的ajax方法    
    var _ajax = $.ajax;
    // 重写ajax方法,先判断登录在执行error函数   
    $.ajax = function (opt) {
        var _error = opt && opt.error || function (a, b, c) { };
        var _opt = $.extend(opt, {
            error: function (xhr, status, error) {
                // 如果后台将请求重定向到了登录页,则里面存放的就是登录页的源码,这里需要找到是登录页的证据(标记)  
               //这儿的{49cdd9d3-a473-4aef-8190-5dc5bf7b3984}是用Guid.NewGuid()生成的,是一个标识,可以随意,但是Login页面也要有
                if (xhr.responseText.indexOf('{49cdd9d3-a473-4aef-8190-5dc5bf7b3984}') != -1) {

                    top.location.href = "/Home/Login";
                    return;
                }
                _error(xhr, status, error);
            }
        });

        _ajax(_opt);
    };
});

Login页面放置标识:

<!DOCTYPE html>
<!--{49cdd9d3-a473-4aef-8190-5dc5bf7b3984}-->
<html>

ajax调用:  

$.ajax({
    type: "post",
    url: url,
    data: data,
    dataType: "json",
    success: function (data) {

    }
});

好吧,又是一次一知半解的解决了问题...争取下次弄明白原理后补充!

附:得到新思路,借鉴如下http://stackoverflow.com/questions/26235528/how-to-implement-ajax-session-timeout-redirect-in-mvchttp://stackoverflow.com/questions/15001280/ajax-call-when-session-time-out

判断当前请求是通过ajax请求否,如果是,返回session过期提醒,状态码可以返回200,也可以返回其他的,200的话在success中判断,其他的状态码在error中判断,由于这时候没有跳转到Login页面,没有去解析它,并且没有把解析后的Login页面文档赋予给xhr的ResponseText,传输到前台,也节省了带宽。问题解决思路有很多种啊,集思广益。

MVC过滤器中加入如下代码:

//ActionExecutingContext filterContext

 if (filterContext.HttpContext.Request.IsAjaxRequest())
                {
                    filterContext.HttpContext.Response.StatusCode = 401;//这个可以指定为其他的
                    filterContext.Result = new JsonResult
                    {
                        //Data = new
                        //{
                        //    ErrorMessage = "您长时间没有操作,请重新登录!"
                        //}, //这样使用,最终的结果判断时,xhr.responseText为"{ErrorMessage:"您长时间没有操作,请重新登录!"}",还需要Json转化一下
                        Data="您长时间没有操作,请重新登录!",
                        JsonRequestBehavior = JsonRequestBehavior.AllowGet
                    };
                }

ajax方法扩展如下:

jQuery(function ($) {
    var _ajax = $.ajax;
    $.ajax = function (opt) {
        var _error = opt && opt.error || function (a, b, c) { };
        var _opt = $.extend(opt, {
            error: function (xhr, status, error) {
                if (xhr.status == 401) {//status这里是error,因为是在相应中的401状态位,所以需要用xhr.status判断
                        warningInfo(xhr.responseText);//封装的弹窗提醒
                        top.location.href = "/Home/Login";//跳转到登录页面
                        return;
                    }
                    _error(xhr, status, error);
                }
        });

        _ajax(_opt);
    };
});

如下是基于easyui的弹窗封装:

//右下角弹出框;
function slide(Title, Msg) {
    jQuery.messager.show({
        title: Title,
        msg: Msg,
        timeout: 5000,
        showType: 'slide'
    });
}
//弹出框;
function alterInfo(Msg, Title) {
    if (!Title) {
        Title = "提示信息";
    }
    jQuery.messager.alert(Title, Msg);
}
//错误弹出框;
function errorInfo(Msg, Title) {
    if (!Title) {
        Title = "提示信息";
    }
    jQuery.messager.alert(Title, Msg, 'error');
}
//信息弹出框;
function successInfo(Msg, Title) {
    if (!Title) {
        Title = "提示信息";
    }
    jQuery.messager.alert(Title, Msg, 'info');
}
//警告弹出框;
function warningInfo(Msg, Title) {
    if (!Title) {
        Title = "提示信息";
    }
    jQuery.messager.alert(Title, Msg, 'warning');
}
//确认弹出框;
function confirmInfo(Msg, fun, Title) {
    if (!Title) {
        Title = "提示信息";
    }
    jQuery.messager.confirm(Title, Msg, function (event) {
        if (event == true)
            fun();
        else
            return;
    });
}
//可以输入文本的对方框;
function prompt() {
    jQuery.messager.prompt('提示:', '请输入消息.', function (r) {
        if (r) {
            alert("你输入的文本是:" + r);
        }
    })
}

mvc过滤器除了继承一个基类Controller,还可以通过重写过滤器实现,当然这些没什么价值,个人留作回忆,如下:

[AttributeUsage(AttributeTargets.Class | AttributeTargets.Method)]//目标为类或者方法,即Controller或者Action
public class MyAuthorizeAttribute : AuthorizeAttribute
{
    protected override void HandleUnauthorizedRequest(AuthorizationContext filterContext)
    {
        if (filterContext.HttpContext.Request.IsAjaxRequest())
        {
            filterContext.HttpContext.Response.StatusCode = 401;//这个可以指定为其他的
            filterContext.Result = new JsonResult
            {
                //Data = new
                //{
                //    ErrorMessage = "您长时间没有操作,请重新登录!"
                //}, //这样使用,最终的结果判断时,xhr.responseText为"{ErrorMessage:"您长时间没有操作,请重新登录!"}",还需要Json转化一下
                Data = "您长时间没有操作,请重新登录!",
                JsonRequestBehavior = JsonRequestBehavior.AllowGet
            };
            filterContext.HttpContext.Response.End();
        }
        else
        {
            filterContext.Result = //new RedirectResult("/Home/Login");
                        new RedirectToRouteResult(
                            new System.Web.Routing.RouteValueDictionary { { "controller", "Home" }, { "action", "Login" } });
        }
        //base.HandleUnauthorizedRequest(filterContext);
    }
}

[MyAuthorize]//Controller上用
public class MyController : Controller
{
    [MyAuthorize]//Action上用
    public ActionResult MyAction() { return new EmptyResult(); }
}

还可以通过如下方式:

//Step 1 - Make central method(e.g. in Master page)
 $(document).ajaxStart(function ()
{
        $.ajax({
        type: "POST",
            url: 'Home.aspx/CheckSessionTimeout',
            async: false,
            contentType: "application/json; charset=utf-8",
            dataType: "json",
            success: function(result) {
            if (parseInt(result.d) == 0)
            {
                window.location.href = 'Login.aspx';
            }
        },
            Error: function(msg) {
            window.location.href = 'Login.aspx';
        }
    });

//Step 2 Create a web method in Home.aspx page

[WebMethod(EnableSession = true)]
public static int CheckSessionTimeout()
{
    if (HttpContext.Current.Session[""] != null)
    {
        return 1;
    }
    else
    {
        return 0;
    }
}

或者如下:

//使用jQuery的$.ajaxSetup方法可以设置AJAX请求的默认参数选项,当程序//中需要发起多个AJAX请求时,则不用再为每一个请求配置请求的参数。

//当用户的session失效时可使用ajax请求时,可以使用这个函数进行判断是否//要重新跳转到登录界面(系统的过滤器发现用户ajax的请求,但用户没有登//录或session失效时返回字符串”timeOut"):
 $.ajaxSetup({
         dataFilter : function(data, type){
             console.log("data:"+data);
            if(data == "timeOut" || data == "[object XMLDocument]"){//ajax请求,发现session过期,重新刷新页面,跳转到登录页面
                 top.location.href = "/Home/Login";
            }else{
                return data;
            }
        }
    })

 或者如下:

$(document).ajaxError(function (event, jqxhr, settings, exception) {
    if (jqxhr.status === 401) {
        warningInfo(xhr.responseText);
        top.location.href = "/Home/Login";
    }
});

参考:http://stackoverflow.com/questions/23285164/redirect-to-login-page-if-ajax-url-redirects-to-login-page

附:status 返回当前请求的http状态码

status属性返回当前请求的http状态码,此属性仅当数据发送并接收完毕后才可获取。完整的HTTP状态码如下:

100 Continue 初始的请求已经接受,客户应当继续发送请求的其余部分
101 Switching Protocols 服务器将遵从客户的请求转换到另外一种协议
200 OK 一切正常,对GET和POST请求的应答文档跟在后面。
201 Created 服务器已经创建了文档,Location头给出了它的URL。
202 Accepted 已经接受请求,但处理尚未完成。
203 Non-Authoritative Information 文档已经正常地返回,但一些应答头可能不正确,因为使用的是文档的拷贝
204 No Content 没有新文档,浏览器应该继续显示原来的文档。如果用户定期地刷新页面,而Servlet可以确定用户文档足够新,这个状态代码是很有用的
205 Reset Content 没有新的内容,但浏览器应该重置它所显示的内容。用来强制浏览器清除表单输入内容
206 Partial Content 客户发送了一个带有Range头的GET请求,服务器完成了它
300 Multiple Choices 客户请求的文档可以在多个位置找到,这些位置已经在返回的文档内列出。如果服务器要提出优先选择,则应该在Location应答头指明。
301 Moved Permanently 客户请求的文档在其他地方,新的URL在Location头中给出,浏览器应该自动地访问新的URL。
302 Found 类似于301,但新的URL应该被视为临时性的替代,而不是永久性的。
303 See Other 类似于301/302,不同之处在于,如果原来的请求是POST,Location头指定的重定向目标文档应该通过GET提取
304 Not Modified 客户端有缓冲的文档并发出了一个条件性的请求(一般是提供If-Modified-Since头表示客户只想比指定日期更新的文档)。服务器告诉客户,原来缓冲的文档还可以继续使用。
305 Use Proxy 客户请求的文档应该通过Location头所指明的代理服务器提取
307 Temporary Redirect 和302(Found)相同。许多浏览器会错误地响应302应答进行重定向,即使原来的请求是POST,即使它实际上只能在POST请求的应答是303时才能重定向。由于这个原因,HTTP 1.1新增了307,以便更加清除地区分几个状态代码:当出现303应答时,浏览器可以跟随重定向的GET和POST请求;如果是307应答,则浏览器只能跟随对GET请求的重定向。
400 Bad Request 请求出现语法错误。
401 Unauthorized 客户试图未经授权访问受密码保护的页面。应答中会包含一个WWW-Authenticate头,浏览器据此显示用户名字/密码对话框,然后在填写合适的Authorization头后再次发出请求。
403 Forbidden 资源不可用。
404 Not Found 无法找到指定位置的资源
405 Method Not Allowed 请求方法(GET、POST、HEAD、Delete、PUT、TRACE等)对指定的资源不适用。
406 Not Acceptable 指定的资源已经找到,但它的MIME类型和客户在Accpet头中所指定的不兼容
407 Proxy Authentication Required 类似于401,表示客户必须先经过代理服务器的授权。
408 Request Timeout 在服务器许可的等待时间内,客户一直没有发出任何请求。客户可以在以后重复同一请求。
409 Conflict 通常和PUT请求有关。由于请求和资源的当前状态相冲突,因此请求不能成功。
410 Gone 所请求的文档已经不再可用,而且服务器不知道应该重定向到哪一个地址。它和404的不同在于,返回407表示文档永久地离开了指定的位置,而404表示由于未知的原因文档不可用。
411 Length Required 服务器不能处理请求,除非客户发送一个Content-Length头
412 Precondition Failed 请求头中指定的一些前提条件失败
413 Request Entity Too Large 目标文档的大小超过服务器当前愿意处理的大小。如果服务器认为自己能够稍后再处理该请求,则应该提供一个Retry-After头
414 Request URI Too Long URI太长
416 Requested Range Not Satisfiable 服务器不能满足客户在请求中指定的Range头
500 Internal Server Error 服务器遇到了意料不到的情况,不能完成客户的请求
501 Not Implemented 服务器不支持实现请求所需要的功能。例如,客户发出了一个服务器不支持的PUT请求
502 Bad Gateway 服务器作为网关或者代理时,为了完成请求访问下一个服务器,但该服务器返回了非法的应答
503 Service Unavailable 服务器由于维护或者负载过重未能应答。例如,Servlet可能在数据库连接池已满的情况下返回503。服务器返回503时可以提供一个Retry-After头
504 Gateway Timeout 由作为代理或网关的服务器使用,表示不能及时地从远程服务器获得应答
505 HTTP Version Not Supported 服务器不支持请求中所指明的HTTP版本

取自:http://www.cnblogs.com/gaojun/archive/2012/08/11/2633891.html

readyState状态说明:

0:未初始化
此阶段确认XMLHttpRequest对象是否创建,并为调用open()方法进行未初始化作好准备。值为0表示对象已经存在,否则浏览器会报错--对象不存在。
1:载入
此阶段对XMLHttpRequest对象进行初始化,即调用open()方法,根据参数(method,url,true)完成对象状态的设置。并调用send()方法开始向服务端发送请求。值为1表示正在向服务端发送请求。
2:载入完成
此阶段接收服务器端的响应数据。但获得的还只是服务端响应的原始数据,并不能直接在客户端使用。值为2表示已经接收完全部响应数据。并为下一阶段对数据解析作好准备。
3:交互
此阶段解析接收到的服务器端响应数据。即根据服务器端响应头部返回的MIME类型把数据转换成能通过responseBody、responseText或responseXML属性存取的格式,为在客户端调用作好准备。状态3表示正在解析数据。
4:完成
此阶段确认全部数据都已经解析为客户端可用的格式,解析已经完成。值为4表示数据解析完毕,可以通过XMLHttpRequest对象的相应属性取得数据。

概而括之,整个XMLHttpRequest对象的生命周期应该包含如下阶段:
创建-初始化请求-发送请求-接收数据-解析数据-完成
原文地址:https://www.cnblogs.com/lcawen/p/mvc.html