第一步： AppKey 申请， SDK 下载
1.在 umeng 官网注册自己的app。拿到AppKey。
2.申请需要分享开放平台key。
微博
微信
QQ
3.下载sdk https://developer.umeng.com/#1。如图
2.jpg
a.需要下载android ios react-native 3个库；
b.选中社会化分享后，点击设置，设置你想要分享的平台。
第二部：ios配置
1.首先进入项目的ios目录，进入对应的工程名目录，新建两个文件夹：UMReactBridge和UMComponent。
2.把下载的 ios 和 react-native 里面的对应文件全部复制进来。
3. 将刚才创建的两个文件夹用Add Files to "xxx"的方式导入到项目中
3.png
4.Linked Frameworks and Libraries加入系统依赖库
libsqlite3.tbd
CoreGraphics.framework
SystemConfiguration.framework
CoreTelephony.framework
libc++.tbd
libz.tbd
5.jpeg
6.配置SSO白名单，右键info.plist选择source code打开 .请根据选择的平台对以下配置进行裁剪：
LSApplicationQueriesSchemes
wechat
weixin
sinaweibohd
sinaweibo
sinaweibosso
weibosdk
weibosdk2.5
mqqapi
mqq
mqqOpensdkSSoLogin
mqqconnect
mqqopensdkdataline
mqqopensdkgrouptribeshare
mqqopensdkfriend
mqqopensdkapi
mqqopensdkapiV2
mqqopensdkapiV3
mqqopensdkapiV4
mqzoneopensdk
wtloginmqq
wtloginmqq2
mqqwpa
mqzone
mqzonev2
mqzoneshare
wtloginqzone
mqzonewx
mqzoneopensdkapiV2
mqzoneopensdkapi19
mqzoneopensdkapi
mqqbrowser
mttbrowser
tim
timapi
timopensdkfriend
timwpa
timgamebindinggroup
timapiwallet
timOpensdkSSoLogin
wtlogintim
timopensdkgrouptribeshare
timopensdkapiV4
timgamebindinggroup
timopensdkdataline
wtlogintimV1
timapiV1
alipay
alipayshare
dingtalk
dingtalk-open
linkedin
linkedin-sdk2
linkedin-sdk
laiwangsso
yixin
yixinopenapi
instagram
whatsapp
line
fbapi
fb-messenger-api
fbauth2
fbshareextension
kakaofa63a0b2356e923f3edd6512d531f546
kakaokompassauth
storykompassauth
kakaolink
kakaotalk-4.5.0
kakaostory-2.9.0
pinterestsdk.v1
tumblr
evernote
en
enx
evernotecid
evernotemsg
youdaonote
ynotedictfav
com.youdao.note.todayViewNote
ynotesharesdk
gplus
pocket
readitlater
pocket-oauth-v1
fb131450656879143
en-readitlater-5776
com.ideashower.ReadItLaterPro3
com.ideashower.ReadItLaterPro
com.ideashower.ReadItLaterProAlpha
com.ideashower.ReadItLaterProEnterprise
vk
vk-share
vkauthorize
twitter
twitterauth
7.配置URL Scheme
6.jpg
8 在ios项目的AppDelegate.m设置友盟appkey。以及各个平台的appkey和secret
添加引用
#import "RNUMConfigure.h"
#import
7.jpg
ios 配置完成
第三部： android配置
1.android/app目录下新建libs目录，将下载目录的Android中的所有jar包拷贝至libs。
注意检查 app下的build.gradle 是否有(一般都有)
dependencies {
compile fileTree(include: ['*.jar'], dir: 'libs')
}
8.jpg
@ 2. 将下载的ReactNative目录中所有跟android相关的java文件拷贝至项目android的包下，修改对应包名
9.jpg
3. 包名目录下创建weixin目录，新建WXEntryActivity文件.复制如下内容即可。其他友盟都帮我们写好了。
package 你的包名;
import com.umeng.socialize.weixin.view.WXCallbackActivity;
public class WXEntryActivity extends WXCallbackActivity {
}
4 。修改MainApplication.java
添加如些内容
10.jpg
new DplusReactPackage()
@Override
public void onCreate() {
super.onCreate();
SoLoader.init(this, /* native exopackage */ false);
RNUMConfigure.init(this, "5c2e3111111100025e", "Umeng", UMConfigure.DEVICE_TYPE_PHONE,"");
//RNUMConfture.init接口一共五个参数，其中第一个参数为Context，第二个参数为友盟Appkey，第三个参数为channel，第四个参数为应用类型（手机或平板），第五个参数为push的secret（如果没有使用push，可以为空
}
// 各平台对应的key
{
PlatformConfig.setWeixin("wxbf50e1111111b091a", "9821f6347711111111111278552124f");
PlatformConfig.setSinaWeibo("1372622714", "966b74b9f8c768a363b9c84253c55969", "http://sns.whalecloud.com");
PlatformConfig.setQQZone("1108090716", "HYazaX153N9FzXQL");
}
5. AndroidManifest.xml 配置权限
6. AndroidManifest.xml 配置微信activity
android 配置完成
第四步：RN
1 复制下载的react-native 里面 common下的js文件。分享的话只需要ShareUtil.js
import ShareUtil from './ShareUtil';
// 打开分享面板
openShare =() => {
ShareUtil.shareboard(
text, // 描述 位置对应上就行 名字随便取
imageUrl,// 图片
link,//链接
title,//标题
[2, 3], (code, message) => {
console.log(code, message);
}
);
}
可能遇到的问题
1.android 微信分享没有图片： 因为图片32K大小有限制。
2.点击release微信分享没有反应：
a.先检查微信官网的签名是debug还是release的。
b.修改后有几分钟延迟。
c.如果刚测试过debug，然后同一个手机测试release的话，因为微信缓存问题。会出现点击没反应。需要清空微信缓存，或者卸载微信重新下载。