关于推送的集成请参考这篇文章,关于统计的集成请参考这篇文章,本篇文章将引导你集成分享功能。
在集成插件之前,需要在各大开放平台上成功注册应用,并通过审核(支持 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>
...
<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}" />
<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>
<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);
JShareInterface.init(this);
}
第三步:使用
接下来就可以在 JS 中引入 JShareModule 调用它的接口:
your component.js
...
import JShareModule from 'jshare-react-native';
Android 接口
getPlatformList(cb) usage: JShareModule.getPlatformList((list) => {
console.log(list);
});
share(message,successCallback,failCallback) 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,failCallback) usage: var param = {
platform: "wechat_session"
};
JShareModule.getSocialUserInfo(param,(map) => {
console.log(map);
},(errorCode) => {
console.log("errorCode: " + errorCode);
});
isPlatformAuth(param,callback) usage: var param = {
platform: "wechat_session"
};
JShareModule.isPlatformAuth(param,(result) => {
console.log(param.platform + "is Auth: " + result);
});
isClientValid(param,callback) usage: var param = {
platform: "wechat_session"
};
JShareModule.isClientValid(param,(result) => {
console.log(param.platform + "is valid: " + result);
});
authorize(param,failCallback) 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) usage: var param = {
platform: "wechat_session"
};
JShareModule.isAuthorize(param,(result) => {
console.log("param is Authorize: " + result);
});
cancelAuthWithPlatform(param,callback) 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 篇)
知乎专栏:极光日报
(编辑:李大同)
【声明】本站内容均来自网络,其相关言论仅代表作者个人观点,不代表本站立场。若无意侵犯到您的权利,请及时与联系站长删除相关内容!
|