広告以外の要素をブロックするAdBlockを処理する方法
最近、リンクが本来あるべき場所にないために特定のページにアクセスできないとユーザーが不満を言っているという問題が発生しました。
頭を悩ませた後、すべてのブラウザ拡張機能を無効にして、問題が十分に解消されたことを確認しました。拡張機能を1つずつ再度有効にします...
AdBlock。
何らかの理由で、ユーザーがアクセスしたいページへのリンクをブロックしていました。
現在、私は広告を掲載しておらず、掲載する予定もないので、通常、この問題を抱えている人々にサイトをホワイトリストに登録するように指示するだけで、すべてうまくいきます。しかし、そもそも問題があることを誰かが知らなかったとしたら、これが原因で実際にトラフィックを失うことになります。では、どうすればこれを回避できますか？
私が本当に考えることができるのは、AdBlockを検出し、AdBlockがWebサイトを破壊することがわかっていること、および広告を実行しないため、サイトでAdBlockを無効にすることを希望する可能性があることを説明する小さな通知をポップアップすることだけです。つまり、このサイトはゲームであり、ブラウザ拡張機能がそれを壊したのはこれが初めてではありませんが、初めての訪問者がブロッカーを無効にするように求めるポップアップを見るのはあまり幸せではないと思います。 ？
したがって、AdBlockが最初にサイトを破壊するのを実際に防ぐソリューションはどれも素晴らしいでしょう。
Chrome拡張機能の実行を防ぐことはできません。拡張機能は、特権APIを使用して独自の個別のスレッドで動作し、ページスクリプトから隠されています。
アドブロッカーの検出は厄介です。最も簡単な方法は、「犠牲要素」（たとえば、「ad_unit」などのクラスを持つdiv）を作成し、それをDOMに追加してから、フレームを待って非表示になっているかどうかを確認することです（display: none、たとえば、またはgetBoundingClientRectチェック）。
ただし、厳密に言えば、アドブロッカーが同期的に、またはチェックコードの前に実行される保証はないため、要素のチェックには注意が必要です。
アドブロッカーは特権モードで実行されるため、その操作によって非特権スクリプトスペースでイベントがトリガーされることはありません。簡単に言うと、外部の拡張機能がページを混乱させたときに、DOMMutationEventsを使用してスパイすることはできません。
もう1つのオプションは、「犠牲ファイル」（たとえば、広告のように見えるURIを持つ画像）をロードしてから、要素にonErrorハンドラーをアタッチすることです。疑わしいと思われるエラーがスローされた場合（ChromeではERR_BLOCKED_BY_CLIENTだと思います）、警告メッセージが表示されます。
最終的な選択は、そもそもAdblockの怒りを避けるようにすることです。 Adblockerは通常、EasyList（ https://easylist.to/easylist/easylist.txt ）のようなURIとCSSセレクターのオープンブラックリストを使用します。これはAdblockPlusが使用するものであり、他にもかなりの数があります。あなたcouldは、DOM要素にこれらのセレクターのいずれかと衝突するIDまたはクラスがないことを確認してください。ただし、これは大きなリストであり、いつでも変更される可能性があります。