新开Tab页被拦截问题简析

发布时间 2023-06-26 16:16:09作者: 被撕裂的风

原因解析:在浏览器的安全机制中,非用户触发的"window.open"方法,会被拦截,弹出代码在ajax或者一段异步代码内部,马上就会出现被拦截的表现。

 

解决方案:

1.使用新创建的a标签替代,并执行js代码点击它.(在Chrome50浏览器中会被拦截)

var a = document.createElement(‘a‘);

a.setAttribute(‘href‘, url);

a.setAttribute(‘target‘, ‘_blank‘);

a.setAttribute(‘id‘, id);

// 防止反复添加

if(!document.getElementById(id)) {

    document.body.appendChild(a);

}

a.click(); 


2.创建form标签,手动代码执行submit:

var form = document.createElement('form');    

form.action = 'url?id=1';

form.target = '_blank';

form.method = 'POST';

document.body.appendChild(form); 

form.submit(); 


3.将ajax异步请求改为同步请求 (async: false)

$.ajax({ 

    url: ajaxURL.getResult, 

    dataType: 'json', 

    type: 'POST', 

    async: false, 

    success: function (res) {

         window.open('_blank') 

    } 

)}        



4.先window.open('_blank'),再赋值location跳转链接;

// 先打开新页签 

var tempWin = window.open("_blank"); // window.open("about:blank"); 

$.ajax({ 

    type: "post", 

    url: xxx, 

    data: data,

     contentType: "application/json;charset=UTF-8", 

     success: function (response) { 

            //给新页签设置跳转链接 

            empWin.location.href = "www.baidu.com"; 

     }   

 });         


注:方法1,2设置完成之后,还是因为不同浏览器或者版本的原因,出现了拦截现象,可以设置ajax请求方式为async:false----同步模式。

     // 方法1,2没有同步的时候,火狐和Chrome50浏览器都会拦截。 

    // 如果拥有async: false 属性,window.open也可以不被拦截。所以主要是设置请求为同步。  

 

参考文档:https://blog.huati365.com/026bcf30b4712011 | https://www.jianshu.com/p/6ad10e918c2b