Ajax 请求后打开新窗口被拦截的解决方案
公司业务上有个场景,需请求后台获取支付链接地址,再打开地址引导用户购买。这样的场景在其他企业应该也很场景。但是遇到个很常见的问题,Ajax后直接用window.open(url),会被浏览器作为广告拦截。
解决方案:
方案一,在ajax请求前新开默认窗口:
let win = window.open("", "_blank");
let param = {
url: ...
data: {...}
}
axios.post(param).then((results)=>{
if (results.code =='sucess' ) {
_openWin(win, applyinfo)
}
});
//具体的新开窗口方法
_openWin (applyinfo){
let usAgent = navigator.userAgent.toLowerCase();
let url = wabpInfo.appTransUrl;
if(usAgent.indexOf('safari') > -1 && usAgent.indexOf("chrome") < 1) { //safari浏览器
if(url && win ){
win.location = url;
}
}else {
url && window.open(url);
}
}
方案二,ajax使用同步方式(网上提供)。
$.ajax({
type: 'post',
datatype: 'post',
async: false , //使用同步请求
url: .....
data: ...
})
这个方法在项目中尝试时失败了,依然会被浏览器拦截,使用Promise形式也未成功。
最后项目折中,推荐使用提前打开方案1,或引入用户操作流程由用户触发新开窗口操作。
希望对大家有帮助。