ajax处理token非法或失效

在日常的开发中,经常会遇到token超时或非法的处理,这个时候就需要前端根据不同情况处理对应问题。但页面的接口又非常的多,不知道这种异常会从哪个接口抛出,总不可能给所有方法添加相关代码。所以就需要一个统一处理的方法,在此之前需要了解下面这个方法。
ajaxSetup
该方法用于设置ajax的全局默认设置,比如

$.ajaxSetup( {
    url: "/index.html" , // 默认URL
    async: false , // 默认同步加载
    type: "POST" , // 默认使用POST方式
    headers: { // 默认添加请求头
        "Author": "CodePlayer" ,
        "Powered-By": "CodePlayer"
    } ,
    error: function(jqXHR, textStatus, errorMsg){ // 出错时默认的处理函数
        // jqXHR 是经过jQuery封装的XMLHttpRequest对象
        // textStatus 可能为: null、"timeout"、"error"、"abort"或"parsererror"
        // errorMsg 可能为: "Not Found"、"Internal Server Error"等       
    }
} );

设置了默认值之后,后面所有的ajax请求url ,type,等的默认值均已被ajaxSetup()加上,如果没有设置参数就使用默认值,如果设置了就使用自己设置的参数值

//没有设置参数则使用默认值
$.ajax( );
// 设置了url、type、success、error,就使用自己设置的参数值
// 但async、headers等参数的默认值已被$.ajaxSetup()更改
$.ajax( {
    url: "xxxxxxxx" ,
    type: "GET" ,
    success: function( data, textStatus, jqXHR ){
        console.log(data,'返回数据')
    } ,
    error: function(jqXHR, textStatus, errorMsg){
        console.log(errorMsg)     
    }
});

然后这个要怎么处理token失效呢?需要用到下面这个方法

complete:function  //ajax 请求完成激活本事件。这个方法很方便完成ajax 异常的处理。

通过这个方法可以拿到每次请求的返回状态,通过他的errorCode判断他的错误类型从而执行不同的处理方式

//处理token失效
            $.ajaxSetup({
            contentType:"application/x-www-form-urlencoded;charset=utf-8",
            complete:function(XMLHttpRequest,textStatus){
                // 通过XMLHttpRequest取得响应结果
                var res = XMLHttpRequest.responseText;
                try{
                    var jsonData = JSON.parse(res);
                    // console.log("ajax",jsonData)
                    if(jsonData.errorCode == "session_timeout" || jsonData.errorCode == "invalid_login" || jsonData.errorCode == "invalid_token"){
                        //如果超时就处理 ,指定要跳转的页面(比如登陆页)
                        that.$message({
                                type:'error',
                                 offset:4,
                                message:"身份信息过期,请重新登录!",           //  type:success/warning/info/error
                                showClose:true
                            })
                        setTimeout(()=>{
                          需要进行的操作,比如跳转到登录页
                            that.$router.push({path:'/'});
                        },1000)
                    }else if(jsonData.code == "ok"){
                        //正常登录,无异常。
                    }
                }catch(e){
                }
            }
        });

如果对请求方法进行了封装,那就可以在封装的方法中处理一下这些错误,如果没有封装就可以使用此方法统一处理。
本人新手一枚,如有错误,请大佬指正!

  • 1
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值