ECN>> react-native-wechat>> 返回
项目作者： uiwjs

项目描述 ：
React Native 包使用微信分享、登录、收藏、支付等功能，支持Android/iOS。
高级语言： Java
项目地址: git://github.com/uiwjs/react-native-wechat.git
创建时间： 2020-08-01T10:42:33Z
项目社区：https://github.com/uiwjs/react-native-wechat
开源协议：
下载









@uiw/react-native-wechat

NPM Version
David

React Native 包使用微信分享、登录、收藏、支付等功能，支持Android/iOS。完整实例 Example | 完整的接口文档

注意事项


iOS: 微信授权登录 Universal Link(通用链接)

> Universal Link(通用链接)是苹果在 iOS9 推出的，一种能够方便的通过传统 HTTPS 链接来启动 APP 的功能，可以使用相同的网址打开网址和 APP。
> 看起来就是一条普通的 https 链接，当然是我们在该链接域名根目录配置过的一个链接，也可以在该链接中放置对应的H5页面。当用户的点击该链接，只要手机中安装了支持该链接的 APP 就会直接进入到 APP 中。如果没有安装APP则会跳转到 Safari 浏览器中，展示 H5 页面。对用户来说则是一个无缝跳转的过程。

创建一个名为 apple-app-site-association 的文件，如下：

json { "applinks": { "details": [ { "appID": "968DSZ49MT.com.uiwjs.react.example.wechat", "paths": ["/react-native-wechat/*"] } ] } }

说明： 字段 appID 中的 968DSZ49MT 表示苹果账号的团队 ID，com.uiwjs.react.example.wechat 表示项目的 BundleID。

<Application Identifier Prefix>.<Bundle Identifier>

上传该文件到你的域名所对应的根目录或xxx目录下，apple-app-site-association 文件不需要扩展名。

注意： 苹果提供了一个网页来验证我们编写的这个 apple-app-site-association 是否合法有效。

https://<fully qualified domain>/.well-known/apple-app-site-association 根目录 https://uiwjs.github.io/apple-app-site-association xxx目录 https://uiwjs.github.io/react-native-wechat/apple-app-site-association

打开 Associated Domains 开关，将 Universal Links 域名加到配置上，如果 URL 地址是 https://uiwjs.github.io/apple-app-site-association，那么，
Associated Domains 中填写 applinks: uiwjs.github.io。



登录苹果开发者后台，在设置证书的页面找到 Identifiers 里，在对应的 BundleId 下勾选 Associated Domains




iOS: -canOpenURL: failed for URL: “weixin://“.

> > -canOpenURL: failed for URL: "weixin://" - error: "The operation couldn’t be completed. (OSStatus error -10814.)" >

设置 URL Schemes 并列为白名单，在 ios/<应用名称>/Info.plist 中添加

xml <key>CFBundleURLTypes</key> <array> <dict> <key>CFBundleURLName</key> <string>weixin</string> <key>CFBundleURLSchemes</key> <array> <string>wx500b695a47bd364b</string> </array> </dict> </array> <key>LSApplicationQueriesSchemes</key> <array> <string>weixin</string> <string>weixinULAPI</string> </array>


iOS: RCTBridge required dispatch_sync to load RCTDevLoadingView.

> 错误内容： RCTBridge required dispatch_sync to load RCTDevLoadingView. This may lead to deadlocks

错误解决方案：可以通过下面代码可以解决，事实上我通过关闭 debug 浏览器页面就没有错误消息了。错误原因可能是你打开了 debug 浏览器，但是你模拟器并没有开启 debug 模式。

diff + #if RCT_DEV + #import <React/RCTDevLoadingView.h> + #endif - (BOOL)application:(UIApplication *)application didFinishLaunchingWithOptions:(NSDictionary *)launchOptions { #ifdef FB_SONARKIT_ENABLED InitializeFlipper(application); #endif RCTBridge *bridge = [[RCTBridge alloc] initWithDelegate:self launchOptions:launchOptions]; + #if RCT_DEV + [bridge moduleForClass:[RCTDevLoadingView class]]; + #endif RCTRootView *rootView = [[RCTRootView alloc] initWithBridge:bridge moduleName:@"example" initialProperties:nil];

安装依赖

  1. yarn add @uiw/react-native-alipay
  2. # react-native version >= 0.60+
  3. $ cd ios && pod install

使用

  1. import Wechat from '@uiw/react-native-wechat';

开发

  1. cd example   # 进入实例 example 工程，根目录不需要安装，会引发错误
  2. yarn install # 安装依赖
  4. cd ios     # 进入 example/ios 目录安装依赖
  5. pod instll # 安装依赖

其它

当前工程基于 @brodybits/create-react-native-module 初始化。

  1. npx create-react-native-module --package-identifier com.uiwjs.react.wechat --object-class-name RNWechat --generate-example Wechat --example-react-native-version 0.63.2 --module-name @uiw/react-native-wechat --github-account uiwjs --author-name "Kenny Wong" --author-email "wowohoo@qq.com"

相关连接