這次給大家?guī)碓趺刺幚韍ttp被劫持浮動廣告,處理http被劫持浮動廣告的注意事項有哪些,下面就是實戰(zhàn)案例,一起來看一下。
最近發(fā)現(xiàn)網(wǎng)站經(jīng)常在右下角彈出一個浮動廣告,開始的時候以為只是瀏覽器的廣告。
后來越來越多同事反映在家里不同瀏覽器也會出現(xiàn)廣告。然后深入檢查了下,發(fā)現(xiàn)網(wǎng)站竟然被劫持了。
然后百度了一大堆資料,什么http劫持、dns劫持、運營商劫持之類的,確定真的是中招了。
真是偷梁換柱啊,被插入廣告代碼了。真是無良奸商,什么都做得出。
然并卵,最重要的解決辦法是啥?然后把問題扔給了運維的同事。
最終結(jié)果是解決不了。沒錯,就是這么的坑爹。除非采用https。網(wǎng)上那些什么打電話、發(fā)信投訴之類的貌似沒啥用??赡苁沁\維太爛了。反正結(jié)果就是沒結(jié)果。
然后,沒辦法啦。只能我們大前端自己想辦法屏蔽啦。然后開啟了研究劫持代碼之旅,
......過程省略了800字尋找過程。
最終發(fā)現(xiàn)了,被劫持的廣告會定義一個js全局變量_pushshowjs_ ,里面保存了一些劫持廣告的相關(guān)信息,然后創(chuàng)建一個id為_embed_v3_dc的p放廣告。并且每次都是一樣的,不會有變化。
根據(jù)劫持廣告的投放原理,最終使用了js屏蔽被劫持廣告的方法。
具體代碼如下:
;(function($,window,undefined){ var needClear=false, timeout; if(window._pushshowjs_){ console.log("adHttp"); needClear=true; } window._pushshowjs_={}; Object.freeze(window._pushshowjs_);//讓對象只讀, 防止屬性被直接修改 Object.defineProperty(window, '_pushshowjs_', { configurable: false,//防止屬性被重新定義 writable: false//防止屬性被重新賦值 }); if(needClear){ timeout=setInterval(function(){ if($("#_embed_v3_dc").length>0){ $("#_embed_v3_dc").remove(); console.log("http清除"); needClear=false; clearInterval(timeout); } },500); $(window).load(function(){ if(needClear){ setTimeout(function(){ clearInterval(timeout); console.log("清除"); },2000); } }); } }(jQuery,window));
代碼不多,就不詳細解析了(如果覺得代碼有問題,望指正)。簡單點說就是把劫持廣告必須的全局js變量_pushshowjs_設(shè)定為不可被修改,只讀。如果發(fā)現(xiàn)廣告就清除。
放了代碼,終于跟被劫持的廣告說88了。
為什么說是笨辦法?
因為這只是自欺欺人。其實劫持還是存在,并且被劫持了的js的加載順序有可能會發(fā)生變化而導(dǎo)致錯誤,理想的辦法還是要靠運維跟運營商去解決或使用https。
每個劫持的廣告邏輯應(yīng)該都差不多,但廣告代碼都會不同。所以我這個不一定會適用于其他的劫持廣告。這只是一個思路,沒辦法之中的辦法。
有大神有更好的解決辦法,望指教。
以上這篇用js屏蔽被http劫持的浮動廣告實現(xiàn)方法就是小編分享給大家的全部內(nèi)容了,希望能給大家一個參考,也希望大家多多支持一聚教程網(wǎng)。
相信看了本文案例你已經(jīng)掌握了方法,更多精彩請關(guān)注Gxl網(wǎng)其它相關(guān)文章!
推薦閱讀:
Vue作用域插槽使用詳解
JS實現(xiàn)數(shù)據(jù)驗證與復(fù)選框表單提交
JS輕松實現(xiàn)輪播圖
聲明:本網(wǎng)頁內(nèi)容旨在傳播知識,若有侵權(quán)等問題請及時與本網(wǎng)聯(lián)系,我們將在第一時間刪除處理。TEL:177 7030 7066 E-MAIL:11247931@qq.com