react-native-wechat

安装

终端运行

npm install
react-native-wechat --save

 添加依赖 

react-native link

安卓

检查配置
在android/settings.gradle文件中添加如下代码:

include ':react-native-wechat'
project(':react-native-wechat').projectDir = new File(rootProject.projectDir, '../node_modules/react-native-wechat/android')

特别说明一下，

include
':react-native-wechat'

这是新版本中link后的写法，官方文档中

include
':RCTWeChat'

这种是老版本写法，意思是一样的，对于我们这种安卓小白来说，千万不要傻到两种都写，这样会报重复引包的错误

在android/app/build.gradle文件中的dependencies标签中添加模块依赖

//同样注意react-native-wechat和:RCTWeChat写一种就可以
dependencies {
···
compile project(':react-native-wechat')
}

在MainActivity.java或者MainApplication.java文件中添加以下代码：

import com.theweflex.react.WeChatPackage;
@Override
protected List<ReactPackage> getPackages() {
return Arrays.<ReactPackage>asList(
new MainReactPackage(),
new WeChatPackage()        // Add this line
);
}

在应用程序包中创建一个名为'wxapi'的包，并在其中创建一个名为'WXEntryActivity'的类。以便可以获得微信的授权和分享权限。

package your.package.wxapi;
import android.app.Activity;
import android.os.Bundle;
import com.theweflex.react.WeChatModule;
public class WXEntryActivity extends Activity {
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
WeChatModule.handleIntent(getIntent());
finish();
}
}

在应用程序包中创建一个名为“wxapi”的包，并在其中创建一个名为“WXPayEntryActivity”的类。 以便可以获得微信支付权限。

package your.package.wxapi;
import android.app.Activity;
import android.os.Bundle;
import com.theweflex.react.WeChatModule;
public class WXPayEntryActivity extends Activity {
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
WeChatModule.handleIntent(getIntent());
finish();
}
}

在AndroidManifest.xml添加声明

<manifest>
<application>
<activity
android:name=".wxapi.WXEntryActivity"
android:label="@string/app_name"
android:exported="true"
/>
<activity
android:name=".wxapi.WXPayEntryActivity"
android:label="@string/app_name"
android:exported="true"
/>
</application>
</manifest>

在proguard-rules.pro中添加：

-keep class com.tencent.mm.sdk.** {
*;
}

iOS

如果link不成功手动检查下一下配置（第三方库手动添加依赖的方法）
将

/node_modules/react-native-wechat/ios/RCTWeChat.xcodeproj

拖入到xcode中的Libraries文件夹中
然后点击筑工程项目文件(原项目的.xcodeproj文件的那个)，然后选择

Build
Phases

选项卡。然后将刚刚添加的库中的Products文件夹中的.a库拖动到

Link Binary
With Libraries

中
在 

TARGETS->
BUILD SETTINGS -> Search Paths -> Header Search Paths

 添加如下如路径

$(SRCROOT)/../node_modules/react-native-wechat/ios

添加依赖库

SystemConfiguration.framework
CoreTelephony.framework
libsqlite3.0
libc++
libz

选中

Targets/info

配置中

URL
Schema

中配置刚申请下来的

appid

为了

iOS9.0

的支持，添加
微信白名单，在

Targets/info

中的

Custom
iOS Traget Properties

标签中添加

LSApplicationQueriesSchemes

字段，值分别为

wecha

t和

weixin

,也可以直接编辑

info.plist

文件，添加源码

<key>LSApplicationQueriesSchemes</key>
<array>
<string>weixin</string>
<string>wechat</string>
</array>

在你项目的AppDelegate.m添加以下代码，启动[LinkingIOS]

#import <React/RCTLinkingManager.h>
-(BOOL)application:(UIApplication *)application openURL:(NSURL *)url
sourceApplication:(NSString *)sourceApplication annotation:(id)annotation
{
//支付宝
if([[sourceApplication substringToIndex:10] isEqualToString:@"com.alipay"]){
[AlipayModule handleCallback:url];
return YES;
}
//微信
return [RCTLinkingManager application:application openURL:url
sourceApplication:sourceApplication annotation:annotation];
}

JS方法

registerApp(appid)

注册微信SDK

appid

微信后台注册的APPID
建议在应用启动时初始化，初始化之前无法使用此模块的其他方法。WeChat模块只需要初始化一次

import * as WeChat from 'react-native-wechat';
componentDidMount (){
wechat.registerApp('your appid')
}

isWXAppInstalled()

检查是否安装微信

isWXAppSupportApi()

检查是否支持微信开放接口

getApiVersion()

获取微信SDK版本

openWXApp()

打开微信

sendAuthRequest([scope[, state]])

微信登录授权请求

scope

 应用授权作用域，如获取用户个人信息则填写

snsapi_userinfo

state

用于保持请求和回调的状态，授权请求后原样带回给第三方。该参数可用于防止csrf攻击（跨站请求伪造攻击），建议第三方带上该参数，可设置为简单的随机数加session进行校验

let scope = 'snsapi_userinfo';
let state = 'wechat_sdk_demo';
wechat.sendAuthRequest(scope,state)
.then(res=>{

)

shareToTimeline(data)

分享朋友圈,

shareToSession(data)

分享好友

WeChat.shareToTimeline({
type: 'news',
title: '标题',
description: '描述',
thumbImage: '图片'
webpageUrl：'链接'
});

pay(data)

微信支付

WeChat.pay({
appId: '',  //应用id
partnerId: '', // 商家向财付通申请的商家id
prepayId: '', // 预支付订单
nonceStr: '', // 随机串，防重发
timeStamp: '', // 时间戳，防重发
package: '', // 商家根据财付通文档填写的数据和签名
sign: '',  // 商家根据微信开放平台文档对数据做的签名
}).then((requestJson)=>{
//支付成功回调
console.log(requestJson);
}).catch((err)=>{
console.log(err);
})

addListener(eventType,
listener[, context])

监听

//监听分享状态
wechat.addListener(
'SendMessageToWX.Resp',
(response) => {
if (parseInt(response.errCode) === 0) {
toastShort('分享成功');
} else {
toastShort('分享失败');
}
}
);

once(eventType,
listener[, context])

 和

addListener

类似，但是被调用一次后会被移除

removeAllListeners()

移除所有监听事件