iT邦幫忙

0

Safari瀏覽器會擋window.open,求大神們解答

hihi 2022-07-28 15:37:482994 瀏覽
  • 分享至 

  • xImage

問題: 如題

需求: a標籤 點擊後 3秒後出現一個新的window視窗

思路: 爬了很多文章,目前寫法是 點擊後先彈出一個視窗 三秒後再給URL

目前這個方法測試是EDGE、SAFARI、CHROME都成功,但是最理想情況是,三秒後才彈出視窗

以下是我的CODE,有試過把第 15行放進 32行內,但這樣SAFARI會擋

https://ithelp.ithome.com.tw/upload/images/20220728/20143914eWM4U4WEVE.jpg

附上codepen 給各位大神們:

https://codepen.io/ialuyikr-the-lessful/pen/QWmOwbL

想不到該怎麼解了,想請教大神們幫忙指點下,十分感謝

看更多先前的討論...收起先前的討論...
你好,這是安全機制,window.open是不能透過promise打開的
你只能直接使用window.open,所以要透過其他方式把資料從fetch抓出來,然後傳進 window.open
https://www.796t.com/p/991298.html
hihi iT邦新手 5 級 ‧ 2022-07-28 16:01:18 檢舉
大大您好,不好意思不太懂您的意思

我現在的寫法跟您說的不是一樣的嗎?

我在15行 先開了一個 window.open視窗(在fetch之前)

然後下面fetch後再把資料塞進window.open內
用chrome、edge瀏覽器都是可以正常接到資料並傳到window.open內的沒有問題
hihi iT邦新手 5 級 ‧ 2022-07-28 16:04:07 檢舉
我現在的想法是
1. 先讓open的視窗隱藏起來
2. 一定時間在讓它顯示出來

爬了文發現好像沒有辦法可以藏windows.open的視窗 ...
有試過設定left、top 但始終沒有辦法讓他離開螢幕之外
你應該寫成兩個 function ,一個是window.open,把他要的參數傳進去
一個是抓資料 這樣比較好懂,你這樣開的起來我覺得有點怪怪的,你都彈出視窗了怎麼有辦法塞網址進去
hihi iT邦新手 5 級 ‧ 2022-07-28 16:34:35 檢舉
大大您好

我有寫了一個簡單的codepen,再麻煩您了

https://codepen.io/ialuyikr-the-lessful/pen/QWmOwbL
你好,稍微改一下,safari 會阻擋彈跳視窗要開一下權限
我是先在外面call api 才打開資料 但看需求你再改改看

https://codepen.io/wildfrontend/pen/oNqogBd
hihi iT邦新手 5 級 ‧ 2022-07-28 17:11:17 檢舉
野人大,感謝你花時間跟心力幫我改code,但結果還是一樣會被擋XD,可能的原因我覺得應該是下面那位大大說的了,日後若有再遇到類似的需求可能就不再用window.open去做了,十分感謝你的幫忙!!
最後我整理你的程式碼,好像你原本的方式就能做了?你看我整理完跟你要的是否還一樣。好像沒有遇到promise開啟被擋的問題?以前遇過是只要不是直接開啟windowopen 確實會開不起來
hihi iT邦新手 5 級 ‧ 2022-07-29 10:25:54 檢舉
野人大:
是的,原本的方式就可以做得到了,直接寫在promise裡也是可以正常打開的

主要問題是window open在safari瀏覽器會被擋,試了很多種方法,可能之後會漸漸不再用window.open了,謝謝您的分享,讓我長了新知識
我用safari也沒有被擋過,我記得 手機上是不能的,你測試看看
圖片
  直播研討會
圖片
{{ item.channelVendor }} {{ item.webinarstarted }} |
{{ formatDate(item.duration) }}
直播中

1 個回答

0
㊣浩瀚星空㊣
iT邦大神 1 級 ‧ 2022-07-28 16:34:42
最佳解答

這因該不止是 Safari。其它瀏覽器早晚也會跟進的。

現在來說,基於安全性原則。在非本域的情況下使用 window.open
大多數來說都會被擋下的。

除非用戶也就是本機的會員。有將瀏覽權限及安全系數給允許任意網站都可以打開。
才能正常使用。
也就是說,就算你目前使用 EDGE、SAFARI、CHROME 看起來是可以打開的情況下。
但並不代表其它人也會有跟你一樣可以打開的。
因為其能不能打開,還是來自本機上的瀏覽器設定。

為何會有這樣的限制,其來源可查看「視窗炸彈事件」

目前來說,其實還是有許多偷吃步的招式來騙瀏覽器。
如使用表來開新視窗、先開空白頁再指定URL、內框架、還有你目前的事件導引處理。

但其實我要跟你說,這些動作其目的也只是為了騙過瀏覽器,不認為你是開新視窗。
但認真來說,早晚會跟 Safari 一樣的。

另外。如果你不指定option的情況下。其實是可以使用的。只是會變成另開分頁而已。
大多數的瀏覽器只對彈窗比較嚴格。
畢竟彈窗寫的好的話,可以讓用戶不感覺到有彈窗但能運行另外的東西。

hihi iT邦新手 5 級 ‧ 2022-07-28 16:49:01 檢舉

了解,受益良多,但請教大大您的這句
"如果你不指定option的情況下。其實是可以使用的。只是會變成另開分頁而已"
請問這句話是指的是類似a tag的href嗎? 還是另外有關鍵字可以看呢

是的,其實跟使用 href target blank 是一樣的。
這是依照目前而言。

其實早期的EDEG(IE核心時期)
使用 window.open 是會真的另開一個瀏覽器出來。

現在的都是另開分頁了。
不過手機瀏覽器我沒全部試過。

或許你可以玩一下看看。

總之,因為現在限制太多,我已經不在使用 window.open 了。
因為早期我為了要挑戰這個。已經改過至少8次以上的版本。

大多是一開始還能用。一段時期後又被瀏覽器改規則了。又不能用了。
然後就一直再繼續找可以用的方式。找的很累。

hihi iT邦新手 5 級 ‧ 2022-07-29 10:28:34 檢舉

謝謝大大分享,長了很多新知識
之後可能也會漸漸減少用window.open的方式去做相關需求

我要發表回答

立即登入回答