window.open浏览器弹出新窗口被拦截—原因分析和解决方案

最新推荐文章于 2024-05-13 23:20:58 发布

棠樾

最新推荐文章于 2024-05-13 23:20:58 发布

阅读量2.1k

点赞数

分类专栏： window 文章标签： js window

本文链接：https://blog.csdn.net/weixin_44447255/article/details/120447133

版权

当使用window.open在浏览器中打开新窗口时，可能会遇到被拦截的问题，尤其是在非用户交互的异步代码中。这是因为浏览器为了防止广告，会阻止非用户操作产生的新窗口。解决方案之一是使用a标签替代，通过用户的点击事件触发新窗口打开。其他方法包括调整代码执行时机，确保与用户交互关联。详细解决方案及JS打开新窗口的不同方式可在参考链接中查看。

摘要由CSDN通过智能技术生成

最近在做项目的时候碰到了使用window.open被浏览器拦截的情况，在本机实验没问题，到了服务器就被拦截了，火狐有拦截提示，360浏览器拦截提示都没有，虽然在自己的环境可以对页面进行放行，

但是对用户来说，不能要求用户都来通过拦截。何况当出现拦截时，很多小白根本不知道发生了啥，不知道在哪里看被拦截的页面，百思不得其解，后来查了一下，各家浏览器支持的不一样。

另外，可以发现，当window.open为用户触发事件内部或者加载时，不会被拦截，一旦将弹出代码移动到ajax或者一段异步代码内部，马上就出现被拦截的表现了。

原因分析：当浏览器检测到非用户操作产生的新弹出窗口，则会对其进行阻止。因为浏览器认为这可能是一个广告，不是一个用户希望看到的页面。

解决方案：

1.使用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();
}