通過js sdk 來進行第三方登入及授權(微博,微信,qq)
阿新 • • 發佈:2019-01-24
微博第三方登入及授權
註冊申請appkey
1.開啟微博開發者平臺http://open.weibo.com/development
2.點選建立微連結
3.選擇型別(選擇網站接入)
4.填寫各項資訊,並把對應的meta複製並放在html的head內(一定要繫結域名並設定回撥地址)<meta property="wb:webmaster" content="xxxxxxx" />
5.在html內引入微博api(debug=true是除錯模式,可以返回對應的資訊)<script type="text/javascript" src="http://tjs.sjs.sinajs.cn/open/api/js/wb.js?appkey=你的appkey&debug=true" charset="utf-8"></script>
編寫js程式碼
if(WB2.checkLogin()){//檢查是否已登入
WB2.logout(function(){//退出登入方法
//回撥方法
});
}
WB2.login(function(){//登入授權
WB2.anyWhere(function(W){
W.parseCMD('/account/get_uid.json',function(oResult1,bStatus){//獲取使用者uid
if(bStatus){
W.parseCMD('/users/show.json',function (oResult2,bStatus){//通過uid獲取使用者資訊
if(bStatus){
var args = {
openid:oResult2.id,//獲取使用者openid
access_token:WB2.oauthData.access_token,//獲取使用者access_token
username:oResult2.name,//獲取使用者名稱
userHeadImg:oResult2.profile_image_url,//獲取使用者微博頭像
}
//然後根據實際情況進行自己網站的一些認證處理
}
},{uid:oResult1.uid},{method:'get',cache_time:30});
}
},{},{method:'get',cache_time:30});//預設是post請求方法
});
});
QQ第三方登入及授權
註冊申請id
1.開啟騰訊開放平臺http://open.qq.com/reg
2.填寫各項資訊獲得appid和appkey
3.引入js檔案<script id="qq" type="text/javascript" src="http://qzonestyle.gtimg.cn/qzone/openapi/qc_loader.js" data-appid="你自己的appid" charset="utf-8"></script>
編寫js程式碼
if(QC.Login.check()){//檢查是否已登入
QC.Login.signOut();退出登入
}
QC.login({
btnId:"",//插入按鈕的節點id,必選,可為空字串
scope:"all",//使用者需要確認的scope授權項,可選,預設all
size: "A_XL"//按鈕尺寸,可用值[A_XL| A_L| A_M| A_S| B_M| B_S| C_S],可選,預設B_S
},function(reqData,opts){
//登入成功回撥方法
QC.Login.getMe(function(openId,accessToken){
var args = {
openid:openId,
userHeadImg:reqData.figureurl_qq_2,
access_token:accessToken,
};
});
QC.api('get_user_info',{}).success(function(userdata){
//可以獲得使用者的各種相關資訊,如使用者暱稱
var username = userdata.data.nickname;
});
},function(opts){
//登出成功回撥方法
});
微信第三方登入及授權
註冊申請id
編寫js程式碼
var path = 'http://www.xxxx.com';//登入後回撥的地址
var appid = 'xxxxxxxxx';//註冊申請的appid
window.open('https://open.weixin.qq.com/connect/qrconnect?appid='+appid+'&redirect_uri=path&response_type=code&scope=snsapi_login&state=STATE#wechat_redirect');//代開二維碼頁面,掃碼成功後會回撥到path地址
//然後可以通過位址列得到code引數的值,可以通過code值來根據需要進行進一步的操作