js如何调用qq互联api实现第三方登录


Posted in Javascript onMarch 28, 2014

qq互联js SDK:http://wiki.connect.qq.com/js_sdk%E4%BD%BF%E7%94%A8%E8%AF%B4%E6%98%8E

<script type=text/javascript> 在页面header中引入:<script type="text/javascript" 
src="http://qzonestyle.gtimg.cn/qzone/openapi/qc_loader.js" 
data-appid="appid" data-redirecturi="huidiaodizhi(带http)" 
charset="utf-8"></script> 
在body中加入下面信息: 
//设置qq分享按钮 
QC.Login( 
{ 
btnId : "qqLoginBtn" //插入按钮的节点id 
}, 
function(reqData, opts) {//登录成功 
//根据返回数据,更换按钮显示状态方法 
var dom = document.getElementById(opts['btnId']), _logoutTemplate = [ 
//头像 
'<span><img src="{figureurl}" class="{size_key}"/></span>', 
//昵称 
'<span>{nickname}</span>', 
//退出 
'<span><a href="javascript:QC.Login.signOut();">退出</a></span>' ] 
.join(""); 
dom 
&& (dom.innerHTML = QC.String 
.format( 
_logoutTemplate, 
{ 
nickname : QC.String 
.escHTML(reqData.nickname), //做xss过滤 
figureurl : reqData.figureurl 
})); 
}, 
function(opts) {//注销成功 
alert("注销成功!!"); 
}); 
//调用api授权 
QC.api("get_info", { 
"oauth_consumer_key" : "appid" //这个可以不用传递 
}).success(function(s) { 
if (QC.Login.check()) {//检测是否成功登录,并弹出openid和accessToken 
QC.Login.getMe(function(openId, accessToken) { 
alert(openid+" "+accessToken); 
}); 
} 
}); 
</script> 
<div class="lib_tiv shadow"> 
<h3 class="logo">QQ登录</h3> 
</div>
Javascript 相关文章推荐
客户端静态页面玩分页
Jun 26 Javascript
jQuery toggle()设置CSS样式
Nov 05 Javascript
JavaScript中的ArrayBuffer详细介绍
Dec 08 Javascript
jQuery实现两款有动画功能的导航菜单代码
Sep 16 Javascript
浅析javascript函数表达式
Feb 10 Javascript
Javascript数组Array方法解读
Mar 13 Javascript
浅谈JavaScript变量的自动转换和语句
Jun 12 Javascript
Vue学习笔记进阶篇之过渡状态详解
Jul 14 Javascript
浅析Vue自定义组件的v-model
Nov 26 Javascript
JavaScript生成指定范围随机数和随机序列的方法
May 05 Javascript
jquery实现轮播图特效
Apr 12 jQuery
JavaScript最完整的深浅拷贝实现方式详解
Feb 28 Javascript
jQuery的3种请求方式$.post,$.get,$.getJSON
Mar 28 #Javascript
jquery获取颜色在ie和ff下的区别示例介绍
Mar 28 #Javascript
js中精确计算加法和减法示例
Mar 28 #Javascript
查找页面中所有类为test的结点的方法
Mar 28 #Javascript
js 验证身份证信息有效性
Mar 28 #Javascript
JS中怎样判断undefined(比较不错的方法)
Mar 27 #Javascript
调用jQuery滑出效果时闪烁的解决方法
Mar 27 #Javascript
You might like
第五章 php数组操作
2011/12/30 PHP
php微信开发之关注事件
2018/06/14 PHP
PHP如何防止用户重复提交表单
2020/12/09 PHP
return false,对阻止事件默认动作的一些测试代码
2010/11/17 Javascript
jquery 图片上传按比例预览插件集合
2011/05/28 Javascript
使用node.js 获取客户端信息代码分享
2014/11/26 Javascript
js获取内联样式的方法
2015/01/27 Javascript
Jquery中的$.each获取各种返回类型数据的使用方法
2015/05/03 Javascript
jQuery实现动画效果circle实例
2015/08/06 Javascript
使用jQuery Ajax 请求webservice来实现更简练的Ajax
2016/08/04 Javascript
Angular6 用户自定义标签开发的实现方法
2019/01/08 Javascript
layui switch 开关监听 弹出确定状态转换的例子
2019/09/21 Javascript
JS 逻辑判断不要只知道用 if-else 和 switch条件判断(小技巧)
2020/05/27 Javascript
详解Vue之事件处理
2020/07/10 Javascript
[01:02:55]CHAOS vs Mineski 2019国际邀请赛小组赛 BO2 第二场 8.16
2019/08/18 DOTA
在Django框架中设置语言偏好的教程
2015/07/27 Python
Python使用zip合并相邻列表项的方法示例
2018/03/17 Python
numpy的文件存储.npy .npz 文件详解
2018/07/09 Python
python flask框架实现传数据到js的方法分析
2019/06/11 Python
sklearn和keras的数据切分与交叉验证的实例详解
2020/06/19 Python
python实现批处理文件
2020/07/28 Python
django和flask哪个值得研究学习
2020/07/31 Python
sublime3之内网安装python插件Anaconda的流程
2020/11/10 Python
Django项目在pycharm新建的步骤方法
2021/03/02 Python
多重CSS背景动画实现方法示例
2014/04/04 HTML / CSS
html5 外链式实现加减乘除的代码
2019/09/04 HTML / CSS
凯特方迪化妆品官网:Kat Von D Beauty
2016/11/15 全球购物
NBA欧洲商店(西班牙):NBA Europe Store ES
2019/04/16 全球购物
台湾屈臣氏网路商店:Watsons台湾
2020/12/29 全球购物
社区务虚会发言材料
2014/10/20 职场文书
2014年管理工作总结
2014/11/22 职场文书
2014年销售人员工作总结
2014/11/27 职场文书
户外活动总结
2015/02/04 职场文书
2015年司法局工作总结
2015/05/22 职场文书
校园安全主题班会
2015/08/12 职场文书
Oracle中日期的使用方法实例
2022/07/07 Oracle