离线React应用能否使用Apple Pay/Google Pay？Stripe支付离线适配咨询

一、Apple Pay/Google Pay的离线可用性 #

• Apple Pay：无法离线使用。Apple Pay核心流程依赖设备与苹果支付服务器的实时交互，包括身份验证（Touch ID/Face ID）、支付令牌生成与验证，离线状态下无法完成这些关键步骤；即便缓存支付请求，后续联网也无法补全交易，因为支付会话有严格的有效期和实时校验要求。
• Google Pay：同样无法离线使用。Google Pay需要实时连接Google支付服务完成卡片信息验证、支付令牌授权，离线时无法完成核心支付授权流程，本地缓存的支付请求也无法在联网后自动触发交易。

二、Stripe相关的离线前端运行方案 #

针对「每日特定时段联网、支付请求排队、前端构建/运行需脱离网络」的需求，可通过以下方案实现：

1. 预打包Stripe配置与SDK

   • 联网时段提前调用Stripe API获取支付按钮所需配置（如支持的支付方式、样式参数），将数据保存为静态JSON文件，在React构建时引入，避免构建或运行时实时请求Stripe。
   • 提前下载Stripe客户端SDK（@stripe/stripe-js）并打包到应用静态资源中，禁用CDN加载方式，确保离线时SDK能正常初始化。

2. 预生成Client Secret并本地存储

   • 服务器在联网时段批量创建PaymentIntent或SetupIntent，生成对应的client_secret，下发到客户端后存储在LocalStorage或IndexedDB中。
   • 离线时，前端直接使用预存的client_secret初始化Stripe支付流程，收集用户银行卡信息（Apple Pay/Google Pay仍无法离线操作），并将支付请求（含client_secret和收集到的支付方法）缓存到本地。
   • 联网时段触发后，前端自动读取本地缓存的支付请求，调用Stripe API完成支付确认。

注意：预生成的client_secret有有效期，需根据离线时段设置合理的过期时间，避免密钥失效导致交易失败。

内容的提问来源于stack exchange，提问作者Alex Dickson