实现扫码登录,及扫码登录的原理理解(javaweb实现扫码登陆)

296 阅读1分钟

本文已参与「新人创作礼」活动,一起开启掘金创作之路。
1.首先看下实现的思路 大概思路就是这样的 2.废话不多说上代码 第一步(后端生成临时令牌及存储起来)

	//存储二维码维一临时令牌
			public static Set<String> tokens = new HashSet<>();
			//存储toke绑定的用户key为tokens令牌 value 为userinfo信息
			public static Map<String,Object> usersmap = new HashMap<String,Object>();
			//标记二维码的状态有没有被扫过
			public static Map<String,Object> usersstatus = new HashMap<String,Object>();
			//生成二维码
		@RequestMapping("getQRcode")
		@ResponseBody
		public Map<String,Object> getQRcode(){
			Map<String,Object> map =new HashMap<String, Object>();
			String uid = UUID.randomUUID().toString();
			tokens.add(uid);
			map.put("uid", uid);
			return map;
		}
		
第二步 页面(我用的时jsp)生成二维码 同时轮询后台

//生成二维码
$.ajax({
   			 	type:"post",
   				url:"${pageContext.request.contextPath}/app/getQRcode",
   				dataType:"json",
   				success:function(data){
   					   new QRCode(document.getElementById('qrcode'),{text:"http://ip:port/project?token="+临时令牌,height:200,width:200});
   			           
   				}
   		});


//开始轮询
var t2 = window.setInterval(function() {
        		 var token = $('#token').val();
        		 if(token){
        			 $.ajax({
        				 	type:"post",
        				 	data:{"token":token},
        url:"${pageContext.request.contextPath}/app/scanLogin",
        					success:function(data){
        						console.log(data.code);
        						if(data.code==200){
        							clearInterval(t2);
        	                        window.location.href = "${pageContext.request.contextPath}/*/main";
        						}else if(data.code==300){
        							$("#qrcode").attr("style","filter: blur(3px);");
        							layer.msg(data.name+"扫码成功");
        							//失效时间
        							setTimeout(qingli,300000);
        						}
        					}
        					});
        			 
        		 }
        		},1000)

第 三步 扫码 1.app拿到token和用户信息去绑定

@ResponseBody
		@RequestMapping("bindinguser")
		public String bindinguser(String loginName, String token,String pwd,HttpSession httpsession){
			System.err.println(loginName+"--"+"---"+token+"-----"+pwd);
			for (String t:tokens) {
				if(t.equals(token)){
					 QueryWrapper<Account> queryWrapper=new QueryWrapper<>();
					 queryWrapper.eq("account_loginname", loginName);
					 queryWrapper.eq("account_loginpassword", pwd);
					 Account accounts =accountService.findone(queryWrapper);
					 usersmap.put(token,accounts);
					 usersstatus.put(token, "FALSE");
					return "200";
				}
			}
			return "100";
		}

2.返回给app绑定成功 去确认登录 (此时页面轮询得知绑定用户)

@ResponseBody
		@RequestMapping("Confirmlogin")
		public String determine(String token){
			usersstatus.put(token, "TRUE");
			return "200";
		}

3.此时的所有条件都齐全

//轮询登录
		@RequestMapping("scanLogin")
		@ResponseBody
		public Map<String,Object> scanLogin(String token,HttpSession httpsession) {
			Map<String,Object> map =new HashMap<String, Object>();
			if(token==null) {
				map.put("code", 100);
			}
			if(usersmap.get(token)!=null && usersstatus.get(token).equals("TRUE")) {
				//这写自己的登录方法
				
				map.put("code", 200);
				usersmap.remove(token);
				usersstatus.remove(token);
				tokens.remove(token);
				return map;
			}else if(usersmap.get(token)!=null && usersstatus.get(token).equals("FALSE") ){
			//通知页面谁扫码了等待确认
				用户信息 userinfo = usersmap.get(token);
				map.put("user",userinfo );
				map.put("code",300);
				return map;
			}
			map.put("code", 0);
			return map;
		}

到这基本上流程是完了。(app的扫码与web的通信之前的博客有写大家感兴趣的可以去看看)

感兴趣的可以试试!有什么问题评论就可以了!