// 获取后端返回的登录二维码展示 ,并解析二维码获取后端返回的参数
// 当App 扫码成功后 有确认登录和取消登录两种操作,后端根据不同的操作改变登录二维码状态
// (0:二维码失效,1:未扫码,2:扫码未确定,3:取消登录,4:确认登录)
import QrcodeDecoder from 'qrcode-decoder';
// binaryData 为后端返回的二维码文件
this.QrUrl = window.URL.createObjectURL(new Blob(binaryData));
// 解析二维码中的参数uid
const qr = new QrcodeDecoder();
qr.decodeFromImage(this.QrUrl).then(res => {
this.uid = res.data;
});
// 根据uid 轮询调用后端接口获取登录状态
this.interval = setInterval(() => {
const qrPayLoad = {
uid: this.uid,
custom: 'qrCode',
rememberMe: true,
};
getLoginStatus(this.uid).then(async res => {
if (res.msg === '3') {// 取消登录
// 清除定时器
clearInterval(this.interval);
this.$message.warning('已取消登录');
}
if (res.msg === '4') {// 确认登录
// 清除定时器
clearInterval(this.interval);
// 调用扫码登录接口获取用户信息存到cookie中
const result = await otherLogin(qrPayLoad);
if (result) {
// 自定义处理登录信息的方法
this.handleLoginInfo(result);
}
}
});
}, 2000);
web前端扫码登录
最新推荐文章于 2024-07-02 09:48:06 发布