在uni-app的web-view组件中无法正常执行myfatoorah支付

在uni-app的web-view组件中无法正常执行myfatoorah支付

信息类别 内容
产品分类 uniapp/App
PC开发环境 Windows
PC系统版本 Windows 11 家庭中文版 版本号 23H2 安装日期 ‎2024/‎1/‎24 操作系统版本 22631.5472 体验 Windows 功能体验包 1000.22700.1106.0
HBuilderX类型 正式
HBuilderX版本 4.66
手机系统 iOS
手机系统版本 iOS 18
手机厂商 苹果
手机机型 ios全部机型
页面类型 nvue
Vue版本 vue2
打包方式 云端
项目创建方式 HBuilderX

操作步骤:

  • 测试卡号正常,无法提供正式卡进行测试

预期结果:

  • 支付回调成功

实际结果:

  • 支付卡壳 白屏

bug描述:

app接入中东地区的myfatoorah支付,在使用官方的web-view能正常打开支付链接,输入卡信息提交后提交支付验证码后出现空屏,app运营3年,最近由于myfatoorah那边更新出现该问题,跳转到safari后能正常支付,提交验证码后并不会出现空屏问题。

支付视频.rar


更多关于在uni-app的web-view组件中无法正常执行myfatoorah支付的实战教程也可以访问 https://www.itying.com/category-93-b0.html

5 回复

这个不确定具体问题是什么,比如 sdk 内部报错,比如用到了高级语法,你可以参考 uniapp 调试 来找到具体白屏原因。

更多关于在uni-app的web-view组件中无法正常执行myfatoorah支付的实战教程也可以访问 https://www.itying.com/category-93-b0.html


没有接入sdk 提交参数到后端生成myfatoorah支付链接 这边测试过是能正常打开 到支付验证阶段就白屏了 查看控制台也没出现报错

跟myfatoorah沟通过得到的回复是没有问题 正常的浏览器也能打开并完成支付 到了web-view这边只能是打开到卡信息的提交页面 验证码输入后就完全卡壳了

回复 4***@qq.com: 看下我回复里的链接,自己实际调试一下,检查白屏原因。

在 uni-app 的 web-view 组件中遇到 MyFatoorah 支付提交后白屏的问题,通常与 iOS 系统对第三方 Cookie 和跨域请求的限制有关。MyFatoorah 近期更新可能增强了安全策略,导致在 web-view 内嵌页面时无法正常处理支付回调。

原因分析:

  • iOS 的 web-view 基于 WKWebView,默认阻止第三方 Cookie,这可能中断支付会话。
  • 支付流程涉及重定向或 JavaScript 操作,web-view 的环境限制(如弹出窗口或跨域)会阻碍回调执行。
  • 与独立 Safari 浏览器相比,web-view 缺少完整的浏览器上下文,导致支付网关无法正确验证请求。

解决方案:

  1. 使用 uni-app 的 skipToken 配置:在 web-view 组件中添加 skip-token 属性,尝试绕过部分安全限制。示例代码:
    <web-view :src="paymentUrl" skip-token></web-view>
    
  2. 检查支付链接兼容性:联系 MyFatoorah 技术支持,确认其支付页面是否支持嵌入式 web-view,并获取针对移动应用的适配建议。
  3. 替代方案:使用系统浏览器:通过 uni.navigateToSystemBrowser 或类似方法跳转到 Safari 完成支付,确保支付流程完整。示例代码:
    uni.navigateToSystemBrowser({
      url: 'https://your-payment-link'
    });
回到顶部