RN

victor.zhou 5e63773f59 代码存档 7 maanden geleden
.bundle 20831de675 初始化项目 10 maanden geleden
android 5e63773f59 代码存档 7 maanden geleden
ios 5e63773f59 代码存档 7 maanden geleden
src 5e63773f59 代码存档 7 maanden geleden
.env 20831de675 初始化项目 10 maanden geleden
.gitignore 20831de675 初始化项目 10 maanden geleden
.prettierrc.mjs 20831de675 初始化项目 10 maanden geleden
.watchmanconfig 20831de675 初始化项目 10 maanden geleden
Gemfile 20831de675 初始化项目 10 maanden geleden
Gemfile.lock 20831de675 初始化项目 10 maanden geleden
README.md 5e63773f59 代码存档 7 maanden geleden
app.json 20831de675 初始化项目 10 maanden geleden
babel.config.js 20831de675 初始化项目 10 maanden geleden
eslint.config.mjs 20831de675 初始化项目 10 maanden geleden
index.d.ts 20831de675 初始化项目 10 maanden geleden
index.js 20831de675 初始化项目 10 maanden geleden
jest.config.js 20831de675 初始化项目 10 maanden geleden
jest.setup.js 20831de675 初始化项目 10 maanden geleden
metro.config.js 20831de675 初始化项目 10 maanden geleden
package-lock.json a3f585329c 文案国际化 10 maanden geleden
package.json a03206c5b3 更新依赖 10 maanden geleden
pnpm-lock.yaml a03206c5b3 更新依赖 10 maanden geleden
tsconfig.json 20831de675 初始化项目 10 maanden geleden

README.md

https://thecodingmachine.github.io/react-native-boilerplate/docs/navigate

api 文档: https://www.yuque.com/kolo7/ly4p08/koe2e766ehtb7gai?singleDoc# 《PAYMENT_API》 https://www.yuque.com/kolo7/ly4p08/yps2h45o8l3cktgb?singleDoc# 《AUTH_API》 https://www.yuque.com/kolo7/ly4p08/rz9ylvxih1ibv476?singleDoc# 《APPLE_AUTH_API》 设计文档:https://www.yuque.com/kolo7/ly4p08/lgz7bru6f2gvrciq?singleDoc# 《统一登录充值平台》 https://www.yuque.com/kolo7/ly4p08/uuwa89hedxi4qtds?singleDoc# 《google Pay》

订阅产品api:https://www.yuque.com/kolo7/ly4p08/gz4urnur0hmpqfd5?singleDoc# 《SUBSCRIPTION_API》录充值平台》

包名:com.ipeaking.recipemuse

Google控制台 https://console.cloud.google.com/welcome?project=lithe-land-475707-b1&authuser=1

Apple控制台 https://developer.apple.com/account

apple 沙盒测试用户 mealmuse@gmail.com Abc753951

在React Native应用中实现Android内购功能

安卓打包

cd android 
 
./gradlew assembleRelease

React Native IAP苹果支付(ApplePay) 在React Native应用中实现Android内购功能

IOS订阅的流程

  1. 初始化 IAP
  2. 获取订阅产品信息
  3. 发起订阅购买
  4. 监听购买事件
  5. 恢复购买

用户点击订阅

调用 requestSubscription()

Apple 显示支付界面

用户确认支付(Face ID/密码)

purchaseUpdatedListener 触发

获取 transactionReceipt

发送收据到后端验证

后端调用 Apple 验证接口

Apple 返回验证结果

后端更新数据库用户订阅状态

返回验证结果到客户端

客户端调用 finishTransaction()

更新 UI 显示会员状态

最佳实践(推荐的架构)

📍步骤 1:前端调用后台

获取后台定义的商品 SKU 列表(业务控制层)

GET /subscription/products

后台返回:

[ {

"productId": "com.xxx.vip.month",
"displayName": "月会员",
"sort": 1

}, {

"productId": "com.xxx.vip.year",
"displayName": "年会员",
"sort": 2

} ]

📍步骤 2:前端把 productId 列表丢给 react-native-iap const ids = productsFromBackend.map(item => item.productId) const storeProducts = await RNIap.getSubscriptions(ids)

📍步骤 3:前端把“商店信息 + 后台业务信息”合并 const mergedProducts = backendList.map(item => ({ ...item, ...storeProducts.find(p => p.productId === item.productId) }));

最终得到:

商店价格与周期(来自 IAP)

商品业务含义、排序、描述(来自后台)