官网demo地址。http://connect.qq.com/intro/login/jssdk-demo 解释的太详细了。。
主要是获得返回的key。根据自己的业务绑定用户。最好加个个绑定的表。这样以后扩展其他第三方联合登录时只是多了个类型。直接放到用户表中每次都得加字段。。。
1.申请openid和关联网站
http://connect.qq.com/intro/login/嗨学测试地址
http://t1.highso.net.cn
APP ID: 100246321
KEY: 8513f19e1a74b89ae3e6b6645d8f3173
2.http://connect.qq.com/intro/login/jssdk
页面生成代码
<script type="text/javascript" src="http://qzonestyle.gtimg.cn/qzone/openapi/qc.js#appId=100246321" charset="utf-8" ></script>
<!-- QQ 联合登录 -->
<script type="text/javascript" src="http://qzonestyle.gtimg.cn/qzone/openapi/qc.js#appId=100246321" charset="utf-8" ></script>
<span id="qqLoginBtn"></span>
<script type="text/javascript">
//调用QC.Login方法,指定btnId参数将按钮绑定在容器节点中
QC.Login({
//btnId:插入按钮的节点id,必选
btnId:"qqLoginBtn",
//用户需要确认的scope授权项,可选,默认all
scope:"all",
//按钮尺寸,可用值[A_XL| A_L| A_M| A_S| B_M| B_S| C_S],可选,默认B_S
size: "A_M"
}, 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),
figureurl : reqData.figureurl
}));
//绑定QQ页面,临时模拟
if(QC.Login.check()){//如果已登录
QC.Login.getMe(function(openId, accessToken){
alert(["当前登录用户的", "openId为:"+openId, "accessToken为:"+accessToken].join("\n"));
});
//这里可以调用自己的保存接口
}
if(confirm("您是否已经有嗨学网帐号")){
showLoginDiv();
}else{
showRegisterDiv();
}
}, function(opts){//注销成功
alert('QQ联合登录 注销成功');
}
);
</script>
3.demo页面
http://connect.qq.com/intro/login/jssdk-demo