判断window.open是否被禁用或者阻止的方法

背景

在 h5 页面新开窗口，我们经常用 window.open(‘haorooms.com’,’_blank’), 但是这个方法在某些 app 内嵌 h5 中，或者某些浏览器中会阻止这个方法，那么有什么办法判断我们的 open 是否被阻止了呢？阻止之后我们有什么办法解决呢？今天聊聊解决方案。

解决

其实 window.open 有个返回值的，在打不开或者被禁用的情况下面，window.open 会返回 null，利用这个特性，我们可以判断这个页面目前是都可以用 window.open。

例如判断如下：

  var popup = window.open("haorooms.com", "_blank");
   //popup 为 null，或者 undefined 即为阻止 

利用这个特性，我们可以封装一个函数

 function isWindowOpenUrl(url) {
  let isBlocked = false
  try{let popup = window.open(url, "_blank");
    if (popup == null || typeof(popup) == "undefined") {
    // 弹出窗口被拦截，window.open 被禁用
    isBlocked = true
    }
   }catch(e){isBlocked = true}
  if(isBlocked){// open 被阻止，我们用 location.href 方式打开页面了
  location.href = url
   }
}

当然，你也可以仅判断是否阻止，代码如下：

function isWindowOpenEnabled() {var popup = window.open("","_blank","width=100,height=100");
  if (popup == null || typeof(popup) == "undefined") {
    // 弹出窗口被拦截，window.open 被禁用
    return false;
  } else {
    // 弹出窗口被成功打开，window.open 可用
    popup.close();
    return true;
  }
}

小结

一个小的知识点，记录一下，供大家参考。