ionic2 + cordova 插件实现QQ、微信、微博 第三方登录

1.首先和所有的都一样,要分别到各个开放平台申请appid,添加测试账号

QQ:腾讯开放平台 http://open.qq.com/
微信:微信开放平台 https://open.weixin.qq.com/
微博:新浪微博开放平台 http://open.weibo.com/

2.通过cordova添加插件

QQ:

cordova plugin add cordova-plugin-qqsdk --variable QQ_APP_ID=YOUR_QQ_APPID

微信:

cordova plugin add cordova-plugin-wechat  --variable wechatappid=YOUR_WECHAT_APPID

微博:

cordova plugin add cordova-plugin-weibosdk --variable WEIBO_APP_ID=YOUR_WEIBO_APPID

3.1微博需要进一步去设置redirecturi

在你的config.xml文件中添加
<preference name="REDIRECTURI" value="YOUR_WEIBO_REDIRECTURI" />
必须要和微博开放平台里面的OAuth2.0 授权设置的一样

3.2 QQ需要装@ionic-native/qqsdk

npm install @ionic-native/qqsdk --save

3.3 微信、微博需要在编译文件中声明变量

declare var Wechat:any;
declare var WeiboSDK:any;

之后就能在需要的地方直接使用Wechat.XXX 或者 WeiboSDK.XXX方法


4.第三方登录代码

4.1 QQ第三方登录:

需要引入QQSDK模块

import { QQSDK,QQShareOptions } from '@ionic-native/qqsdk';

constructor(public qq:QQSDK);

QQLogin(){
    const loginOptions: QQShareOptions = {
      client: this.qq.ClientType.QQ,
    };
    this.qq.ssoLogin(loginOptions)
      .then((result) => {
        console.log('shareNews success');
        alert('token is ' + result.access_token);
        alert('userid is ' + result.userid);
      })
      .catch(error => {
        console.log(error);
      });
}
4.2 微信、微博第三方登录
  sinaLogin(){
    WeiboSDK.ssoLogin(function (args) {
      alert('access token is ' + args.access_token);
      alert('userId is ' + args.userId);
    }, function (failReason) {
      alert(failReason);
    });
  }
  wechatLogin(){
    let scope = "snsapi_userinfo",
      state = "_" + (+new Date());
    Wechat.auth(scope, state, function (response) {
      // you may use response.code to get the access token.
      alert(JSON.stringify(response));
    }, function (reason) {
      alert("Failed: " + reason);
    });
  }

需要注意:
微信需要认证才能使用;

微博:
如果微博报错redirect_uri_mismatch 的话 请看3.1 设置redirecturi

如果微博报错sso package or sign error 的话 需要在你的XCode里面的Info找到Bundle identifier这一项,复制粘贴到微博开放平台你的app中的 bundle id 中 保持两者值一致

5.分享和登录用法一致、安装好插件参考readme文档

------end------

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容

  • 注意:代码自己动手写,不要复制! GitHub 一、接入微信第三方登录准备工作。 移动应用微信登录是基于OAuth...
    大冲哥阅读 15,293评论 0 7
  • 在本文之前请先去官方下载SDK 如果你做了分享那就不需要了; 注:你做了分享的意思 是你在清单文件下面已经注册了所...
    sakura_L阅读 7,863评论 0 1
  • 一直很向往两个人漫步在林荫小道的那种温馨,一直很羡慕两个人十指相扣的幸福。可是在你的世界里,我永远是省略号。 ...
    余下清香阅读 3,880评论 0 0
  • 那个夏日,我刚出生一个月,主人就把我丢弃在小区内,我胆怯的四处漫游,已经饿了一天一夜了,还没找到任何吃的,妈妈也不...
    无尽无尽夏阅读 2,607评论 0 1
  • 决定我们成为什么样的人,远不是我们的能力,而是我们的选择。 其实每个人都应该知道哪一个方向会成为更好的自己,但是往...
    ARTQRT阅读 1,781评论 3 1