最近做一個個人博客,其中的登陸模塊我想使用第三方登陸來做。上網搜一下有好多例子,但是大多數都是一個網站的第三方登陸,如QQ、微博、人人,沒有集成的組件,於是就在網上搜一下百度的apistore,百度果真沒有讓人失望。等我下載javascript版的sdk時,一盆冷水澆了下來,javascript版的sdk不可以下載,可能是網站出錯的原因。不得已自己慢慢摸索,終於搞定了,下面我來分享一下這個插件,讓后來人少走些彎路。【尼瑪,百度api變的也太快了,半個月前做的例子,今天打開又不能用了。有花了一個多小時,才整出來,步驟進行調整】
百度開發中心的幾個重要網址:
百度開發者中心:http://developer.baidu.com/
百度開發者中心改版公告:http://developer.baidu.com/announcement/115
開發者服務管理:http://developer.baidu.com/console#app/project
開發者信息管理:http://developer.baidu.com/user/info
開發者注冊:http://developer.baidu.com/user/reg
看圖
后面使用PC端js組件設置,並且復制設置的代碼,代碼如下
<script src="~/Scripts/load/Baidu-Frontia-JS-1.0.0.js"></script>【這個js插件,下載一下第三方登陸的demo就有,復制下來】
<script type="text/javascript" id="bd_soc_login_boot"></script>
<pre id='some-msg'></pre>
下邊的可以在pc端js組件中生成【這段js要放到頁面最后面,加載完頁面后再加載js,不然會出錯】
<script type="text/javascript"> (function () { var t = new Date().getTime(), script = document.getElementById("bd_soc_login_boot"), redirect_uri = encodeURIComponent("http://dongsheng.club/login/index"), domid = "some-msg", src = "http://openapi.baidu.com/social/oauth/2.0/connect/login?redirect_uri=" + redirect_uri + "&domid=" + domid + "&client_type=web&response_type=code&media_types=sinaweibo%2Cqqdenglu%2Cbaidu%2Cqqweibo%2Ckaixin%2Crenren&size=-1&button_type=4&client_id=LE3C0q1hxETmHDlbYtG9kSG9&view=embedded&t=" + t; script.src = src; })(); </script>
這個地址 http://dongsheng.club/login/index 是什么?看下圖 【網址可以隨便起】
【這是修改內容,地址與參數與上邊的不一樣,就不要在意這些細節了。
到這一步就會返回帶有參數的地址了:http://www.xiaoyaodijun.com/home/index?code=98f82414bebb81958272acf07dc231ea&state=
這里面就code有點作用,state就不要在意了。這是需要看的講解是:http://developer.baidu.com/wiki/index.php?title=docs/social/oauth
以及http://developer.baidu.com/wiki/index.php?title=docs/social/oauth/authorization
需要你再一次進行地址請求:
https://openapi.baidu.com/social/oauth/2.0/token? grant_type=authorization_code& code=ANXxSNjwQDugOnqeikRMu2bKaXCdlLxn& client_id=Va5yQRHlA4Fq4eR3LT0vuXV4& client_secret=0rDSjzQ20XUj5itV7WRtznPQSzr5pVw2& redirect_uri=http%3A%2F%2Fwww.example.com%2Fsocial_oauth_redirect
這時獲得的請求地址為:
{"expires_in":7776000,"access_token":"51.e30dc5d4575e775d9334598e3358c703.7776000.1447555359.2902756138-6643058","session_secret":"07dcf5527b21431af747a7d18120a960","session_key":"8aKDWNYK9XlGPx0Fqy+UnKGBCfHXhRbbSUzjTVoLD+bKhsEZlitbK1I1Bp7fWIBxreoVT9aa5428\/Bkzbho38pmDKEwC51AaoQ==","name":"\u900d\u9065\u5e1d\u541b","media_uid":"D2A253FCEBAB5B57EC2F122B3B80EFC2","social_uid":2902756138,"media_type":"qqdenglu"}
這里面有用的就是:access_token
后面的就沒什么變化了
】
到此處,基本ok到了關鍵地方,此時網頁也可以運行了,第三方登陸后,返回的url帶有參數
這里面比較有用的東西是access_token=*********************需要提取出來,
登陸這個網站:http://developer.baidu.com/wiki/index.php?title=docs/social/api/list 獲取
然后進行二次請求
你要的數據都在json中