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

[confidence68]

背景

在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;
  }
}

小结

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