React Native 轻松集成分享功能（Android 篇）

摘要：微信分享回调必须在包名路径下，否则回调不成功添加需要在你的下新建一个的包名，然后创建。添加在你的目录下添加，并且将新浪微博，，微信的和替换成自己的。

关于推送的集成请参考这篇文章，关于统计的集成请参考这篇文章，本篇文章将引导你集成分享功能。

在集成插件之前，需要在各大开放平台上成功注册应用，并通过审核（支持 3 个可选的主流平台）。支持的平台如下：

微信开放平台

QQ 开放平台

微博开放平台

第一步：安装

npm install jshare-react-native --save
npm install jcore-react-native --save
react-native link

第二步：配置

如果 link 失败，则需要进行手动配置 settings.gradle 和 build.gradle 部分

2.1 配置 settings.gradle

your project/settings.gradle

include ":app", ":jshare-react-native", ":jcore-react-native"
project(":jshare-react-native").projectDir = new File(rootProject.projectDir, "../node_modules/jshare-react-native/android")
project(":jcore-react-native").projectDir = new File(rootProject.projectDir, "../node_modules/jcore-react-native/android")

2.2 配置 build.gradle

your project/app/build.gradle

android {
  ...
  defaultConfig {
    applicationId "your application id"
    ...
    manifestPlaceholders = [
      JSHARE_PKGNAME: "cn.jiguang.share.demo",
      JPUSH_APPKEY: "your app key", //在此替换你的APPKey
      JPUSH_CHANNEL: "developer-default",       //应用渠道号, 默认即可
      TENCENT_APPID: "your tencent app id"
    ]
  }
  ...
  signingConfigs {
        debug {
            storeFile file("jshare.jks") //你的签名文件路径
            storePassword "sdkteam" //你的文件保存密码
            keyAlias "jshare"  //你的别名
            keyPassword "sdkteam" //你的签名密码
        }
        release {
            storeFile file("jshare.jks")  //你的签名文件路径
            storePassword "sdkteam" //你的文件保存密码
            keyAlias "jshare" //你的别名
            keyPassword "sdkteam" //你的签名密码
        }
    }
     buildTypes {
        release {
            minifyEnabled enableProguardInReleaseBuilds
            proguardFiles getDefaultProguardFile("proguard-android.txt"), "proguard-rules.pro"
            signingConfig signingConfigs.debug
        }
        debug {
            signingConfig signingConfigs.debug
        }
    }
    ...
    dependencies {
      compile project(":jshare-react-native")
      compile project(":jcore-react-native")
    }
}

2.3 配置 AndroidManifest.xml

your app/AndroidManifest.xml

...

         ...
        
        
        
        
        
        
        
        
        
        
        
        

2.4 添加 WXEntryActivity

需要在你的 app 下新建一个 wxapi 的包名，然后创建 WXEntryActivity。

your app/src/.../wxapi/WXEntryActivity.java

package yourPackageName.wxapi;


import cn.jiguang.share.wechat.WeChatHandleActivity;


public class WXEntryActivity extends WeChatHandleActivity {

}

2.5 添加 JGShareSDK.xml

在你的 assets 目录下添加 JGShareSDK.xml，并且将新浪微博，QQ，微信的 AppId 和 AppSecret 替换成自己的。

做完了以上步骤，sync 一下项目，如果成功了，接下来就可以开始使用了。

                      目录结构

2.6 加入 JSharePackage

your app/src/../MainApplication.java

 @Override
 protected List getPackages() {
    return Arrays.asList(
      new MainReactPackage(),
      new JSharePackage(SHUTDOWN_TOAST, SHUTDOWN_LOG)
    );
}

初始化：还是在 MainAppliation 中加入一下代码初始化 JShareInterface：

@Override
public void onCreate() {
  super.onCreate();
  SoLoader.init(this, false);
  // 在 Init 之前调用，设置为 true，则会打印 debug 级别日志，否则只会打印 warning 级别以上的日志
  // JShareInterface.setDebugMode(true);
  JShareInterface.init(this);
}

第三步：使用

接下来就可以在 JS 中引入 JShareModule 调用它的接口：

your component.js

...
import JShareModule from "jshare-react-native";

Android 接口

getPlatformList(cb)

/**
 * 获取SDK所有能用的平台名称，如要使用某个平台，必须在JGShareSDK.xml中配置。
 * Android only
 * @param {Function} callback 返回值 list 是一个数组
 */

usage:

JShareModule.getPlatformList((list) => {
  console.log(list);
});

share(message, successCallback, failCallback)

/**
 * 分享
 * @param {object} message = {
 * 
 * platformString 必填，用于分享置不同的平台 //可以是 "wechat_session" / "wechat_timeLine" / "wechat_favourite" / "qq" / "qzone" / "sina_weibo" / "sina_weibo_contact" 
 * type 必填
 * 
 * {
 *  type: "text"
 *  platform: platformString  // 分享到指定平台
 *  text: String
 *  imagePath: // 选填，新浪微博本地图片地址，其他平台没有这个字段(iOS 不支持这个字段)
 * }
 * 
 * {
 *  type: "image"
 *  platform: platformString  // 分享到指定平台
 *  imagePath: String   // 本地图片路径 imagePath, imageUrl imageArray 必须三选一
 *  text: String  // 选填
 *  imageUrl: String // 网络图片地址，必须以 http 或 https 开头，imagePath, imageUrl imageArray 必须三选一 (iOS 不支持这个字段)
 *  imageArray: [String]  // (选填: 分享到 Qzone 才提供这个字段) 如果需要分享多张图片需要这个参数，数组中问题图片路径 imagePath, imageUrl imageArray 必须三选一
 * }
 * 
 * {
 *  type: "video"
 *  platform: platformString  // 分享到指定平台
 *  title: String // 选填
 *  url: String // 视频跳转页面 url
 *  text: String  // 选填
 *  imagePath: String // 选填，缩略图，本地图片路径
 *  
 *  videoUrl: String  // QQ 空间本地视频 (iOS 不支持这个字段)
 * }
 * 
 * {
 *  type: "audio"
 *  platform: platformString  // 分享到指定平台
 *  musicUrl: String //必填 点击直接播放的 url
 *  url: String //选填，点击跳转的 url
 *  imagePath: String   //选填，缩略图，本地图片路径，imagePath，imageUrl 必须二选一
 *  imageUrl: String // 选填，网络图片路径，imagePath， imageUrl 必须二选一
 *  title: String // 选填 
 *  text: String  // 选填
 * }
 * 
 * {
 *  type: "file"
 *  platform: platformString  // 分享到指定平台
 *  path: String // 必填，文件路径
 *  fileExt: String // 必填，文件类型后缀
 *  tile: String
 * }
 * 
 * {
 * type: "emoticon"
 * platform: platformString  // 分享到指定平台
 * imagePath: String // 必填，本地图片路径
 * }
 * 
 * {
 * type: "app" // wechat_favourite 不支持
 * platform: platformString  // 分享到指定平台
 * url: String // 点击跳转 url
 * extInfo: String // 选填 第三方应用自定义数据
 * path: String // 选填 对应 app 数据文件
 * title: String // 选填
 * text: String // 选填
 * }
 * 
 * {
 * type: "link"
 * platform: platformString  // 分享到指定平台
 * url: String // 必填，网页 url
 * imagePath: String // 选填，本地图片路径 imagePath，imageUrl 必须二选一 
 * imageUrl: String // 选填，网络图片地址 imagePath imageUrl 必须二选一 (iOS 不支持)
 * title: String // 选填
 * text: String // 选填
 * }
 * 
 * {
 * type: "undefined"
 * platform: platformString  // 分享到指定平台
 * }
 * 
 * @param {Function} success = function (state) {} ## 
 * state = {state: String} state = "success" / "fail" / "cancel" / "unknow"
   *
 * @param {Function} fail = function (error) {} ## 
 * error = {code: number, descript: String}
 */

usage:

var message = {
      platform: "wechat_session",
      type: "image",
      text: "JShare test text",
      imagePath: "/storage/emulated/0/DCIM/Camera/xx.jpg"
    };
JShareModule.share(message, (map) => {
  console.log("share succeed, map: " + map);
}, (map) => {
  console.log("share failed, map: " + map);
})

getSocialUserInfo(param, successCallback, failCallback)

/**
 * 获取社交平台用户信息
 * @param {Object} param = {
 *  platform: String //可以是 "wechat_session" / "wechat_timeLine" / "wechat_favourite" / "qq" / "qzone" / "sina_weibo" / "sina_weibo_contact" 
 * }
 * @param {Function} success function (userInfo) {} 
 * userInfo = {
 *  name: String        
 *  iconUrl: String   // 社交平台头像链接
 *  gender: String    // "female" /  "male"
 *  response: Object  // 社交平台上的原始数据
 * }
 *
 * @param {Function} fail = function (error) {} ## 
 * error = {code: number, descript: String}
 */

usage:

var param = {
  platform: "wechat_session"
};
JShareModule.getSocialUserInfo(param, (map) => {
  console.log(map);
  }, (errorCode) => {
  console.log("errorCode: " + errorCode);
});

isPlatformAuth(param, callback)

/**
 * 判断某平台是否支持授权
 * 
 * @param {Object} param = {
 *  platform: String //可以是 "wechat_session" / "wechat_timeLine" / "wechat_favourite" / "qq" / "qzone" / "sina_weibo" / "sina_weibo_contact" 
 * }
 * @param {Function} callback = (Boolean) => {} 
 */

usage:

var param = {
platform: "wechat_session"
};
JShareModule.isPlatformAuth(param, (result) => {
console.log(param.platform + "is Auth: " + result);
});

isClientValid(param, callback)

/**
 * 判断该平台的分享是否有效
 * Android only
 * @param {Object} param = {
 *  platform: String //可以是 "wechat_session" / "wechat_timeLine" / "wechat_favourite" / "qq" / "qzone" / "sina_weibo" / "sina_weibo_contact" 
 * }
 * @param {Function} callback = (Boolean) => {} 
 */

usage:

var param = {
  platform: "wechat_session"
};
JShareModule.isClientValid(param, (result) => {
  console.log(param.platform + "is valid: " + result);
});

authorize(param, successCallback, failCallback)

/**
 * 授权接口
 * @param {Object} param = {
 *  platform: String //可以是 "wechat_session" / "wechat_timeLine" / "wechat_favourite" / "qq" / "qzone" / "sina_weibo" / "sina_weibo_contact" 
 * }
 * @param {Function} success 
 * @param {Function} fail 
 */

usage:

var param = {
  platform: "wechat_session"
};
JShareModule.authorize(param, (map) => {
  console.log("Authorize succeed " + map);
}, (errorCode) => {
  console.log("Authorize failed, errorCode : " + errorCode);
});

isAuthorize(param, callback)

/**
 *  判断是否授权接口
 * @param {Object} param = {
 *  platform: String //可以是 "wechat_session" / "wechat_timeLine" / "wechat_favourite" /    "qq" / "qzone" / "sina_weibo" / "sina_weibo_contact" 
 * }  
 * @param {Function} callback = (Boolean) => {} 
 */

usage:

var param = {  
  platform: "wechat_session"
};
JShareModule.isAuthorize(param, (result) => {             
   console.log("param is Authorize: " + result);
});

cancelAuthWithPlatform(param, callback)

/**
 * 删除用户授权本地数据
 * 
 * @param {Object} param = {
 *  platform: String //可以是 "wechat_session" / 
 *                           "wechat_timeLine" / 
 *                           "wechat_favourite" / 
 *                           "qq" / 
 *                           "qzone" /
 *                           "sina_weibo" /
 *                           "sina_weibo_contact" 
 * }
 * @param {Function} callback = (Int) => {}
 * @code 返回码，0 表示成功删除
 */

usage:

var param = {
  platform: "wechat_session"
};
JShareModule.cancelAuthWithPlatform(param, (code) => {
  if (code === 0) {
    console.log("remove authorize succeed");
  } else {
    console.log("remove authorize failed, errorCode: " + code);
  }
});