{"id":4742,"url":"https://github.com/beefe/react-native-wechat-ios","last_synced_at":"2025-08-04T02:31:37.891Z","repository":{"id":57341497,"uuid":"47684957","full_name":"beefe/react-native-wechat-ios","owner":"beefe","description":"Wechat SDK for React Native(iOS).","archived":false,"fork":false,"pushed_at":"2018-07-10T13:52:07.000Z","size":6728,"stargazers_count":191,"open_issues_count":3,"forks_count":34,"subscribers_count":16,"default_branch":"master","last_synced_at":"2025-06-09T15:12:40.540Z","etag":null,"topics":[],"latest_commit_sha":null,"homepage":"","language":"Objective-C","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"mit","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/beefe.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":"LICENSE","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null}},"created_at":"2015-12-09T10:36:58.000Z","updated_at":"2025-03-23T09:50:38.000Z","dependencies_parsed_at":"2022-09-15T16:21:26.642Z","dependency_job_id":null,"html_url":"https://github.com/beefe/react-native-wechat-ios","commit_stats":null,"previous_names":[],"tags_count":0,"template":false,"template_full_name":null,"purl":"pkg:github/beefe/react-native-wechat-ios","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/beefe%2Freact-native-wechat-ios","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/beefe%2Freact-native-wechat-ios/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/beefe%2Freact-native-wechat-ios/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/beefe%2Freact-native-wechat-ios/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/beefe","download_url":"https://codeload.github.com/beefe/react-native-wechat-ios/tar.gz/refs/heads/master","sbom_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/beefe%2Freact-native-wechat-ios/sbom","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":268639931,"owners_count":24282678,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","status":"online","status_checked_at":"2025-08-04T02:00:09.867Z","response_time":79,"last_error":null,"robots_txt_status":"success","robots_txt_updated_at":"2025-07-24T06:49:26.215Z","robots_txt_url":"https://github.com/robots.txt","online":true,"can_crawl_api":true,"host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":[],"created_at":"2024-01-05T20:17:21.925Z","updated_at":"2025-08-04T02:31:36.635Z","avatar_url":"https://github.com/beefe.png","language":"Objective-C","funding_links":[],"categories":["Components"],"sub_categories":["Integrations"],"readme":"# react-native-wechat-ios [![npm version](https://img.shields.io/badge/npm-0.3.1-blue.svg)](https://www.npmjs.com/package/react-native-wechat-ios) ![PRs Welcome](https://img.shields.io/badge/PRs-welcome-brightgreen.svg)\n微信SDK集成示例，现已完成微信认证登录，分享链接，支付功能。(本模块仅支持iOS，[点我获取Android支持](https://github.com/beefe/react-native-wechat-android)）\n\n## 如何安装\n\n#### 1. 下载包文件\n```\n$ npm i react-native-wechat-ios\n```\n\n#### 2. 链接库文件到你的项目中\n参考 https://facebook.github.io/react-native/docs/linking-libraries-ios.html#content\n\na. 给RCTWeChat添加头文件搜索路径：`$(SRCROOT)/../../react-native/React`，并选择`recursive`。\n\nb. 因为需要在 AppDelegate.m 文件中导入 RCTWeChat.h，所以需要在你的项目中添加一个头文件搜索路径：\n`$(SRCROOT)/../node_modules/react-native-wechat-ios/RCTWeChat`，并选择`recursive`。\n\n\n#### 3. 根据微信SDK文档需要做的一些设置\na. 根据微信SDK要求需要添加以下库文件\n  - [x] SystemConfiguration.framework   \n  - [x] libz.dylib\n  - [x] libsqlite3.0.dylib\n  - [x] libc++.dylib\n  - [x] CoreTelephony.framework\n\nXcode7 可能找不到`*.dylib`库，可以选择`*.tbd`库，也可以参考这里\nhttp://www.jianshu.com/p/1f575e4d1033\n\nb. 在Xcode中，选择你的工程设置项，选中“TARGETS”一栏，在“info”标签栏的“URL type“添加“URL scheme”为你所注册的应用程序id\n![示例](https://res.wx.qq.com/open/zh_CN/htmledition/res/img/pic/app-access-guide/ios/image0042168b9.jpg)\n\n#### 4. 将刚添加的 scheme `weixin` 添加到 Info.plist 的 LSApplicationQueriesSchemes 中\n近期苹果公司iOS 9系统策略更新，限制了http协议的访问，此外应用需要在“Info.plist”中将要使用的URL Schemes列为白名单，才可正常检查其他应用是否安装。\n参考：\n* http://www.jianshu.com/p/e38a609f786e. \n* http://www.bitscn.com/weixin/570774.html\n\n## 如何使用\n\n### 1. 重写AppDelegate的handleOpenURL和openURL方法：\n\n需要导入`RCTWeChat.h`\n```objective-c\n#import \"RCTWeChat.h\"\n```\n\n```objective-c\n- (BOOL)application:(UIApplication *)application handleOpenURL:(NSURL *)url\n{\n  return [[RCTWeChat shareInstance] handleOpenURL: url];\n}\n\n- (BOOL)application:(UIApplication *)application openURL:(NSURL *)url sourceApplication:(NSString *)sourceApplication annotation:(id)annotation {\n  \n  return [[RCTWeChat shareInstance] handleOpenURL: url];\n  \n}\n\n```\n\n### 2. 订阅`didRecvAuthResponse`事件获取认证处理结果\n认证成功后由Native端触发该事件，通知React Native端。\n\n```javascript\nimport {NativeAppEventEmitter} from 'react-native';\n\nNativeAppEventEmitter.addListener(\n  'didRecvAuthResponse',\n  (response) =\u003e AlertIOS.alert(JSON.stringify(response))\n);\n\n```\n###### 返回值(response):\n* `response.code`\n* `response.state`\n* `response.errCode`\n\n### 3. 发起认证\n```javascript\nimport WeChat from 'react-native-wechat-ios';\n\nlet scope = 'snsapi_userinfo';\nlet state = 'wechat_sdk_test'; \nWeChat.sendAuthReq(scope, state, (res) =\u003e {\n    alert(res); // true or false\n});\n```\n\n### 4. 分享链接内容给微信\n```javascript\nWeChat.sendLinkURL({\n    link: 'https://www.qianlonglaile.com/web/activity/share?uid=d1NrTmtrdVNFNzVmelVCQitpaEZxZz09\u0026date=1449818774\u0026from=groupmessage\u0026isappinstalled=0#!/',\n    tagName: '钱隆',\n    title: '哈哈哈哈哈哈',\n    desc: '噢噢噢噢哦哦哦哦哦哦',\n    thumbImage: 'https://dn-qianlonglaile.qbox.me/static/pcQianlong/images/buy_8e82463510d2c7988f6b16877c9a9e39.png',\n    scene: 1\n});\n```\n### 5. 分享本地图片给微信\n```javascript\nWeChat.sendImage({\n    path: '/var/xxxx/xxxx', //本地图片位置,可以用react-native-fs获取\n    tagName: '钱隆',\n    title: '哈哈哈哈哈哈',\n    desc: '噢噢噢噢哦哦哦哦哦哦',\n    scene: 1\n});\n```\n### 6. 微信支付\n#### 1. 调用支付\n```javascript\n//建议请先完成 isWXAppInstalled 和 isWXAppSupportAPI 验证调用微信及微信支付可行性\n//请仔细核对调起支付参数\nlet payOptions = {\n    appId: '********',\n    nonceStr: '940ba5be3fd642a0bd935546b23e1b5d',\n    partnerId: '**********',\n    prepayId: 'wx201604252333295472c2d8a40853064388',\n    packageValue: 'Sign=WXPay',\n    timeStamp: '1461598433',\n    sign: 'D055ABFA6B1030273FEDBE8ECEBE1FC0'\n    };\nWeChat.weChatPay(payOptions,(res) =\u003e {\n   //console.log(res);\n});\n```\n#### 2. 订阅`finishedPay`事件获取调用支付结果\n支付结束后由Native端触发该事件，通知React Native端。\n* ref: https://facebook.github.io/react-native/docs/native-modules-ios.html#content\n* 注册监听事件\n```javascript\nlet subscription = NativeAppEventEmitter.addListener(\n    'finishedPay',\n    (res) =\u003e {\n      if(res.errCode == 0) { //充值成功\n        console.log('充值成功');\n      } else if(res.errCode == -1) { //很多情况下是证书问题\n        console.log('支付失败,请稍后尝试'); \n      } else if(res.errCode == -2) { //充值取消\n        console.log(\"充值取消\");\n      }\n    }\n  );\n```\n* 卸载监听事件\n```javascript\ncomponentWillUnmount() {\n    if (Platform.OS == 'ios') {\n      if(subscription != undefined) {\n        subscription.remove();\n      }\n    }\n  }\n```\n## 已完成的方法，`callback`都是可选的\n- registerApp(appid, appdesc, callback)向微信注册应用ID, `appdesc`可选\n```javascript\n// 向微信注册应用ID\nWeChat.registerApp('你的微信应用ID', (res) =\u003e {\n    alert(res); // true or false\n});\n```\n- isWXAppInstalled(callback) 检测是否已安装微信\n```javascript\nWeChat.isWXAppInstalled((res) =\u003e {\n    alert('isWXAppInstalled: '+res); // true or false\n});\n```\n\n- getWXAppInstallUrl(callback)获取微信的itunes安装地址\n\n- isWXAppSupportApi(callback)判断当前微信的版本是否支持OpenApi\n\n- getApiVersion(callback)获取当前微信SDK的版本号\n\n- openWXApp(callback)打开微信客户端\n\n- sendAuthReq(scope, state, callback) 发起认证请求\n```javascript\nlet scope = 'snsapi_userinfo';\nlet state = 'wechat_sdk_test'; \nWeChat.sendAuthReq(scope, state, (res) =\u003e {\n    alert(res); // true or false\n});\n```\n\n- sendLinkURL(options, callback)分享链接内容给微信\noptions选项：\n    * link：待分享的链接\n    * tagName 标签\n    * title 标题\n    * desc 描述内容\n    * thumbImage 缩略图地址\n    * scene 场景(0:聊天界面，1:朋友圈，2:收藏)\n\n- wechatPay(payOptions, callback)分享链接内容给微信\npayOptions：\n    * appId：应用ID\n    * nonceStr 随机字符串\n    * partnerId 商户号\n    * prepayId 预支付交易会话ID\n    * packageValue 扩展字段\n    * timeStamp 时间戳\n    * sign 签名\n参考：\n* https://pay.weixin.qq.com/wiki/doc/api/app/app.php?chapter=9_12\u0026index=2 \n\n## 事件，通过订阅事件获取操作结果\n### didRecvAuthResponse\n授权成功后触发\n\n### didRecvMessageResponse \n分享成功后触发\n\n### finishedPay \n调起支付成功后触发\n\n## 更新日志\n##### 2015.12.11\n* 新增分享链接内容给微信\n* 方法的回调函数变为可选的\n* 新增WXApi方法，详见方法列表\n* `sendAuthRequest`方法改为`sendAuthReq`\n* 事件名`finishedAuth`改为`didRecvAuthResponse`\n\n##### 2016.4.25\n* 新增微信支付\n\n## Example\n记得要将 AppDelegate.m 文件中的IP换成自己的:\n\n```Objective-c\njsCodeLocation = [NSURL URLWithString:@\"http://172.16.5.70:8081/index.ios.bundle?platform=ios\u0026dev=true\"];\n```\n\n![截图](./demo.gif)\n\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fbeefe%2Freact-native-wechat-ios","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fbeefe%2Freact-native-wechat-ios","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fbeefe%2Freact-native-wechat-ios/lists"}