在React Native中使用微信SDK
发布在react native2015年12月10日view:3327asvalfppb94z移动开发react-native
在文章任何区域双击击即可给文章添加【评注】!浮到评注点上可以查看详情。

react-native-wechat-ios

微信SDK集成示例,现已完成微信授权登录,之后将陆续包装分享等其他功能。

如何安装

1. 下载包文件

$ npm i react-native-wechat-ios

2. 链接库文件到你的项目中

参考 https://facebook.github.io/react-native/docs/linking-libraries-ios.html#content

给RCTWeChat添加头文件搜索路径:$(SRCROOT)/../../react-native/React,并选择recursive
因为需要在 AppDelegate.m 文件中导入 RCTWeChat.h,所以需要在你的项目中添加一个头文件搜索路径:

$(SRCROOT)/../node_modules/react-native-wechat-ios/RCTWeChat,并选择recursive

根据微信SDK要求需要添加以下库文件
  • [x] SystemConfiguration.framework
  • [x] libz.dylib
  • [x] libsqlite3.0.dylib
  • [x] libc++.dylib
  • [x] CoreTelephony.framework

Xcode7 可能找不到*.dylib库,解决方法参考这里 http://www.jianshu.com/p/1f575e4d1033

如何使用

1. 重写AppDelegate的handleOpenURL和openURL方法:

需要导入RCTWeChat.h

#import "RCTWeChat.h"
- (BOOL)application:(UIApplication *)application handleOpenURL:(NSURL *)url
{
  return [[RCTWeChat shareInstance] handleOpenURL: url];
}

- (BOOL)application:(UIApplication *)application openURL:(NSURL *)url sourceApplication:(NSString *)sourceApplication annotation:(id)annotation {

  return [[RCTWeChat shareInstance] handleOpenURL: url];

}

2. 订阅finishedAuth事件获取授权结果

授权成功后由Native端触发该事件,通知React Native端。

import {NativeAppEventEmitter} from 'react-native';

NativeAppEventEmitter.addListener(
  'finishedAuth',
  (response) => AlertIOS.alert(JSON.stringify(response))
);
返回值(response):
  • response.code
  • response.state
  • response.errCode

3. 发起授权

import WeChat from 'react-native-wechat-ios';

let state = '1311231'; 
WeChat.sendAuthRequest(state, (res) => {
});

已完成的方法

  • registerApp 向微信注册应用ID
// 向微信注册应用ID
WeChat.registerApp('你的微信应用ID', (res) => {
    alert(res); // true or false
});
  • isWXAppInstalled 检测是否已经安装微信客户端
WeChat.isWXAppInstalled((res) => {
    alert('isWXAppInstalled: '+res); // true or false
});
  • sendAuthRequest 发起授权请求
let state = '1311231'; 
WeChat.sendAuthRequest(state, (res) => {
});

Example

记得要将 AppDelegate.m 文件中的IP换成自己的:

jsCodeLocation = [NSURL URLWithString:@"http://172.16.5.70:8081/index.ios.bundle?platform=ios&dev=true"];
评论
发表评论
1年前
赞了此文章!
1年前

:laugth: 哈哈

WRITTEN BY
PUBLISHED IN
react native

用于放置react native的相关文章

我的收藏