如果想让网站实现QQ登录功能，前提是网站要具备api的接口，如果没有这个接口，那就很难实现这个功能了。
网站QQ登录功能，是通过接入QQ登录,用户可以使用QQ账号直接登录接入的站点，从而可以达到无需注册也能登录成为网站用户。快速方便有效，可大大提高网站的用户注册数量，提升网站人气。
下面小编就告诉大家，实现这个功能的操作方法。
方法/步骤1
1
首先在百度上搜索【QQ登录】，然后进入一个名为【QQ登录-QQ互联】的网站。
或者是搜索”QQ开发开发平台“或者直接打开：http://connect.qq.com/
在网页右上角，点击【登录】，登录自己的QQ账号。
登录完成后在页面左边，点击【申请加入】。
这里认真填写开发者的申请信息，并点击【注册】，完成注册。
注册完成后，在管理中心右上角位置，点击【创建应用】。在弹出的窗口中选择应用的平台，我这里就以电脑平台作为演示。
这里就对应填写网站信息就可以了，不过我重点讲一下回调地址。回调地址很多人都不知道是什么也不会填，其实只要填写不带http://的地址就可以了。然后把鼠标放到【验证】这里，会弹出一条代码，我们把这条代码复制起来。
然后用FTP打开网站源码，找到网站头部文件，把这条代码放到【<head>与</head>之间】。然后保存起来，再回到刚才复制代码的位置点击【开始验证】。
验证成功后，我们发现还需要审核，而现在还不能提交审核，原因是还没有添加图片素材，我们点击添加【图片素材】。
在图片素材时，对应上传相同大小的图片素材。注意：这里的图片素材，最好选择网站的LOGO，因为在用户使用QQ登录时，这些图片会展现在右下角弹出的窗口中。
上传好图片素材后，我们单击顶部菜单栏中的【管理中心】，在管理中心下面，先点击【未审核】，然后再未审核的应用里再点击应用名称，进入该应用。
进入该应用后，我们便可点击【提交申请】。点击提交申请后，会弹出一个提示窗口，提示我们是否确认提交，我们选择【确认提交】。
等待审核成功，在审核期间，我们就可以先把APP ID和APP KEY填到网站上。在页面左上角我们可以看到APP ID的信息，复制他们，然后到网站后台填写上去，大功告成！
上面是获取appid和appkey：
下面是实现源码：
登录页面：
<!–start QQ登录–>
<script type=”text/javascript” src=”http://qzonestyle.gtimg.cn/qzone/openapi/qc_loader.js” data-appid=”101240479″ data-redirecturi=”http://www.baby0898.com” charset=”utf-8″></script>
<!–head引用的js文件 data-appid即是你申请的appid,data-redirecturi:是你网址–>
<!–data-appid:即是申请获取到的appid,data-redirecturi:即是申请时填写的回调地址–>
<span id=”qqLoginBtn”></span>
<script type=”text/javascript”>
var cbLoginFun = function (oInfo, oOpts) {
//alert(oInfo.nickname); // 昵称
//alert(oOpts.btnId); // 点击登录的按钮Id
window.location.href = “http://www.baby0898.com/default.aspx?nickname=” + escape(oInfo.nickname) + “&figureurl=” + escape(oInfo.figureurl);
};
QC.Login({ btnId: “qqLoginBtn”, size: “C_S” }, cbLoginFun);
</script>
<!–end QQ登录–>
default.aspx页面：
<!–begin QQ 登录–>
<script type=”text/javascript”
src=”http://qzonestyle.gtimg.cn/qzone/openapi/qc_loader.js” charset=”utf-8″ data-callback=”true”></script><!–head引用的js文件–>
<div id=”QQLogin”>
<span id=”QQnickName”>游客</span>
<span id=”QQID”>请登录</span>
<span id=”QQExit”><a href=”javascript:QC.Login.signOut();”>退出</a></span><!–退出登录–>
</div>
<script type=”text/javascript”>
//获取url参数
function getQueryString(name) {
var reg = new RegExp(“(^|&)” + name + “=([^&]*)(&|$)”, “i”);
var r = window.location.search.substr(1).match(reg);
if (r != null) return unescape(r[2]); return null;
}
window.onload = function () {
var name = getQueryString(“nickname”); //获取QQ登录后的昵称
var figureurl = getQueryString(“figureurl”); //获取QQ登录后图像
$(“#QQnickName”).html(name);
}
//判断QQ是否已经登录，获取QQ登录的唯一ID标识
if (QC.Login.check()) {//如果已登录
//向“后台”请求数据
//alert(“欢迎登录”);
QC.Login.getMe(function (openId, accessToken) {
//alert(openId);//openId是用户身份的唯一标识
$(“#QQID”).html(openId);
});
} else {
$(“#QQLogin”).hide();
}
</script>
<!–end QQ 登录–>
具体步骤参考官网：http://wiki.connect.qq.com/js_sdk%E4%BD%BF%E7%94%A8%E8%AF%B4%E6%98%8E
也可以参考：http://blog.csdn.net/wowkk/article/details/17315637
原创文章，作者：QERNM，如若转载，请注明出处：https://www.beidandianzhu.com/g/4508.html
