情景描述
- 接著上一篇簡(jiǎn)書
- 發(fā)現(xiàn)點(diǎn)擊button(在form表單之外的button
- 在click事件調(diào)用了form的submit()方法
- 發(fā)現(xiàn)
- chrome可以再新的tab中開啟第三方支付的頁面
- safari不可以
- 但是在setting->security->block popup window(取消勾選)
- 然后就可以正常的開啟新的tab
問題解決
- Q1:safari到底是不支持什么乍丈,是開啟新的tab還是不支持redirect刊懈?
- A1:首先嘗試直接使用
window.open
開啟一個(gè)tab,當(dāng)用戶點(diǎn)擊button直接調(diào)用window.open
safari和chrome都沒有任何問題- 接著嘗試在用戶點(diǎn)擊button的時(shí)候直接調(diào)用form的submit方法(form的targat值是_self)
- 發(fā)現(xiàn)請(qǐng)求的response status是302直接做了redirect(在safari和chrome)
本來想直接確定在safari和chrome上既可以redirect也可以window.open但是突然意識(shí)到一個(gè)問題我們的這些處理都是同步的
總結(jié):
Safari is blocking any call to window.open() which is made inside an async call
- safari阻塞了來自其他線程的瀏覽器事件僅僅支持在當(dāng)前用戶觸發(fā)瀏覽器事件的線程中進(jìn)行js調(diào)用瀏覽器事件
- 對(duì)于safari能夠支持js和用戶觸發(fā)的同步事件
- safari能夠支持用戶觸發(fā)的事件(比如click submit)
- 也能夠支持在用戶觸發(fā)的事件中使用js調(diào)用事件(比如在用戶觸發(fā)的click事件中使用js提交表單或者是使用window.open)
- 但是不能夠支持用戶觸發(fā)的事件中執(zhí)行異步的js調(diào)用事件(比如休息10s之后再做window.open)
- safari能夠支持用戶觸發(fā)的事件(比如click submit)
- 但是這些問題都能夠通過取消safari的block popup實(shí)現(xiàn)
- 對(duì)于safari能夠支持js和用戶觸發(fā)的同步事件
- 很坑爹的是:不能在非用戶觸發(fā)事件函數(shù)中使用js調(diào)用瀏覽器的事件(比如submit window.open)
解決方案
- 現(xiàn)在我只找到了處理異步window.open的方式
- 首先用戶點(diǎn)擊button
- 然后在click中首先先
window.open()
- 然后
const newTab = window.open()
- 執(zhí)行異步方法
- 回調(diào)中執(zhí)行
newTab.location = http://www.baidu.com