JS前端廣告攔截實現(xiàn)原理解析
這篇文章主要介紹了JS前端廣告攔截實現(xiàn)原理解析,文中通過示例代碼介紹的非常詳細(xì),對大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價值,需要的朋友可以參考下
主流的瀏覽器,默認(rèn)都開啟了廣告過濾,這對于用戶(瀏覽者)來說,不但加快了訪問網(wǎng)頁的速度,而且也避免了勿點一些垃圾色情的東西,可以說綠色了網(wǎng)絡(luò)環(huán)境。
第一、對于正常的廣告攔截前端開發(fā)需要注意的是:
在請求圖片與js文件、接口、文件內(nèi)容最好不要包含ad、guanggao等關(guān)鍵詞,可能被攔截
我們可以用一個請求來判斷瀏覽器有沒有開啟廣告攔截,如果我們需要插入廣告,可以提示用戶關(guān)閉廣告攔截
<script src="http://demo.jb51.net/adview_pic_cpc_cpm_cpa_guanggao_gg_ads_300x250.js" type="text/javascript"></script> /*這個js文件的內(nèi)容為var killads = true;*/ <script type="text/javascript"> if (typeof(killads)=='undefined'){alert('廣告被過濾');} </script>
第二、瀏覽器對window.opne()的攔截,我們可以通過var x =window.open(url);然后判斷x == undefined來判斷新窗口是否被攔截。
?。ㄒ唬?、 一般情況下,如果在js中調(diào)用window.open()函數(shù)去打開一個新tab頁,瀏覽器會進(jìn)行攔截,認(rèn)為打開的是一個廣告頁。
(二)、所以如果不想讓瀏覽器攔截,可以將這個“函數(shù)”改為用戶點擊時觸發(fā),這樣瀏覽器就認(rèn)為是用戶想訪問這個頁面,而不是你直接彈出給用戶。
?。ㄈ?、即使是用戶點擊事件,如果在一次事件里調(diào)用多次window.open()函數(shù),則只有第一次被當(dāng)作正常打開,之后的還是會被當(dāng)作廣告頁。
(四)、如果在點擊事件里有ajax調(diào)用,window.open()在回調(diào)函數(shù)里執(zhí)行,則瀏覽器仍然認(rèn)為是js調(diào)用并當(dāng)作廣告攔截。除非ajax設(shè)置為“同步”模式。也可以用下面的方法解決
var newWin = window.open(); $.ajax({ url:xxx, success: function(data){ newWin.location = data.url; } });
?。ㄎ澹?、其他場景:
有的下載功能是這樣實現(xiàn)的,當(dāng)用戶點擊某個按鈕后,在后臺生成一個地址返回給前端,前端在請求的回調(diào)方法中,通過window.open()打開這個鏈接
由于前端需要給后臺發(fā)送異步請求,所以window.open()也會被攔截
可行的方法是,在回調(diào)之后,生成一個<a>標(biāo)簽,且href設(shè)置為下載地址,然后觸發(fā)這個<a>標(biāo)簽的點擊事件,注意:<a>標(biāo)簽一定要加一個download屬性,否則還是會被攔截
以上就是本文的全部內(nèi)容,希望對大家的學(xué)習(xí)有所幫助,也希望大家多多支持腳本之家。
相關(guān)文章
webpack-dev-server 的 host 配置 0.0.0.0的方法
這篇文章主要介紹了webpack-dev-server 的 host 配置 0.0.0.0的方法,本文給大家介紹的非常詳細(xì),對大家的學(xué)習(xí)或工作具有一定的參考借鑒價值,,需要的朋友可以參考下2024-01-01