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
4.实现方案
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文件:
由于我是使用的Angular,这里通过这个js对其简单的封装;在ts中在用到的地方 ,然后直接调用 goEasyUtils.getMessage('xxxx');
5.基于SSE实现
我们曾如此渴望生命的波澜,到后来才发现,人生最曼妙的风景是内心的淡定与从容
参考: 全网最全的扫码登录实现方案
评论区