鍍金池/ 問(wèn)答/HTML/ 異步場(chǎng)景通過(guò)window.open打開(kāi)新標(biāo)簽頁(yè)被瀏覽器阻止

異步場(chǎng)景通過(guò)window.open打開(kāi)新標(biāo)簽頁(yè)被瀏覽器阻止

有這樣一種場(chǎng)景,我們?cè)诖蜷_(kāi)一個(gè)資源的詳細(xì)信息之前,需要對(duì)其進(jìn)行一些校驗(yàn),
如:由于客戶端未及時(shí)刷新,而該資源實(shí)際已被刪除,此時(shí)我們通過(guò)window.open試圖在新標(biāo)簽頁(yè)展示該資源詳情,結(jié)果用戶可能看到一個(gè)沒(méi)有信息的頁(yè)面。代碼類似這樣:

function goto(instanceId){
    event.preventDefault();
    $.ajax({
        ...options,
        url: "/rest/${instanceId}",
        success: function(res){
            if(res){
                window.open("/data/${instanceId}", "_blank");
            }
        },
        err: function(err){
            // handler err 
        }
    });
}

html是這樣的

<a href="/data/${instanceId}" onclick="goto(${instanceId})">

但是問(wèn)題來(lái)了,通過(guò)window.open方式會(huì)被Chrome、Firefox阻止,如果不特別設(shè)置的話。
測(cè)試發(fā)現(xiàn),如果沒(méi)有這個(gè)異步的查詢過(guò)程直接打開(kāi)新標(biāo)簽頁(yè),問(wèn)題就沒(méi)有了。
有什么辦法可以不更改需求的前提下完美解決該問(wèn)題么?

回答
編輯回答
朽鹿

資源打開(kāi)之前感覺(jué)沒(méi)必要做校驗(yàn),對(duì)于正常用戶,驗(yàn)證接口相當(dāng)于額外的開(kāi)銷,對(duì)于非法用戶,就返回一個(gè)404,就比如segmentfault:

clipboard.png

2018年1月15日 08:51
編輯回答
墨染殤
//主流做法  先開(kāi)一個(gè)空白頁(yè) 再異步后在把地址改變
var win = window.open("", "_blank");
$http().then(function(res){
    win.location = res.open_url;
})
2018年4月19日 18:22