根據項目實際需求，須要QQ第三方登陸，總結教程以下。javascript
- 準備工做
在正式接入以前你須要瞭解如下名詞的含義：java
1. appid ：應用的惟一標識。在OAuth2.0認證過程當中，appid的值即爲oauth_consumer_key的值。api
2. appkey：appid對應的密鑰，訪問用戶資源時用來驗證應用的合法性。在OAuth2.0認證過程當中，appkey的值即爲oauth_consumer_secret的值。app
3. redirecturl：成功受權後的回調地址，必須是註冊appid時填寫的主域名下的地址，建議設置爲網站首頁或網站的用戶中心。注意須要將url進行URLEncode。函數
4. access token：用來判斷用戶在本網站上的登陸狀態，具備3個月有效期，用戶再次登陸時自動刷新。測試
5. openid：是此網站上惟一對應用戶身份的標識，網站可將此ID進行存儲便於用戶下次登陸時辨識其身份，或將其與用戶在網站上的原有賬號進行綁定。網站
- 第一步
要接入QQ登陸，必不可少的是appid和appkey，經過申請接入QQ登陸，按照相應步驟操做便可輕鬆得到，在此不作贅述。url
- 第二步
在須要放置QQ登陸按鈕的頁面加入下面SCRIPT代碼：code
<script type="text/javascript" src="http://qzonestyle.gtimg.cn/qzone/openapi/qc_loader.js" data-appid="APPID" data-redirecturi="REDIRECTURI" charset="utf-8"></script>對象
PS：APPID 和 REDIRECTURI 換成第一步申請所獲得的對應內容，REDIRECTURI 就是登陸以後返回的回調地址，在申請頁面本身填寫，通常寫網站主域名便可。注意：回調地址必須以http或https開頭。
- 第三步
在頁面放置一個元素節點用來展示登陸按鈕，而且指定其ID，如：
<div id="qq"></div>
而後在頁面加入以下SCRIPT：
<script type="text/javascript">
QC.Login({
btnId:"qq" //插入按鈕的節點id
});
</script>
這時你就能夠在頁面看到以下效果：
如何你對這個展現效果不滿意，也能夠自定義登陸按鈕。
- 第四步
在 REDIRECTURI 即回調地址頁面加入以下SCRIPT：
<script type="text/javascript"
src="http://qzonestyle.gtimg.cn/qzone/openapi/qc_loader.js" charset="utf-8" data-callback="true"></script>
PS：官方說法若是回調地址頁與加入QQ登陸按鈕是同一個頁面，則只須要引用一次腳本文件。若是你理解不了這種官方說法，能夠在第一步的腳本中加入data-callback="true"屬性，而忽略第四步，前提是回調地址頁與加入QQ登陸按鈕的頁面是同一個頁面。
- 第五步
由於JS SDK封裝了獲取Access Token以及OpenID的方法，所以開發者不須要用開發代碼進行獲取，直接調用QQ登陸OpenAPI便可。
調用OpenAPI時，請統一遵循下述調用方式：
QC.api(api, paras, fmt, method)
參數說明：
- 最後
提供一種代碼接入思路，僅供參考：
QC.api("get_user_info", {}) //get_user_info是API參數
//指定接口訪問成功的接收函數，s爲成功返回Response對象
.success(function (s) {
//成功回調，經過s.data獲取OpenAPI的返回數據
nick = s.data.nickname; //得到暱稱
headurl = s.data.figureurl_qq_1; //得到頭像
if (QC.Login.check()) {//判斷是否登陸
QC.Login.getMe(function (openId, accessToken) { //這裏能夠獲得openId和accessToken
//下面能夠調用本身的保存方法
……
});
}
})
//指定接口訪問失敗的接收函數，f爲失敗返回Response對象
.error(function (f) {
//失敗回調
alert("獲取用戶信息失敗！");
});
////指定接口完成請求後的接收函數，c爲完成請求返回Response對象
//.complete(function (c) {
// //完成請求回調
// alert("獲取用戶信息完成！");
//});
若是沒有效果，刷新試一下，這是由於你在本地測試和你在申請時填的回調地址不匹配形成的，真正上線以後就沒有問題了。