zoukankan      html  css  js  c++  java
  • js 检查登录态方法封装(闭包、状态缓存)

    前端页面开发时,经常需要异步校验登录态,每次都重新copy之前写的方法,比较繁琐不好维护,固将登录态校验封装成一个js。

    (function(){
        //登录状态 1 登录态有效 2 登录态无效 3 请求超时
        var status;
        //状态到期时间戳
        var status_exprie_timestamp;
        //默认超时时间(秒数)
        var default_exprie_time = 60;
        //限定协议名只能为https 或 http
        var lp = "https:" == document.location.protocol ? 'https:' : 'http:';
    
        //检测是否登录
        //login_user_id 用户id | session_id 会话id | callback 成功失败超时后的回调函数
        //超时时间5秒
        function check_login(login_user_id,session_id,callback){
            //有状态 且 未过期 且 状态不为3(请求超时) 直接调用callback不更新过期时间戳
            if(status && !status_is_expire() && status != 3){
                callback(status);
                return ;
            }
    
            //格式判断
            if(!check_login_user_id(login_user_id) || !check_session_id(session_id)){
                exec(2,callback);
                return ;
            }
    
            //构建请求相关的变量
            var ajax_url = lp+'//host/xxx';
            var data = {
                'login_user_id':login_user_id,
                'session_id':session_id,
                'onlyjson':0,
                't':new Date().getTime()
            };
    
            //请求
            $.ajax({
                type : "get",
                url : ajax_url,
                data : data,
                timeout : 5000,
                dataType : "jsonp",
                success : function(data){
                    if(data.rtn==0){
                        exec(1,callback);
                    }else{
                        exec(2,callback);
                    }
                },
                error:function(data, error_type, xhr){
                    if(error_type=='timeout'){
                        exec(3,callback);
                    }else{
                        exec(2,callback);
                    }
                }
            });
        }
    
        // 同check_login 但不需要传login_user_id 和 session_id
        function esay_check_login(callback){
            var login_user_id = get_login_user_id();
            var session_id = get_session_id();
            check_login(login_user_id,session_id,callback);
        }
    
        //判断用户id格式
        function check_login_user_id(login_user_id){
            return /^[0-9]{4,}$/.test(login_user_id);
        }
    
        //判断会话id格式
        function check_session_id(session_id){
            return /^[0-9a-fA-F]{20,40}$/.test(session_id);
        }
    
        //获取用户id
        function get_login_user_id(){
            return _get('login_user_id') ? _get('login_user_id') : getCookie('login_user_id');
        }
    
        //获取会话id
        function get_session_id(){
            return _get('session_id') ? _get('session_id') : getCookie('session_id');
        }
    
        //获取当前的时间戳(秒) 
        //add_sec 可选 为当前时间戳(秒)加上相应的秒数
        function get_now_timestamp(add_sec){
            var timestamp = Date.parse(new Date())/1000;
            if(add_sec && !isNaN(add_sec)){
                timestamp +=  parseInt(add_sec);
            }
            return timestamp;
        }
    
        //判断状态是否超时
        function status_is_expire(){
            var now_timestamp = get_now_timestamp();
            return status_exprie_timestamp && now_timestamp>=status_exprie_timestamp ? true : false;
        }
    
        //获取query参数方法
        function _get(name){
            var reg = new RegExp("(^|&)"+ name +"=([^&]*)(&|$)");
            var r = window.location.search.substr(1).match(reg);
            if(r!=null)return  unescape(r[2]); return null;
        }
    
        //设置状态、超时时间 且 调用回调函数
        function exec(_status,callback){
            status = _status;
            status_exprie_timestamp = get_now_timestamp(default_exprie_time);
            callback(status);
        }
    
        //获取指定名称的cookie
        function getCookie(name){ 
            var arr=document.cookie.split('; ');
            if(!arr)return false;
            for(var i=0;i<arr.length;i++){ 
                var one=arr[i].split('='); 
                if(one[0]==name)return one[1]; 
            } 
            return false;
        }
    
        //抛出变量、方法
        window.check_login = check_login;
        window.esay_check_login = esay_check_login;
        window.LOGIN_SUCC = 1;
        window.LOGIN_FAIL = 2;
        window.LOGIN_TIMEOUT = 3;
    })();

    调用方法

    check_login(login_user_id,session_id,function(status){
    
    if(status == LOGIN_SUCC){
    //xxx
    }else if(status == LOGIN_FAIL){
    //xxx
    }else if(status == LOGIN_TIMEOUT){
    //xxx
    }
    
    });
  • 相关阅读:
    SQL条件的顺序对性能的影响
    在客户端通过外部表访问Trace文件的内容
    Vue 数据持久化
    .Net 垃圾回收机制原理(一)
    密码管理工具KeePass
    SQL Server附加数据库 5123
    网页编码就是那点事
    你真想到了50岁还靠编程来养家糊口吗?
    技术敏感度 — 基层技术管理者必备
    虚拟化、云计算
  • 原文地址:https://www.cnblogs.com/lzs-888/p/6727886.html
Copyright © 2011-2022 走看看