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

ReactNative高级交流群 127482131 或访问  http://blog.1ygowu.com ReactNative技术专题

如何安装

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"];

react-native-wechat-ios

微信SDK集成示例,现已完成微信认证登录,分享链接功能。
react-native-wechat-android

react-native 的微信SDK辅助包,支持微信登录、微信分享、微信支付。

ReactNative技术交流群 127482131

ReactNative专题博客 http://www.reactnative.pw/

ReactNative中文社区 http://bbs.reactnative.pw/

转(前端乱炖) (http://www.html-js.com/article/3330)

react-native 的微信SDK辅助包,支持微信登录、微信分享、微信支付的更多相关文章

  1. React Native升级目标SDK

    React Native升级目标SDK 打开在 android/app/的build.gradle 找到 android { } 区块 改变以下属性 compileSdkVersion 26 buil ...

  2. Android微信登录、分享、支付

    转载需要著名出处: http://blog.csdn.net/lowprofile_coding/article/details/78004224 之前写过微信登录分享支付第一版: http://bl ...

  3. [RN] React Native 下实现底部标签(支持滑动切换)

    上一篇文章 [RN] React Native 下实现底部标签(不支持滑动切换) 总结了不支持滑动切换的方法,此篇文章总结出 支持滑动 的方法 准备工作之类的,跟上文类似,大家可点击上文查看相关内容. ...

  4. 微信https抓包,不同安卓版本、微信版本对证书的要求

    安卓系统 7.0 以下版本,不管微信任意版本,都会信任系统提供的证书 安卓系统 7.0 以上版本,微信 7.0 以下版本,微信会信任系统提供的证书 安卓系统 7.0 以上版本,微信 7.0 以上版本, ...

  5. 【React Native 实战】微信登录

    1.前言 在今天无论是游戏开发还是app开发,微信作为第三方登录必不可少,今天我们就用react-native-wechat实现微信登录,分享和支付同样的道理就不过多的介绍了. 2.属性 1)regi ...

  6. React Native实践之携程Moles框架

    编者:本文来自携程框架研发部高级经理魏晓军在第二期[携程技术微分享]上的分享,以下为整理后的文字实录.视频回放可点击这里.关注携程技术中心微信公号ctriptech,可获知更多微分享课程信息. 因为支 ...

  7. React Native系列(6) - 编译安卓私有React-Native代码

    为何要自己编译React Native安卓私有代码 我们在开发中遇到一个HTTP2的问题,React Native安卓客户端在和HTTP2支持的服务器通讯的过程中会有crash,见 React-Nat ...

  8. React Native 项目整合 CodePush 全然指南

    版权声明:本文为博主原创文章,未经博主同意不得转载. https://blog.csdn.net/y4x5M0nivSrJaY3X92c/article/details/81976844 作者 | 钱 ...

  9. Ubuntu17.10 React Native 环境搭建

    React Native 环境搭建 环境:ubuntu17.10 安装依赖 必须安装的依赖有:Node.React Native 命令行工具以及 JDK 和 Andriod Studio. 安装nod ...

随机推荐

  1. 小波说雨燕 第三季 构建 swift UI 之 UI组件集-视图集(二)ActionSheet视图 学习笔记

    action动作 sheet表 其实就是一种菜单 参数:1代理:谁去代理它2取消按钮标题3这个按钮标题会自动变成红色4添加设置其他按钮(不想加,设置为nil)   然后我们为这些按钮添加点击事件:   ...

  2. VIP - virtual IP address

    virtual IP address (虚拟 IP 地址)1.是集群的ip地址,一个vip对应多个机器2.与群集关联的唯一 IP 地址 see wiki: A virtual IP address ( ...

  3. 我们需要专职的QA吗?

    [ 引用评论里的一句话:hurt but true  抛开作者某些偏激的想法外,作者暴露出来的问题还是需要测试思考的: 1.TestCase,TestData,TestConfiguration 没有 ...

  4. 百度地图API说明

    JZ's Blog的博客对百度地图说明很清晰 http://www.jiazhengblog.com/blog/2011/07/02/289/

  5. JQ工具函数

    在jQuery中,工具函数是指直接依附于jQuery对象,针对jQuery对象本身定义的方法,即全局性的,我们统称为工具函数,或Utilites函数 主要作用于:字符串.数组.对象 API:工具函数 ...

  6. Eclipse,myeclipse开发中常用技巧总结

    一.myeclipse自带包和自己部署的包冲突解决问题方案 原来的依赖设置: 修改后的配置: 二.取消Myeclipse的自动文件验证来增加myeclipse速度 1.Windows –> Pe ...

  7. python lambda表达式简单用法

    习条件运算时,对于简单的 if else 语句,可以使用三元运算来表示,即: 1 2 3 4 5 6 7 8 # 普通条件语句 if 1 == 1:     name = 'wupeiqi' else ...

  8. cut

    cut是一个针对行的数据选取命令 SYNOPSIS cut [OPTION]... [FILE]... OPTION -b 以字节为单位进行分割,如果是多字节的话就需要注意了 -c 以字符为单位进行分 ...

  9. SQL Server 2012 AlwaysOn集群配置指南

    1. AlwaysOn介绍 AlwaysOn是SQL Server 2012提供的全新综合.灵活.高效经济的高可用性和灾难恢复解决方案.它整合了镜像和群集的功能,基于OS 故障转移群集(Windows ...

  10. SQL TUNNING

    In a Nested Loops Join, for example, the first accessed table is called the outer table and the seco ...