纯前端的QQ内置浏览器内网页的QQ登录实现
和上方简述里面描写的一样,首先这比较适合用在移动端上,PC有更好的无刷新登录的方式
然后这个适合在检测到当前页面是QQ内置浏览器的时候使用,因为在内置浏览器内,用户的信息是会由QQ那边自动填充当前登录的帐号。如果在其它浏览器内,需要用户手动来写帐号密码,体验太差。
如果你的项目满足以上两点,那么可以考虑使用本项目了 :)
首先需要在QQ的开放平台注册网站,配置好域名并获取你的appId
然后把项目里面的login-redirect.html
放到注册的网站下的某个路径,同时需要登录的页面也是在网站域名下的。
修改qq-login.js
的toLogin
方法里面由花括号包裹的两个地方的配置。
以上,配置完成,可以顺利在项目里面使用了
// main.js
var qqLogin = require('qq-login');
// 这个用来判断用户是否是上次跳转登录回来的,保证了一个简单的上下文的承接
if (qqLogin.isFromLoginSuccess()) {
console.log('恭喜,登录成功!');
}
if (qqLogin.isLogin()) {
qqLogin.getUserInfo(function(openId, token){
// 基于这两个数据,可以获取QQ用户相关其它信息
console.log('你的openId: '+openId+', token: '+token);
});
} else {
$loginBtn.show().click(qqLogin.toLogin);
}
更多的说明,可以参考我的文章
把QQ的相关接口整合进来。