元素在某些計算機藏在相同版本的瀏覽器 - Adblock的

在我們的新工具與一些廣告預覽不會在每一個瀏覽器中顯示一個div的釋放。儘管我的同事瀏覽器版本完全一樣。經過一段時間（很長一段時間）的調試後，我們發現了導致Chrome插件的原因。

向下下面你可以閱讀整個故事。我將其標記爲Q&A style，所以不要打擾甚至想想可能的答案，因爲我已經爲你準備了:)。我在此張貼這篇文章，因爲我沒有博客（但），我想分享它！我希望我們可以幫助你，或者你有同樣的（類似）問題的同事程序員。

問題

今天我們發佈我們基於員工和我們的客戶提供的數據，創建廣告內部CRM應用的新工具。這個工具能夠在將它們全部導出之前顯示一些（5）這些廣告。此預覽是通過Ajax調用完成的，該調用將使用提供的數據創建廣告。我在本地主機上開發了這個工具，將它上傳到測試服務器，並且一切都很好。在幾個不同用戶的電腦/瀏覽器中，一切正常。有時間發佈這些東西。

我們上傳文件到服務器，添加了不同的數據庫表並提出自己誰是allowed to visit頁的最後一些檢查的唯一用戶。我在計算機上進行了一些檢查（Win 7 with Chrome），並且所有工作都像在本地主機和測試服務器上一樣工作。作爲開發負責人的我的同事也在嘗試使用該工具。它的偉大工程，但...

出於某種原因，「預覽廣告」時，他在自己的電腦（Win 7的Chrome瀏覽器）日誌未顯示。起初我們認爲它必須對JavaScript做些什麼。他必須刷新甚至清除緩存才能使其工作，但這並沒有解決問題。控制檯是不扔也不任何錯誤，所以......

或許這跟他的帳戶的東西嗎？因爲他是頭腦的發展，當然我們想阻止他，只是因爲我們可以:)。我們考慮了ACL管理，因爲我們有一些特殊的規則，所以我們可以訪問，但員工不能。也許我們忘記了一些東西，但是它必須在認證日誌中拋出一個錯誤。但是，當他通過Firefox或我的電腦登錄時，一切正常。所以它與此無關。

然後我們有聰明的想法在元素檢查一下，看看廣告被正確地加載到DOM。它似乎在那裏，所以這很奇怪。我們試圖關閉一些臨時隱藏廣告包裝器的類，但這並沒有解決問題。所以我們開始搞亂這些元素。拖動它們，切換類和樣式，但沒有任何效果。但是，然後......他想出了將包含廣告本身的<table>拖到包裝桌子的div之外的想法。我們有這樣的結構，因爲這個包裝器還包含加載指示器，以便在它們之間更容易切換。就在那裏，桌子出現了。所以，我們現在知道它必須對包裝做些什麼。但是什麼？

解決方案

一些嘗試和調試，並在瀏覽器中再次嘗試後，我開始說的東西大聲，如：「同樣的Chrome瀏覽器版本」，「相同的CSS」，「f5'd」，「插件「......等什麼？我的同事跑到他的電腦前說，這可能與此有關;並轉向Adblock plus。刷新頁面後，div（廣告包裝）出現。

因此，現在我們知道是什麼導致了這個問題，但我們想知道爲什麼，我們希望讓這個工具可以被每個員工使用。如果員工正在使用此插件怎麼辦？我們不能強迫他關閉Adblock。

<div id="ads-wrapper"> 
    <table> ... </table> 
</div>

你在這裏看到什麼？ A爲<div>，ID爲「ads-wrapper」。它似乎像Adblocker隱藏元素與此ID。所以讓我們嘗試在元素檢查器中更改該屬性。將它的價值改爲「預覽」，「包裝」或甚至「廣告」都可以正常工作。但是，當我們有「廣告」和「包裝」的組合時，它會失敗。將「包裝器」更改爲「容器」也會導致隱藏的元素。

首先想到：正則表達式。它可能是一些正則表達式，它用一個與它們的模式相匹配的id來過濾元素，並簡單地隱藏它。

我搜索了一個查看這些Chrome插件來源的方法。另一位同事正在構建自己的插件，並且我幫助他使用了HTML和CSS，所以我知道它是用JavaScript編寫的。來源必須在某處。我找到了this article，它描述了你可以在哪裏找到安裝插件的來源。我打開了the plugin的文件夾並找到了一大堆JavaScript文件。我把它們全部打開，並對像「正則表達式」這樣的東西進行批量搜索，希望不必吐出所有文件。沒有。

過了一會兒，我在background.js找到了189行。幸運的是，這是我打開的第二個文件，所以我發現它非常快。

addSubscription("https://easylist-downloads.adblockplus.org/liste_fr+easylist.txt", "Liste FR+EasyList");

我在打開Chrome瀏覽器這個功能使用the link，看見一個巨大的標籤，網址和其他的東西，我甚至不想要記住名單。

線5876我發現下面一行：

... 
###ads-wrapper 
...

好像前兩個##都常說：哎，這是一個屬性，所以在你的函數的Adblock先生過濾出加。因爲以後你可以找到像##.ads-wrapper這樣的行。我們找到了我們之前在這個文件中嘗試過的所有屬性值。（在background.js你可以找到一些包含匹配隱藏更多的文件。）

結論

看一看the .txt和檢查類，ID和其他屬性和URL的他們排除。請不要試圖記住它們，但請看一下它。你會發現這些值的一些模式，所以希望你可以記住，即使你的意圖是不顯示廣告，一些插件會阻止你的內容！

這可能是一個真正的頭痛，如果你的公衆開放的網站的訪問者是郵寄您與消息：

嘿，你的網站無法正常運作。我看不到美孚吧......

所以希望你會覺得現在在這篇文章的第二，並認爲：「也許有事情做與adblocker插件和我的選擇的ID和類。」。

使用的鏈接

來源

2013-01-10 Jelmer

我檢查了這個問題爲「回答你自己的問題」，因爲我想分享我的發現，這是一個真正的頭痛。

您可以在原始文章中找到完整的解決方案/答案。在投票回答這個問題之前，請注意這一點！

摘要解決

Adblock Plus的，對於Chrome瀏覽器插件似乎根據其網站上的文件來阻止網址和元素與指定的屬性。

看看the file並檢查它們排除的類，id和其他屬性以及url。請不要試圖記住它們，但請看一下它。你會發現這些值的一些模式，所以希望你可以記住，即使你的意圖是不顯示廣告，一些插件會阻止你的內容！

來源

2013-01-10 13:44:57 Jelmer

元素在某些計算機藏在相同版本的瀏覽器 - Adblock的

回答

相關問題