关于推送的集成请参考这篇文章，关于统计的集成请参考这篇文章，本篇文章将引导你集成分享功能。
在集成插件之前，需要在各大开放平台上成功注册应用，并通过审核（支持 3 个可选的主流平台）。支持的平台如下：
第一步：安装
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
...
<application>
...
<!-- Required. For publish channel feature -->
<!-- JPUSH_CHANNEL 是为了方便开发者统计APK分发渠道。-->
<!-- 例如: -->
<!-- 发到 Google Play 的APK可以设置为 google-play; -->
<!-- 发到其他市场的 APK 可以设置为 xxx-market。 -->
<!-- 目前这个渠道统计功能的报表还未开放。-->
<meta-data android:name="JPUSH_CHANNEL" android:value="${JPUSH_CHANNEL}"/>
<meta-data android:name="JPUSH_APPKEY" android:value="${JPUSH_APPKEY}"/>
<meta-data android:name="JSHARE_PKGNAME" android:value="${applicationId}" />
<meta-data android:name="TENCENT_APPID" android:value="${TENCENT_APPID}" />
<!-- Optional 微信分享回调,wxapi必须在包名路径下，否则回调不成功-->
<activity
android:name=".wxapi.WXEntryActivity"
android:theme="@android:style/Theme.NoTitleBar"
android:exported="true" />
</application>
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 替换成自己的。
<?xml version="1.0" encoding="utf-8"?>
<DevInfor>
<!-- 如果不需要支持某平台，可缺省该平台的配置-->
<!-- 各个平台的KEY仅供DEMO演示，开发者要集成发布需要改成自己的KEY-->
<SinaWeibo
AppKey="374535501"
AppSecret="baccd12c166f1df96736b51ffbf600a2"
RedirectUrl="https://www.jiguang.cn"/>
<QQ
AppId="1106011004"
AppKey="YIbPvONmBQBZUGaN"/>
<Wechat
AppId="wxc40e16f3ba6ebabc"
AppSecret="dcad950cd0633a27e353477c4ec12e7a"/>
</DevInfor>
做完了以上步骤，sync 一下项目，如果成功了，接下来就可以开始使用了。
2.6 加入 JSharePackage
your app/src/../MainApplication.java
@Override
protected List<ReactPackage> getPackages() {
return Arrays.<ReactPackage>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);
}
});
作者：KenChoi - 极光推送
原文：React Native 轻松集成分享功能（Android 篇）
知乎专栏：极光日报