扫码授权登陆

手机授权扫码登陆

首先输入账号密码，进行验证，验证成功后显示手机授权二维码

这个是扫码授权的代码实现

var numT;
var token;
var t1;
	<%--获取二维码--%>
	function getCode(){
		numT=0;
		$.ajax(
				{
					type:"post",
					dataType:"json",
					url:"获取二维码的接口地址",
					success:function(result)
					{
						<%--返回二维码图片地址--%>
						$("img").attr('src',result.data.url); 
					    <%--同时得到具有时效的token--%>
						 token = {"token":result.data.token.toString()};
	                   <%--规定二维码时效性--%>
						 numT=0;
						<%--3s请求一次 确认一次状态--%>
						 t1 = setInterval(sureStuts,3000);
					}
				});
	}
	/* 定时状态确认
	确认手机授权情况
	*/
	function sureStuts(){
		$.ajax(
				{
			type:"post",
			dataType:"json",
			url:"状态确认地址，获取传输token",
			data:token,
			success:function(result)
			{
				<%--成功授权--%>
				if(result.flag.toString()=="true"){
						numT=0;//请求次数清零
						window.clearInterval(t1); //定时任务销毁
						helpDirect(result.key);//登陆成功，传输个人key，进入个人的系统后台界面，跳转页面
					}else{	numT++;	}//次数+1
	            //超时操作
	           //当请求次数大于MAXnum，次数清零,停止定时任务，重新获取授权二维码
				if(numT>=MAXnum){
					window.clearInterval(t1);
					$("#bt").show();
	  				numT=0;
$("#tishi").html("二维码已失效点击刷新").css("color","rgb(254,0,0)").click(function(){getCode();$(this).html('请使用云之家扫一扫').css("color","#666")})
				}
			}
	  });
}

　登陆的js 通用

/**
 * Created by GT on 2017/12/10.
 */
var login={
   basePath:"",
   URL:{
       //登陆地址
       managerLogin:function () {
           return login.basePath+'login';
       },
       //首页地址
       index:function () {
           return login.basePath+'index';
       }
   },
   initView:function(param){
           login.basePath=param['basePath'];
           // 切换图形验证码
           $("#codeImage").click(function () {
               $(this).attr("src",$(this).attr("src")+'?'+Math.random());
           });
           //登陆操作
           $("#loginBtn").click(function () {
               login.managerLogin();
           });
           //警告框隐藏
           $("#errorTip").hide();
   },
    // 切换图形验证码
    getCodeImage:function () {
        var verify=document.getElementById('codeImage');
        verify.setAttribute('src',login.basePath+'vcode?'+Math.random());
    },
    //管理员登陆操作
    managerLogin:function () {
        //首先判断用户是否输入用户名及密码及验证码
        $("#errorTip").hide();
        var enterValue = $("#patchaNum").val();
$.post(login.URL.managerLogin(),{userId:$("#managername").val(),userKey:$("#managerpassword").val(),vcode:enterValue},function (result) {
            if(result){
                if(result['success']){
                    /*获取授权二维码*/
                    getCode();
                    $("#errorTip").hide();
                }else{
                    $("#errorTip").html('<strong>错误提示:</strong>'+result['message']).show();
                    /*重新刷新二维码*/
                    $(".code_image").click();
                    //清空表单
                    $("#form").reset();
                    login.getCodeImage();
                }
            }else{
                $("#errorTip").html('未知异常，请联系管理解决');
            }
        });
    }
}

　　效果展示

  请求超时