ios支付完成之后无法请求（h5应用）

问题

这是我在工作时遇到的一个兼容性问题，当时是在维护一个项目的支付功能的时候，发现安卓手机支付完成之后返回到界面能够正常请求，但是ios无法正常请求，在这之前我是没有遇到过兼容性的问题，所以当时也是解决了好久，并没有意识到这是兼容性问题，所以在此分享给大家。

解决方案

方案一：

javascript
 代码解读
复制代码
document.addEventListener('visibilitychange', function() { 
    if (document.visibilityState === 'visible') { 
        // 页面变为可见状态时执行的操作 
    } else if (document.visibilityState === 'hidden') { 
        // 页面变为不可见状态时执行的操作 
    } 
 });

这是一个页面可见性API，浏览器标签页被隐藏或显示的时候会触发 visibilitychange事件。

这是 HTML5 新提供的一个 api ，作用是记录当前标签页在浏览器中的激活状态。 所谓“激活状态”指当前标签是否正在被用户浏览。

当ios在拉起支付的时候是需要跳转到微信里面支付的，而安卓用则是直接在h5页面中直接拉起支付，相当于ios已经退出了h5的后台转到了微信，然而ios无法监听到用户是否已经返回到了应用页面，所以导致无法继续进行请求，这就是问题所在。

方案二：

javascript
 代码解读
复制代码
window.addEventListener("pageshow", () => {
  //回退到vue应用执行的操作
  console.log("进来了");
  //
  window.location.reload(); //刷新页面
  console.log("页面刷新");
});

当一条会话历史记录被执行的时候将会触发页面显示 pageshow 事件。(这包括了后退/前进按钮操作，同时也会在 onload事件触发后初始化页面时触发)。

这个也是可以解决上面的ios支付完成之后无法请求的问题，不过最开始这个并不是用来解决这一块的，当时是为了解决从其他应用返回到我的应用页面中，当时也是无法请求的问题。

总结

总之如果遇到类似于安卓手机从其他页面返回可以请求数据，然后ios返回页面无法请求数据的问题一般都是兼容性问题，目前我遇到的都是可以使用以上的我说的两个方法就可以解决的。

希望我的分享对大家遇到这方面的问题能够有所帮助，如果我描述的不正确，大家也可以在评论区下方指正一下，大家互相学习。