1、首先推薦一款插件——hello.js(http://adodson.com/hello.js/)，很有用....

2、因為有了hello.js,實現(xiàn)三方登錄就就會變得很簡單，個人認(rèn)為FaceBook、Twitter、vkontakte他們的主要區(qū)別是申請配置app,代碼部分其實都一樣，所以首先看看他們是怎樣配置的。

3、Facebook的三方登錄：首先在這個地方(https://developers.facebook.com/apps)添加一個應(yīng)用,

FaceBook 圖一

FaceBook 圖二

FaceBook 圖三

ps: FaceBook 圖三的callback配置規(guī)則很重要，Twitter、vkontakte同樣適用

4、Twitter的三方登錄，首先在https://apps.twitter.com/ ? create ?new APP,

Twitter 圖一

Twitter 圖二

創(chuàng)建成功后，如 Twitter 圖二中，你會得到一個api key和api secret，接下來在https://auth-server.herokuapp.com還要做一些配置，

Twitter 圖三

5、vkontakte三方登錄，在https://vk.com/apps?act=manage這里選擇 創(chuàng)建組件 ,創(chuàng)建成功后，配置重定向的uri，配置規(guī)則同F(xiàn)aceBook，需要注意的一點是，例：如果重定向uri為：http://www.test.com/redirect,那么需要在主域名中添加一個www.test.com

vkontakte 圖一

6、接下來便是核心代碼部分——

7、回調(diào)的url一定要完全匹配，如果hello.init中有配置redirect_uri, 那么回調(diào)地址后面一定要跟上/redirect

8、如果說你遇到了這種情況(這是vk的情況，其他的三方都一樣)：

仔細(xì)看它的地址，其中“redirect_uri=http%3A%2F%2Flocalhost%3A8080%2Fredirect”，那么你的回調(diào)地址就應(yīng)該是：http://localhost:8080/redirect