React Native 包使用微信分享、登录、收藏、支付等功能,支持Android/iOS。完整实例 Example | 完整的接口文档
Universal Link(通用链接)是苹果在 iOS9 推出的,一种能够方便的通过传统 HTTPS 链接来启动 APP 的功能,可以使用相同的网址打开网址和 APP。
看起来就是一条普通的 https 链接,当然是我们在该链接域名根目录配置过的一个链接,也可以在该链接中放置对应的H5页面。当用户的点击该链接,只要手机中安装了支持该链接的 APP 就会直接进入到 APP 中。如果没有安装APP则会跳转到 Safari 浏览器中,展示 H5 页面。对用户来说则是一个无缝跳转的过程。
创建一个名为 apple-app-site-association
的文件,如下:
{
"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
-canOpenURL: failed for URL: "weixin://" - error: "The operation couldn’t be completed. (OSStatus error -10814.)"
设置 URL Schemes 并列为白名单,在 ios/<应用名称>/Info.plist
中添加
<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>
错误内容: RCTBridge required dispatch_sync to load RCTDevLoadingView. This may lead to deadlocks
错误解决方案:可以通过下面代码可以解决,事实上我通过关闭 debug 浏览器页面就没有错误消息了。错误原因可能是你打开了 debug 浏览器,但是你模拟器并没有开启 debug 模式。
+ #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];
yarn add @uiw/react-native-alipay
# react-native version >= 0.60+
$ cd ios && pod install
import Wechat from '@uiw/react-native-wechat';
cd example # 进入实例 example 工程,根目录不需要安装,会引发错误
yarn install # 安装依赖
cd ios # 进入 example/ios 目录安装依赖
pod instll # 安装依赖
当前工程基于 @brodybits/create-react-native-module 初始化。
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"
Generated using TypeDoc