当前位置: 首页 > article >正文

h5适配iOS——window.open失效

在H5开发中,打开一个新的标签页一般使用window.open。安卓中没啥限制,但是iOS的Safari出于安全限制,想使用该方法打开新的网页,必须得有用户手动触发,用代码自动打开是会失效的。

也就是说,window.open必须是绑定在button之类的点击事件中。

我得使用场景是:用户想要付款时,点击付款按钮,然后前端向后端发起请求,后端返回URL,然后前端收到URL后使用window.open来打开支付宝的唤起页面。

这里由前端收到URL后再自动打开对应URL在iOS是行不通的。

所以得改变流程:

  1. 将URL的获取改为前端在某个时机自动获取。
  2. 按钮的点击事件直接绑定window.open(url),由用户手动点击打开支付宝的页面

这里的问题就是:URL是动态的,比如我用的是vue3,如果想用@click="window.open(alipayUrl)"
在这里插入图片描述
是无法直接调用该方法的。需要先在script中定义一下:const thisWindow=window,这样就可以用thisWindow来调用open方法。

还有个方法:

将动态的URL绑定到window中:
在这里插入图片描述
然后onclick="window.open(alipayUrl)"使用onclick而不是@click来执行js代码。

不过这种方法要将url绑定到window中,不推荐,还是推荐第一种。


http://www.kler.cn/news/288870.html

相关文章:

  • 搭建pypi私有仓库(局域网内)出现的一些问题及解决方法
  • 【数据库|第11期】深入掌握 SQL Server、Access 与 SQLite 中的 `UNION` 与 `UNION ALL`:从理论到实践
  • windows系统安装配置Apache Maven
  • React16新手教程记录
  • org.apache.ibatis.binding.BindingException: Invalid bound statement (not found)
  • 晋升路上的梦想之光,社科院与杜兰大学金融管理硕士助力你前行
  • 数造科技荣登“科创杯”领奖台,开启数据驱动新篇章!
  • HarmonyOS实战开发:NAPI接口规范开发
  • Centos根目录扩容Docker分区扩容最佳实践
  • 【网络安全】Collabora在线存储型XSS(CVE-2024-29182)+代码审计
  • OpenCV 图像处理应用实战算法列表汇总(长期更新)
  • Redis安装+常用命令合集大全+Redis Desktop Manager
  • 黑悟空!一区预定!原创首发!SLWCHOA-Transformer-LSTM混合改进策略的黑猩猩优化算法多变量时间序列预测
  • FPGA速度优化
  • sickos 靶机渗透(wolf cms 渗透,squid 代理)
  • 【软件造价咨询】AI大模型能不能替代软件工程造价师完成软件造价?
  • RabbitMQ和Kafka的区别
  • python-A-B数对
  • WPF MVVM如何在ViewModel直接操作控件对象
  • 【数学建模国赛思路预约】2024高教社杯全国大学生数学建模竞赛助攻——思路、可运行代码、成品参考
  • 【数据结构】Set的使用与注意事项
  • 正则表达式实现括号替换
  • 【机器学习】CNN在计算机视觉中的应用
  • 数学建模学习(130):神经网络预测—模型选择与实战案例解析
  • LeetCode—string练习
  • etcdctl defrag 剔除、添加etcd节点
  • 调用k8s api实现添加用户并授权
  • 【Hot100】LeetCode—33. 搜索旋转排序数组
  • 台球助教APP小程序的前端交互设计
  • Redis的内存淘汰策略