在Vue中添加Facebook、Twitter、vkontakt

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

2、因为有了hello.js,实现三方登录就就会变得很简单，个人认为FaceBook、Twitter、vkontakte他们的主要区别是申请配置app,代码部分其实都一样，所以首先看看他们是怎样配置的。

3、Facebook的三方登录：首先在这个地方(https://developers.facebook.com/apps)添加一个应用,

FaceBook 图一 FaceBook 图二 FaceBook 图三

ps: FaceBook 图三的callback配置规则很重要，Twitter、vkontakte同样适用

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

Twitter 图一 Twitter 图二

创建成功后，如 Twitter 图二中，你会得到一个api key和api secret，接下来在https://auth-server.herokuapp.com还要做一些配置，

Twitter 图三

5、vkontakte三方登录，在https://vk.com/apps?act=manage这里选择 创建组件 ,创建成功后，配置重定向的uri，配置规则同FaceBook，需要注意的一点是，例：如果重定向uri为：http://www.test.com/redirect,那么需要在主域名中添加一个www.test.com

vkontakte 图一

6、接下来便是核心代码部分——

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

8、如果说你遇到了这种情况(这是vk的情况，其他的三方都一样)：

仔细看它的地址，其中“redirect_uri=http%3A%2F%2Flocalhost%3A8080%2Fredirect”，那么你的回调地址就应该是：http://localhost:8080/redirect