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

精帖 未结贴
0 416
首先创建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
空闲广告位,联系:xianxin@layui.com
  • 没有任何回答
最近热帖
完全基于 layui 开发的后台管理模板 2608
三层导航怎么做? 615
「源码市场」 正式版本上线 基于layui开发 546
2.0啥时候出啊,新项目要启动了 485
给2.0一些期待 416
麻烦朋友们投个票呗,FLY社区模板+thinkphp5驱动+个人DIY 367
layui整合datatable了么 301
ajax修改资料成功后 怎么进行初始化 页面刷新还是调用登录时的缓存 258
form.render('select') 更新渲染问题 228
select 动态操作不起作用,求助 195
近期热议
完全基于 layui 开发的后台管理模板 35
layui富文本编辑器图片上传无法回显 15
表单校验无效,找了好长时间找不到原因,求大神看下 14
select 动态操作不起作用,求助 10
ajax修改资料成功后 怎么进行初始化 页面刷新还是调用登录时的缓存 10
给2.0一些期待 9
如何给弹出层传参数? 8
文本编辑器出不来 8
laytpl不解析 8
content: 如果是调用本地的html,怎么写 7