這次帶給大家Ajax請求回應中開啟新視窗被攔截應該如何處理,處理Ajax請求回應中開啟新視窗被攔截的注意事項有哪些,以下就是實戰案例,一起來看一下。
一、問題描述
ajax 非同步請求成功後需要新開視窗開啟url,使用的是window.open() 方法,但是會被瀏覽器給攔截了,需要用戶點下。
二、問題分析
瀏覽器之所以攔截新開視窗是因為該操作並不是用戶主動觸發的,所以它認為這是不安全的就攔截了,即使ajax 回呼函數中模擬執行click 或者submit 等用戶行為(trigger('click')),瀏覽器也會認為不是由用戶主動觸發的,因此不能被安全執行,所以被攔截。
說明:
1、如果是在javascript:void(0)" onclick="fun()"> 這個中指定的fun方法中呼叫window.open()則不會被攔截,因為瀏覽器會認為是主動的。 但是在ajax請求的回應中打開視窗是會被攔截的。
2、如果不是開啟新窗口,而是改原來的網頁位址,可以使用window.location = newurl 來實現,這樣就不會被攔截。
三、解決方案
在ajax要求之前,先用window.open 開啟一個空白窗口,然後在ajax的回應函數中設定該視窗的location屬性為新的url。
程式碼範例如:
function fun(){ var tmpWin =window.open() ajax(xxx, handle(){ //回调函数。这是伪代码,语法不准。 var newurl = xxxx tmpWin.location = newurl; }) }
上面方法,存在一個問題時,因為先打開了空白窗口,如果ajax請求失敗(網路或業務邏輯問題)後, 新視窗中就不會有正常的結果體現,有可能造成使用者疑惑。
一個解決方法是,當ajax出現問題時,可以考慮給出一個提示,如tmpWin.document.write("伺服器處理異常");
甚至為了防止ajax回應時間過長,當視窗新建後,立即給出提示tmpWin.document.write("伺服器正在處理中,請稍後");
後面如果ajax正常返回,則因為設定了location值,原來列印的資訊會被新的頁面資訊覆蓋。
這裡還有一個方法,但也有缺陷:
因為ajax可以設定為同步請求,這樣可以在ajax請求之後,利用window.open開啟新視窗。如:
function fun(){ var result; ajax({ //需要设置同步请求 ..... result = xxx ....... }) if(result){ window.open(xxxx) } }
上面的做法,因為是對ajax請求的結果判斷後,才打開新窗口,避免了上面說的問題。
但是因為是同步請求,在我們測試中發現一個問題,如果伺服器回應時間過長,一是介面會停頓(使用者體驗不好),二是新視窗會被攔截。
只有在伺服器很快返回時才沒有問題。 我們測試時,在伺服器程式碼處理中sleep了1秒,發現新視窗就被攔截了。
四、小結
總結下,可以看出,對於在ajax返回後打開新窗口,沒有特別完美的方法。具體還是要根據自己系統的業務特徵來採取相應的做法。
相信看了本文案例你已經掌握了方法,更多精彩請關注php中文網其它相關文章!
推薦閱讀:
#以上是Ajax請求回應中開啟新視窗被攔截應該如何處理的詳細內容。更多資訊請關注PHP中文網其他相關文章!