網(wǎng)站要集成QQ登錄首先要到QQ互聯(lián)申請開發(fā)賬號剑逃，審核通過后創(chuàng)建web項(xiàng)目或移動app項(xiàng)目潮改。本文使用web項(xiàng)目進(jìn)行QQ登錄集成热康。QQ互聯(lián)網(wǎng)址：https://connect.qq.com/
開發(fā)賬號審核通過后讯沈，在應(yīng)用管理里創(chuàng)建應(yīng)用凝果，可以創(chuàng)建網(wǎng)站應(yīng)用和移動應(yīng)用祝迂，本文選擇創(chuàng)建移動應(yīng)用：
首先需要填寫網(wǎng)站的類型，網(wǎng)站名稱器净，網(wǎng)站簡介型雳。
創(chuàng)建成功后需要補(bǔ)充應(yīng)用信息，主要補(bǔ)充的內(nèi)容有：網(wǎng)站地址和網(wǎng)站回調(diào)域山害，這個是開發(fā)和測試的時候需要使用的纠俭，要填寫正確，主辦方和網(wǎng)站備案號浪慌，如果是正式上線項(xiàng)目填寫真實(shí)信息冤荆，審核通過后可用。如果是測試這兩個誰便填寫权纤，但是審核不會通過钓简，審核不通過也會生成appid和密碼，可以進(jìn)行測試開發(fā)了汹想。
QQ第三方登錄提供多種方式外邓，使用JSSDK的方式集成網(wǎng)站應(yīng)用比較簡單。
可以參考：http://wiki.open.qq.com/wiki/%E3%80%90QQ%E7%99%BB%E5%BD%95%E3%80%91JS_SDK%E4%BD%BF%E7%94%A8%E8%AF%B4%E6%98%8E#1._.E5.AE.9E.E7.8E.B0QQ.E7.99.BB.E5.BD.95.E5.8A.9F.E8.83.BD
1. 實(shí)現(xiàn)QQ登錄功能
開發(fā)者只需要按以下四個步驟粘貼代碼到網(wǎng)頁古掏，即可實(shí)現(xiàn)QQ登錄功能损话，過程非常簡單快速。現(xiàn)在就去體驗(yàn)槽唾。
1.1 引用JS SDK的JavaScript文件
1. 首先需要申請接入QQ登錄丧枪，并成功獲取到appid和appkey光涂。
2. 在html頁面適當(dāng)?shù)奈恢靡隞S腳本包（將下面代碼中的“APPID”替換為申請接入QQ登錄時獲得的appid；"REDIRECTURI"替換為申請接入QQ登錄時輸入的回調(diào)地址）：
src="http://qzonestyle.gtimg.cn/qzone/openapi/qc_loader.js" data-appid="APPID" data-redirecturi="REDIRECTURI" charset="utf-8">
1.2. 放置QQ登錄按鈕
在html頁面需要插入QQ登錄按鈕的位置豪诲，粘貼如下代碼：
? ? QC.Login({
? ? ? btnId:"qqLoginBtn" //插入按鈕的節(jié)點(diǎn)id
});
上述代碼中放置了一個html元素節(jié)點(diǎn)顶捷，并給該節(jié)點(diǎn)指定全頁面唯一的id，例如上面例子中的屎篱；開發(fā)者也可將其改成自定義的按鈕名稱蠢笋。
上述步驟正確執(zhí)行后突雪，頁面粘貼上述代碼處會出現(xiàn)如下按鈕：
點(diǎn)擊該按鈕郭宝，即可發(fā)起登錄請求蝇裤。
若需要對登錄按鈕進(jìn)行設(shè)置，請自定義登錄按鈕秦士。將修改后的代碼粘貼到頁面中放置登錄按鈕處缺厉。
JS SDK封裝了獲取Access Token以及OpenID的方法，因此開發(fā)者不需要再開發(fā)代碼進(jìn)行獲取隧土，直接調(diào)用QQ登錄OpenAPI即可提针。
1.3. 回傳Access Token和OpenID
該步驟的作用是回調(diào)地址將獲取到的Access Token和OpenID返回給調(diào)用頁面。
在回調(diào)地址頁面曹傀，即1.1節(jié)中回調(diào)地址“REDIRECTURI”指定的頁面辐脖，粘貼如下代碼：
src="http://qzonestyle.gtimg.cn/qzone/openapi/qc_loader.js" charset="utf-8" data-callback="true">
1.4. 調(diào)用QQ登錄OpenAPI
（1）調(diào)用方式說明
QQ互聯(lián)在JS SDK中封裝了所有的OpenAPI接口，開發(fā)者只需要傳遞OpenAPI名稱皆愉，以及OpenAPI需要的相關(guān)參數(shù)嗜价，就可以調(diào)用OpenAPI。
調(diào)用OpenAPI時幕庐，請統(tǒng)一遵循下述調(diào)用方式：
QC.api(api, paras, fmt, method):Request
QQ登錄JS SDK教程久锥，調(diào)用openapi接口
參考：http://justcoding.iteye.com/blog/2030743
QQ登錄將用戶信息存儲在cookie中,命名為__qc__k ，請不要占用 __qc__k :
1) :: 在頁面頂部引入JS SDK庫：
將“js?”后面的appid參數(shù)（示例代碼中的：100229030）替換成您自己的appid：
Js代碼?
??
2) :: HTML頁面中粘貼如下代碼异剥，插入QQ登錄按鈕
Js代碼?
??
??
????QC.Login({??
btnId:"qqLoginBtn"??//插入按鈕的節(jié)點(diǎn)id??
????});??
3) :: 調(diào)用openapi：
Js代碼?
??
var?paras?=?{};??
QC.api("get_user_info",?paras)??
.success(function(s){//成功回調(diào)??
alert("獲取用戶信息成功瑟由！當(dāng)前用戶昵稱為："+s.data.nickname);??
????})??
.error(function(f){//失敗回調(diào)??
alert("獲取用戶信息失敗冤寿！");??
????})??
.complete(function(c){//完成請求回調(diào)??
alert("獲取用戶信息完成错妖！");??
????});??
返回 json格式的用戶信息；請指定接口訪問成功的接收參數(shù)疚沐，如demo中的success(function(s))，即指定將成功返回值傳遞到s中; 其中所有API的返回均為response對象潮模，包括：data, code, status等屬性亮蛔，分別表示數(shù)據(jù)、返回碼擎厢、請求的響應(yīng)狀態(tài)
3.2) ※ 調(diào)用openapi發(fā)分享 [相同url參數(shù)只能分享一次]：
Js代碼?
??
//從頁面收集openapi必要的參數(shù)??
var?paras?=?{??
images:"http://y.photo.qq.com/img?s=OnbP8BwOF&l=y.jpg",??
title:"#QQ互聯(lián)JSSDK測試#我是標(biāo)題啊標(biāo)題",??
url:"http://connect.qq.com/",??
comment:"我是評論：轉(zhuǎn)發(fā)原因",??
summary:"我是摘要：內(nèi)容說明"??
};??
//用jssdk調(diào)用openapi??
QC.api("add_share",?paras)??
.success(function(s){//請自行改寫成功回調(diào)??
alert("分享成功究流，請到空間內(nèi)查看辣吃！");??
????})??
.error(function(f){//請自行改寫失敗回調(diào)??
alert("分享失敗芬探！");??
????})??
.complete(function(c){//請自行改寫完成請求回調(diào)??
alert("分享完成神得！");??
????});??
3.3) ※ 調(diào)用openapi發(fā)微博：
Js代碼?
??
var?paras?=?{content?:?"#QQ互聯(lián)JSSDK測試#曾經(jīng)滄海難為水，除卻巫山不是云偷仿。"};??
QC.api("add_t",?paras)??
.success(function(s){//成功回調(diào)??
alert("發(fā)送微博成功哩簿，請到騰訊微博內(nèi)查看！");??
????})??
.error(function(f){//失敗回調(diào)??
alert("發(fā)送微博失斣途病节榜！");??
????})??
.complete(function(c){//完成請求回調(diào)??
alert("發(fā)送微博完成！");??
????});??
3) :: 獲取openId 與 accessToken
Js代碼?
??
if(QC.Login.check()){//如果已登錄??
QC.Login.getMe(function(openId,?accessToken){??
alert(["當(dāng)前登錄用戶的",?"openId為："+openId,?"accessToken為："+accessToken].join("\n"));??
????});??
//這里可以調(diào)用自己的保存接口??
//...??
}??
用戶通過“QQ登錄”登錄成功后别智，可以調(diào)用示例代碼將獲取到openId與accessToken
openid是用戶身份的唯一標(biāo)識宗苍，請保存在本地，以便用戶下次登錄時可對應(yīng)到其之前的身份信息薄榛，不需要重新授權(quán)讳窟。
accessToken：表示當(dāng)前用戶在此網(wǎng)站/應(yīng)用的登錄狀態(tài)與授權(quán)信息，也請保存在本地敞恋。
原文：http://qzonestyle.gtimg.cn/qzone/openapi/js-sdk-demo.html
完整實(shí)例：
Html代碼?
????
????
data-appid="101037443"?data-redirecturi="http://ikeepstudying.com/services/qq.php"?data-callback="true"?charset="utf-8">????
??
??
???//調(diào)用QC.Login方法丽啡，指定btnId參數(shù)將按鈕綁定在容器節(jié)點(diǎn)中??
???QC.Login({??
???????//btnId：插入按鈕的節(jié)點(diǎn)id，必選??
???????btnId:"qqLoginBtn",??????
???????//用戶需要確認(rèn)的scope授權(quán)項(xiàng)耳舅，可選碌上，默認(rèn)all??
???????scope:"all",??
???????//按鈕尺寸，可用值[A_XL|?A_L|?A_M|?A_S|??B_M|?B_S|?C_S]浦徊，可選馏予，默認(rèn)B_S??
???????size:?"A_XL"??
???},?function(reqData,?opts){//登錄成功??
????????//根據(jù)返回數(shù)據(jù)，更換按鈕顯示狀態(tài)方法??
vardom?=?document.getElementById(opts['btnId']),??
_logoutTemplate=[??
????????????//頭像??
'',??
????????????//昵稱??
'{nickname}',??
????????????//退出??
'退出'??????
????????].join("");??
dom?&&?(dom.innerHTML?=?QC.String.format(_logoutTemplate,?{??
???????????nickname?:?QC.String.escHTML(reqData.nickname),?//做xss過濾??
???????????figureurl?:?reqData.figureurl??
????????}));??
?????//?????QC.Login.getMe(function(openId,?accessToken){????
?????//?????alert(["當(dāng)前登錄用戶的",?"openId為："+openId,?"accessToken為："+accessToken].join("\n"));????
????????//?});???
????????//這里可以調(diào)用自己的保存接口??
????????//...??
???},?function(opts){//注銷成功??
?????????alert('QQ登錄?注銷成功');??
???}??
);??
需要注意的是盔性，如果登錄地址和回調(diào)地址相同的話就要把?data-callback="true"?也加進(jìn)去霞丧，否則彈出窗口不會關(guān)閉。如：
Html代碼?
data-appid="101037443"?data-redirecturi="http://ikeepstudying.com/services/qq.php"?data-callback="true"?charset="utf-8">???
如果登錄地址和回調(diào)地址不是同意頁面的話就要分別寫冕香。
登錄頁面為
Html代碼?
data-appid="101037443"?data-redirecturi="http://ikeepstudying.com/services/qq.php"?charset="utf-8">???
回調(diào)地址為
Html代碼?
???
