全网最全的扫码登录实现方案
1.什么是扫码登录?
web端登录,为了实现方便性以及安全性,展示二维码,APP端扫码,完成登录流程,要求:自己的web服务,自己的APP(使用第三方登录微信QQ);大致流程如下:
2.技术难点
手机扫码完成后调用后端登录接口,完成登录,这里服务器需要通知前端说我已经登录完成,你可以开始跳转了;说白了就是服务器向客户端推送消息的流程;
3.二维码生成
java端使用google的zxing包,生成二维码;将二维码一Base64的方式传到前端;Google的依赖是:
<dependency> <groupId>com.google.zxing</groupId> <artifactId>core</artifactId> <version>3.3.0</version> </dependency>
二维码生成以及转Base工具类下载链接: https://pan.baidu.com/s/14r4OTBQlB236YYYu3Uav3w
3.实现方案
1.最实用运用最广的实现方案(90%使用率)
前端轮询实现,目前运用的企业:CSDN,支付宝,京东等
2.短连接+轮询 -- polling(即时)
微信网页版扫码登录;
何为短连接:客户端向后端发送请求,后端没有消息推送客户端,则阻塞当前线程,等N秒后,仍没有消息,response前端;
前端:
先看微信的前端场景:
如无消息,在阻塞20秒左右响应408,并开启新的请求:
则前端只需要保证收到错误的状态码,重新发起请求即可;
后端:
Tomcat连接数有限,如果一个连接需要占用连接20秒,那么用户一多连接数很快消耗殆尽,这里需要使用DeferredResult来异步实现;具体实现方法看:https://www.cnblogs.com/code-sayhi/articles/10191526.html
Redis(list+blpop):redis存储用户是否扫码登录成功;基于redis和blpop来实现没有消息阻塞后端线程固定时间;(这里只说具体思路)
3.websocket
基于netty-socketIO实现web端和服务端通信;具分布式部署方案以及相关信息见: https://www.cnblogs.com/code-sayhi/articles/11327487.html
4.第三方goeasy消息即时通信
即时,不占用服务器资源,开发简单,总知哪都好就是“要钱”;确定:并发量小,服务真的贵,自己使用websocket轻松可以实现2万的并发
下面说下简单的实现:
4.1:进入官网:https://www.goeasy.io ;创建免费应用
后端:下载相应依赖,代码如下:
@Controller @RequestMapping("/goeasy") public class GoEasyController { @ResponseBody @RequestMapping(value = "/sendMessage", method = RequestMethod.POST) public void readMessage(@RequestBody String channel) { GoEasy goEasy = new GoEasy( "https://rest-hangzhou.goeasy.io", "BC-d7920b8c7567461d8042935546fc3360"); goEasy.publish(channel,"Hello, GoEasy!", new PublishListener(){ @Override public void onSuccess() { System.out.print("消息发布成功。"); } @Override public void onFailed(GoEasyError error) { System.out.print("消息发布失败, 错误编码:" + error.getCode() + " 错误信息: " + error.getContent()); } }); } }
前端:导入对应的js文件:
goEasyUtil.js 由于我是使用的Angular,这里通过这个js对其简单的封装;
在ts中在用到的地方,然后直接调用
5.基于SSE实现