解决在安卓手机上面使用window.location.href跳转页面空白问题

问题:通过手机扫二维码后打开页面,使用window.open(), ios与安卓的微信、浏览器扫码后正常跳转,部分低版本安卓手机使用微信和浏览器扫码后页面空白。

将window.open改为window.location.href,还是不能解决部分安卓手机跳转,使用vivo  X27(安卓10) 使用微信、浏览器扫码跳转页面空白

 

问题分析:

浏览器之所以拦截新开窗口是因为该操作并不是用户主动触发的,所以它认为这是不安全的就拦截了,

即使 ajax 回调函数中模拟执行 click 或者 submit 等用户行为(trigger('click')),浏览器也会认为不是由用户主动触发的,

因此不能被安全执行,所以被拦截。

 

问题:在低版本的安卓手机中使用window.location.href跳转失效


解决1
分析:在跳转链接后面添加时间戳,因为考虑到是低版本可能存在缓存的问题所以采用在跳转链接后面添加动态的参数时间戳来刷新缓存的数据

我最后是以这种方法解决:

// 在跳转链接后面添加时间戳,因为考虑到是低版本可能存在缓存的问题所以采用在跳转链接后面添加动态的参数时间戳来刷新缓存的数据
window.location.href = url+'?time='+((new Date()).getTime());

 

解决2:

分析: 在采用上面的方式之后,还是会有一些机型跳转有问题,又试了另外一种方法 将跳转的方式变成异步的方式,使用延时器来模拟(建议时间小于300ms,不然用户就能够感知到有些许卡顿的现象)

// 在采用上面的方式之后,还是会有一些机型跳转有问题,又试了另外一种方法 将跳转的方式变成异步的方式,使用延时器来模拟(建议时间小于300ms,不然用户就能够感知到有些许卡顿的现象)
setTimeout(() => {
window.location.href = url+'?time='+((new Date()).getTime());
}, 300);

 

解决方法来自:https://blog.csdn.net/weixin_43956521/article/details/118101983

 

posted @ 2023-04-24 10:41  ℳℓ马温柔  阅读(1232)  评论(0编辑  收藏  举报