新开Tab页被拦截问题简析

原因解析：在浏览器的安全机制中，非用户触发的"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