Skip to content

reactnativecn/react-native-wx

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

30 Commits
 
 
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

react-native-wx

React Native的微信插件, 包括登录、分享

注意: react-native版本需要0.17.0及以上

注意:iOS应用只要申请并获取到AppID就可进行调试。Android应用除了获取AppID外,应用还要通过审核,否则无法调起微信进行分享,并且需要在网站上填写包名和签名两个字段,签名需要使用签名生成工具获取。

如何安装

1.首先安装npm包

npm install react-native-wx --save

2.link

自动link方法~rnpm requires node version 4.1 or higher

rnpm link react-native-wx

link成功命令行会提示

rnpm info Linking react-native-wx android dependency rnpm info Linking react-native-wx ios dependency

手动link~(如果不能够自动link)

#####ios a.打开XCode's工程中, 右键点击Libraries文件夹 ➜ Add Files to <...> b.去node_modules ➜ react-native-wx ➜ ios ➜ 选择 RCTWeChat.xcodeproj c.在工程Build Phases ➜ Link Binary With Libraries中添加libRCTWeChat.a

#####Android

// file: android/settings.gradle ... include ':react-native-wx' project(':react-native-wx').projectDir = new File(settingsDir, '../node_modules/react-native-wx/android') 
// file: android/app/build.gradle ... dependencies { ... compile project(':react-native-wx') } 

android/app/src/main/java/<你的包名>/MainActivity.java中,public class MainActivity之前增加:

import cn.reactnative.modules.wx.WeChatPackage;

如果react-native版本 <0.18.0 .addPackage(new MainReactPackage())之后增加:

.addPackage(new WeChatPackage())

如果react-native版本 >=0.18.0 在new MainReactPackage()之后增加

,new WeChatPackage()

3.工程配置

iOS配置

在工程target的Build Phases->Link Binary with Libraries中加入、libsqlite3.tbd、libc++、libz.tbd、CoreTelephony.framework

Info->URL Types 中增加微信的scheme: Identifier 设置为weixin(这个拼写不能错哦), URL Schemes 设置为你注册的微信开发者账号中的APPID

如果react-native版本>=0.17.0, 在你工程的AppDelegate.m文件中添加如下代码:

#import "../Libraries/LinkingIOS/RCTLinkingManager.h" - (BOOL)application:(UIApplication *)application openURL:(NSURL *)url sourceApplication:(NSString *)sourceApplication annotation:(id)annotation { return [RCTLinkingManager application:application openURL:url sourceApplication:sourceApplication annotation:annotation]; } 

如果升级有困难,react-native版本实在是<0.17.0, 在你工程的AppDelegate.m文件中添加如下代码:

- (BOOL)application:(UIApplication *)application openURL:(NSURL *)url sourceApplication:(NSString *)sourceApplication annotation:(id)annotation { [[NSNotificationCenter defaultCenter] postNotificationName:@"RCTOpenURLNotification" object:nil userInfo:@{@"url": url.absoluteString}]; return YES; } 
iOS9的适配问题
a.对传输安全的支持

在iOS9中,默认需要为每次网络传输建立SSL,解决方法是在应用plist文件中设置

<key>NSAppTransportSecurity</key> <dict> <key>NSAllowsArbitraryLoads</key> </true> </dict> 
b.对应用跳转的支持

在iOS9中跳转第三方应用需要在应用的plist文件中添加白名单

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

Android配置

android/app/build.gradle里,defaultConfig栏目下添加如下代码:

manifestPlaceholders = [	// 如果有多项,每一项之间需要用逗号分隔 WX_APPID: "微信的APPID"	//在此修改微信APPID ] 

如果react-native版本<0.18.0,确保你的MainActivity.java中有onActivityResult的实现:

private ReactInstanceManager mReactInstanceManager; @Override public void onActivityResult(int requestCode, int resultCode, Intent data){ super.onActivityResult(requestCode, resultCode, data); mReactInstanceManager.onActivityResult(requestCode, resultCode, data); }

在你的包名相应目录下新建一个wxapi目录,并在该wxapi目录下新增一个WXEntryActivity类,该类继承自Activity(例如应用程序的包名为net.sourceforge.simcpux,则新添加的类的包名为net.sourceforge.simcpux.wxapi)

package net.sourceforge.simcpux.wxapi; // net.sourceforge.simcpux处为你的包名 import android.app.Activity; import android.os.Bundle; import cn.reactnative.modules.wx.WeChatModule; public class WXEntryActivity extends Activity{ @Override protected void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); WeChatModule.handleIntent(getIntent()); finish(); } } 

如何使用

引入包

import * as WechatAPI from 'react-native-wx'; 

API

WechatAPI.isWXAppInstalled()

返回一个Promise对象

WechatAPI.isWXAppSupportApi()

返回一个Promise对象

WechatAPI.login(config)

// 登录参数  config : { scope: 权限设置, // 默认 'snsapi_userinfo' }

返回一个Promise对象。成功时的回调为一个类似这样的对象:

{ "code": "", "appid": "", "lang": "", "country": "", }

WechatAPI.shareToTimeline(data)

分享到朋友圈

WechatAPI.shareToSession(data)

分享到好友

// 分享文字 { type: 'text', text: 文字内容, }
// 分享图片 { type: 'image', imageUrl: 图片地址, title : 标题, description : 描述, }
// 分享网页 { type: 'news', title : 标题, description : 描述, webpageUrl : 链接地址, imageUrl: 缩略图地址, }

WechatAPI.pay(data)

// 登录参数  data : { partnerId: "", prepayId: "", nonceStr: "", timeStamp: "", package: "", sign: "", }

返回一个Promise对象。成功时的回调为一个类似这样的对象:

{ errCode: "", errMsg: "", appid: "", returnKey: "", }

About

微信模块

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published

Contributors 5