layui+Thinkphp5实现QQ互联一键登录代码教程

精帖 未结贴
0 1025
Templet360
Templet360 2017-06-13
悬赏:5飞吻
首先创建layui做弹窗登录
<script type="text/javascript">
layui.use(['layer','jquery'], function(){
var layer = layui.layer
,jq = layui.jquery;
jq('.login').click(function(){
layer.open({
type: 2,
title: 'QQ登陆',
maxmin: false, //开启最大化最小化按钮
shadeClose: true,
shade: 0.1,
area: ['500px', '500px'],
content: '__ROOT__/user/login.html',
end: function(){location.reload();}
});
});
})
</script>
创建模板文件:user/login.html
<script type="text/javascript" src="http://qzonestyle.gtimg.cn/qzone/openapi/qc_loader.js" data-appid="填写QQ互联ID" data-redirecturi="填写域名回调地址" charset="utf-8"></script>
<script type="text/javascript">
layui.use(['layer'], function(){
var layer = layui.layer,
$ = layui.jquery;
var is_login = QC.Login.check();
if(is_login){
var access_token = '';
var openid = '';
QC.Login.getMe(function(openId, accessToken){
access_token = accessToken;
openid = openId;
});
var paras = {oauth_consumer_key:'填写QQ互联ID',access_token:access_token,openid:openid};
QC.api('get_user_info', paras).success(function(s){
//成功回调,通过s.data获取OpenAPI的返回数据
var param ={openid:openid,username:s.data.nickname,userhead:s.data.figureurl_qq_2,sex:s.data.gender};
$.post('{:url("index/login/loginqq")}',param,function(res){
if(res.code == 200){
QC.Login.signOut()//注销qq登陆
layer.msg(res.msg, {icon: 1, anim: 6, time: 1000});
var index = parent.layer.getFrameIndex(window.name); //先得到当前iframe层的索引
parent.layer.close(index); //再执行关闭
}else{
layer.msg(res.msg, {icon: 2, anim: 6, time: 1000});
}
});

//alert("获取用户信息成功!当前用户昵称为:"+s.data.nickname);
});

}else{
self.location.href='https://graph.qq.com/oauth2.0/authorize?client_id=填写QQ互联ID&response_type=token&scope=all&redirect_uri='+encodeURIComponent(self.location.href);
}
});
</script>
创建控制器文件 如:loginqq
public function loginqq()
{
$member = new MemberModel();
if (request()->isPost()) {
$data = input('post.');
$user = $admin->where('openid', $data['openid'])->find();
if ($user) {
//这里填写你需要写入的数据库
$admin->edit($data);
} else {
//这里填写你需要写入的数据库
$admin->add($data);
}
return json(array('code' => 200, 'msg' => '登录成功'));
}
}
代码案例: https://www.templet360.com/ 交流群:423348395
  • 没有任何回答
近期热议
layui 官网累计下载量突破 200000 69
(已结束)LayIM 3.x 标准版盛情巨惠,以最低门槛 加入 LayIM 会员群 56
很好奇社区里使用layui的程序员里面是前端的多还是后端的多 25
字体图标是不是有点少了 16
php多久能学会 15
建议LayUI永久免费,不要发布收费版本 14
有购买LayIm 整套的朋友吗?进来解答解答 14
按照社区的模版用了一周时间,仿照了个系统,献丑了,晒晒哈 14
关于动态TABLE 12
贤心你好,请教几个技术问题? 11
layui

微信扫码关注 layui 公众号