图片发自简书App
1，这是一个什么样的问题？
有的时候我们想在js某一个事件之后，或者在接口回调成功之后去开启一个新窗口，这样的场景特别常见。
但是在很多时候，新弹出来的页面。会被浏览器给拦截掉，作为开发者，我们当然可以手动给浏览器放行，打开新窗口。
但是如果是那些对技术一无所知的小白用户，他们可能根本不会知道有一个新页面，那就比较难受了，以为是系统bug。
2，为什么会出现这个问题？
一般情况下，如果直接在js中调用window.open()函数去打开一个新窗口，浏览器检测到的是非用户操作产生的新弹出窗口，就会对其进行阻止。因为浏览器认为这可能是一个广告，不是一个用户希望看到的页面。
而且各个浏览器对于新窗口的拦截机制也不一样。
3，那我们如何解决？
3.1，用a标签代替，这样用户点击这个超链接，浏览器会认为它是打开一个新的链接，所以就不会拦截。
这里一般的解决办法是，将a标签的target属性设置为_blank。
<a href="url" target="_blank" />
我们也可以自己创建一个a标签的方法，然后在你想要用到的地方去调用这个方法。
function newWin(url, id) {
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();
}
3.2，如果我们想要打开的新窗口的url，是通过接口返回给我们的时候。
我们可以首先新打开一个空白的窗口，然后当街口返回成功之后，我们再将新窗口的页面进行重定向就可以了。代码如下
const newWin = window.open('about:blank;');
$.ajax({
url:'你的接口地址'，
type: 'get',
success: function(ret){
var url = ret.url;
newWin.location.href = url;
}
})
4，参考文章
此篇文章是参考window.open被浏览器拦截的解决方案。
希望这篇文章对大家能有帮助，来自一个奔跑在前端路上的前端小白。
