需求详情:
某app内H5页 购买某个奖品,使用支付宝支付,支付完成后,给用户送一次抽奖机会。
问题描述:
H5页拉起支付宝支付成功后,不能返回原H5页,不能拿到支付完成的回调,也就不能刷新状态,只能手动刷新才能查询到抽奖机会更新。
解决办法:
H5 提供了 visibilitychange 事件,用以监听页面可见行。
document.addEventListener("visibilitychange", () => {
if(document.hidden) {
// 页面被挂起
console.log('页面挂起');
} else {
// 页面呼出 支付宝购买后返回,刷新次数接口
console.log('页面呼出');
getCount(); // 刷新机会方法
}
});
拉起支付宝时会触发 visibilitychange 的hidden,当支付完成,重新切回 H5页时,会触发 visibility ,此时可以调用接口刷新。