如何解决浏览器弹出窗口的拦截

问题

有时候在开发业务时，由于产品体验，要求自动打开新窗口，而不希望用户手动点击。
直接在代码中执行：

window.open('http://www.baidu.com')

是会被浏览器拦截的，浏览器是默认屏蔽弹出窗口，但是是用户手动触发，就不会拦截，如果是程序自动执行，则会拦截。

解决

那么根据上述规则，那就在用户有点击动作时打开这个窗口，伪代码如下：

 <a href="javascript:;" id="blank">test</a>
 document.getElementById('blank').onclick=function(){
    window.open(...)
 }

示例在此

不过，这方式在异步编程中还是会被拦截，所以在用户点击发送请求的同时打开一个新窗口，然后在回调函数中修改新窗口的地址，伪代码如下：

 <a href="javascript:;" id="blank">test</a>
 document.getElementById('blank').onclick=function(){
    const newwin = window.open('about:blank');
    $.ajax({
       type: 'post',
       url: 'xxxx',
       data: {...},
    }).then((data)=>{
      ...
      newwin.location.href = data.href; // 调用location
    })