如何实现扫码登陆

背景

最近工作原因需要在项目中加入扫码登陆功能，因为之前没有接触过所以对几个网站主流网站进行了调查。

实现方式

轮询

调查的全部网站都采用轮询的方式来实现二维码登陆，但是具体细节有不同。

以京东为例：

可以看出，在二维码登陆页面，网页会不断的请求服务器（轮询），以获取是否扫描二维码.

当完成扫码后会直接切换状态，继续轮询是否确认登陆：

这样，在手机点击确认时会直接轮询会相应并跳转页面。

这里猜测：

1. 生成二维码，二维码信息入库
2. 页面js开启轮询，服务端查库返回是否登陆
3. 手机扫码app发送请求，服务端修改库中对应记录为登陆
4. js轮询，服务端返回登陆，页面变为登陆状态进行后续操作
5. 扫码登陆结束

细微差别

淘宝

淘宝的区别是，一个轮询周期发送两天请求，一条用于确认是否扫码，另一条用于确认是否登陆。

微信网页版

微信网页版的实现逻辑相对更独特。

虽然都是轮询，但是微信没次请求间隔很长（25秒），但是在一次请求后服务端不会马上返回相应。
调查后猜测：

微信服务端在收到轮询后不会立即返回响应，而是在服务端进行循环查库，可以理解为在服务端进行轮询。
服务端在25秒内循环参考状态是否改变，如果改变则直接返回，否则25秒结束后返回为扫码。

网页端在接到状态改变后马上获取数据，展现给用户。
否则会继续发送轮询请求。

可以看出，微信的做法用户体验更好：

1. 扫码后迅速响应，不像其他的需要等待下一次请求才能触发响应。
2. 请求次数大量减少，减轻浏览器压力，同时节省用户流量。
3. 缺点是会增加服务器压力。

以上。