一、同一产品移动端扫码登录PC端
- 用户访问登录页面,前端向后端请求登录的二维码和key,这个key用来索引用户登录状态。
- 服务端生成二维码,并将key(假设是"123")保存(本地或redis),然后将二维码和参数返给前端,这里可以后端生成二维码并上传到OSS,然后返回给前端二维码的地址;也可以直接返回给前端字符串,前端自己去生成二维码:www.npmjs.com/package/qrc…。
- 前端获取到key="123"和二维码后,就使用key开始轮询登录状态,等待用户扫码登录。(这里的轮询可以用websocket长连接代替)。
- 用户手机已经扫码后,将二维码中的登录标识传递给后端,后端验证登录标识的有效性后通知前端显示确认登录页面,移动端跳转到授权登录页(携带参数key="123")。
- 用户点击登录后,前端调用后端接口,通知后端:“"123"对应的用户是我,我已经授权PC网页登录了,我的用户信息是:XXXXX”。
- 后端找到"123"对应的信息,更新用户登录状态为true,并更新用户信息。前端轮询再发轮询时候,后端发现状态改变,则返回给前端登录成功,并返回登录的用户信息。
二、第三方扫码登录和自有账户扫码登录的区别
以微信扫码登录为例:
最关键的区别有两点:
- 业务服务器不是自己生成二维码,而是从微信服务器中获取带参二维码,然后给前端。
- 由于使用微信客户端扫码,业务服务器没法直接接收移动端的扫码事件,而是接收微信服务器发来的扫码事件。
简单地说,微信扫码登录过程的二维码生成和扫码都是在微信服务器,业务服务器只是做个中转工作,并记录事件信息用来进行登录。