想要window.open不被浏览器阻止,需要在事件的处理函数的作用域中调用window.open打开新窗口,比如在用户click的时候。
xxx.onClick = ()=>{ window.open('/');}
但是当处理函数(handle)中涉及到异步操作的时候, 我产生了两种错误的解决想法。一是直接把handle绑定为async函数,大体这样
xxx.onClick = async()=>{ let url = await oneAsyncOperation; window.open(url);}
这样做忽略了async函数内部已经不属于handle的作用域,所以不可行,依然会被浏览器阻止。意识到这点之后,随手就改,大体这样:
let handleGenerator = async()=>{ let url = await oneAsyncOperation; return ()=>{ window.open(url); }}xxx.onClick = handleGenerator();
期望的是通过一个async高阶函数,在函数体内进行异步操作,然后返回一个普通函数作为handle。
马上就发现自己又想错了,async函数的返回体是Promise,不是Function,因此并不能作为handle。<br/> 最后只能放弃使用async函数,换用另一个方案来打开窗口:
xxx.onClick = ()=>{ let win = window.open('/'); //在handle的作用域内,先打开一个window oneAsyncOperation().then((url)=>{ win.location.href = url; //然后在异步操作的回调中对前面创建的新window重新设置属性 })}
ps: 上面先创建的window, 一般先打开一个loading页面的地址。