ユーザーが私の Web サイトにアクセスしたときに、広告ブロック ソフトウェアを使用しているかどうかを検出できるようにしたいと考えています。使用している場合は、この Web サイトのように、プロジェクトをサポートするためにオフにするように求めるメッセージを表示したいと考えています。
そのサイトにアクセスし、ブラウザで何らかのアドブロック ソフトウェアが有効になっている場合、実際の広告を表示する代わりに、広告収入がプロジェクトのホスティングに使用され、アドブロックをオフにすることを検討する必要があることをユーザーに伝える小さなバナーがサイトに表示されます。 .
自分のウェブサイトでそれを行いたいのですが、アドセンス広告を使用しています。どうすればできますか?
私のソリューションは、特定の広告ネットワークに固有のものではなく、非常に軽量です。私は数年間それを本番環境で実行してきました。AdBlock は、「ads」または「prebid」という単語を含むすべての URL をブロックします。だからこれは私がやったことです：
という名前の小さな js ファイルを webroot に追加しましたprebid-ads.js
2021 年 4 月 12 日更新:すべての広告ブロッカーが次のような名前のファイルをブロックするわけではないため、ファイルprebid-ads.jsまたは何かを呼び出したい場合があります。ads-prebid.jsads.js
これは、そのファイル内の唯一のコード行です
var canRunAds = true;
次に、私のページのどこかに：
<html>
<head>
<script src="/js/prebid-ads.js"></script>
</head>
<body>
<script>
if( window.canRunAds === undefined ){
// adblocker detected, show fallback
showFallbackImage();
}
</script>
</body>
</html>
ads.js のようなファイルは、Chrome で少なくとも次の広告ブロッカーによってブロックされます。
2019-02-15 の更新:
拡張機能が ads.js へのリクエストもブロックするようになったため、上記のリストに Ghostery を追加しました。とても便利な。これは、Ghostery が開発者が拡張機能で広告のブロックを検出するのに実際に役立っているということですか?
以下では動作しません:
プライバシーバジャー
直接的な答えではありませんが、読み込まれる広告の背後にメッセージを配置します...それを検出しようとするのではなく、広告が表示されないときに表示されるだけです。
http://thepcspy.com/read/how_to_block_adblock/
jQuery の場合:
function blockAdblockUser() {
if ($('.myTestAd').height() == 0) {
window.location = 'http://example.com/AdblockNotice.html';
}
}
$(document).ready(function(){
blockAdblockUser();
});
もちろん、AdblockNotice.html のランディング ページが必要であり、.myTestAd クラスは実際の広告コンテナーを反映する必要があります。しかし、これはうまくいくはずです。
編集
TD_Nijboer が推奨するように、より良い方法は:hidden(または:visible、以下で使用するように) セレクターを使用して、それdisplay: noneもチェックされるようにすることです。
function blockAdblockUser() {
if ($('.myTestAd').filter(':visible').length == 0) {
// All are hidden, or "not visible", so:
// Redirect, show dialog, do something...
} else if ($('.myTestAd').filter(':hidden').length > 0) {
// Maybe a different error if only some are hidden?
// Redirect, show dialog, do something...
}
}
もちろん、必要に応じて、これらの両方を 1 つのifブロックに結合することもできます。
どちらによってもキャプチャされないことに注意してくださいvisibility: hidden(レイアウト スペースはそのままですが、広告は表示されません)。それを確認するには、別のフィルターを使用できます。
$('.myTestAd').filter(function fi(){
return $(this).css('visibility') == 'hidden';
})
これにより、「見えない」広告要素の配列が得られます（0理論的には、どれも問題ではありません）。
ほとんどの広告は JavaScript で動的に読み込まれます。onerror イベントを使用して、広告スクリプトが読み込まれたかどうかを検出しました。うまくいくようです。
GoogleAds の例:
<script async src="//pagead2.googlesyndication.com/pagead/js/adsbygoogle.js" onerror="adBlockFunction();"></script>
これは、広告ブロッカーがコンテンツをブロックしているかどうかを確認するために、他の要素でも使用できます。リモート要素が存在しないか到達できない場合、このメソッドは誤検知を生成する可能性があります。
ユーザーが広告をブロックしているかどうかを検出するには、広告 JavaScript で関数を見つけてテストするだけです。広告をブロックするためにどのような方法を使用しているかは問題ではありません。Google Adsense 広告の場合は次のようになります。
if(!window.hasOwnProperty('google_render_ad') || window.google_render_ad === undefined) {
//They're blocking ads, display your banner
}
この方法の概要は次のとおりです: http://www.metamorphosite.com/detect-web-popup-blocker-software-adblock-spam
追加の HTTP リクエストは必要ありません。偽の追加の高さを計算するだけでかまいません。
ちなみに、広告ブロッカーがレンダリングを回避する要素に一致する完全なリストは次のとおりです。
window.adBlockRunning = function() {
return (getComputedStyle(document.getElementById("detect"))["display"] == "none") ? true : false;
}()
console.log(window.adBlockRunning);#detect {
height: 1px;
width: 1px;
position: absolute;
left: -999em;
top: -999em
}<div id="detect" class="ads ad adsbox doubleclick ad-placement carbon-ads"></div>私のアドバイスは次のとおりです。
人々を「悪者」として扱うシナリオは、いずれも彼らの反撃につながります。
これが私の提案です。
(広告がブロックされているかどうかに関係なく) ページの上部に目立たない小さなメッセージを配置し、テキストI *totally* respect your right to block adsと別のページ/ポップアップへのリンクをRead more ....
別のページでは、これが彼らのコンピューターであり、広告ブロックを自由に使用できることを明確に示してください。
また、これらのブロッカーを使用すると優れたコンテンツを提供することがより困難になること (理由を詳細に説明すること) と、サイトで広告のブロックが発生しないことを望んでいることを、非非難的な方法で明確にします。それは完全に彼らの決定です。ブロッキングをオフにすることの利点に注目してください。
広告に激しく反対する人はこれを無視しますが、とにかく説得するチャンスはありませんでした. 無関心な人は、あなたの訴えに左右される可能性があります。なぜなら、あなたは「道を譲るか、ボールを持って家に帰ります」ということを正直に 5 歳の子供の独占的な領域にする必要があるわけではないからです。
覚えておいてください、誰もあなたの頭に銃を向けたり、ネットに自分のものを置くように強要したりしませんでした. 読者/ユーザーに敬意を持って接してください。
サイトに小さなスクリプトを追加するだけです:
var isAdsDisplayed = true;
adsbygoogle.jsという名前で
次に、次のようにします。
<script src="/js/adsbygoogle.js"></script>
<script>
if(window.isAdsDisplayed === undefined ) {
// AdBlock is enabled. Show message or track custom data here
}
</script>
ここでこのソリューションを見つけました
広告ブロックがあるかどうかを確認する効率的な方法: Google 広告の URL をトリガーして、広告ブロックが有効になっているかどうかを確認するだけです。はいの場合は callback_has_adblock を実行し、そうでない場合は callback_no_adblock を実行します。この解決策では、リクエストが 1 つ多くかかりますが、少なくとも常に機能します。
var hasAdBlock = function (callback_has_adblock, callback_no_adblock) {
$.getScript( "https://pagead2.googlesyndication.com/pagead/show_ads.js" )
.done(function( script, textStatus ) {
callback_no_adblock();
})
.fail(function( jqxhr, settings, exception ) {
callback_has_adblock();
});
};
このソリューションは、Google アドセンスだけでなく、あらゆる種類の広告で機能します。
すでに十分な回答があることは承知していますが、この質問は Google で「広告ブロックの検出」を検索したときに出てくるので、adsense を使用していない場合に備えて、いくつかの洞察を提供したいと思いました。
具体的には、この例では、Firefox Adblock によって提供されるデフォルトの Adblock リストが使用されているかどうかを検出できます。このブロックリストには、CSS id でブロックされた要素があることを利用しています#bottomAd。そのような要素をページに含めてその高さをテストすると、広告ブロックがアクティブかどうかがわかります。
<!-- some code before -->
<div id="bottomAd" style="font-size: 2px;"> </div>
<!-- some code after -->
残りは、通常の jQuery 容疑者を介して行われます。
$(document).ready( function() {
window.setTimeout( function() {
var bottomad = $('#bottomAd');
if (bottomad.length == 1) {
if (bottomad.height() == 0) {
// adblocker active
} else {
// no adblocker
}
}
}, 1);
}
setTimeoutご覧のとおり、少なくとも 1 ミリ秒のタイムアウトで使用しています。私はこれをさまざまなブラウザーでテストしましたが、ほとんどの場合、要素を直接チェックしてready常に0を返しました。広告ブロッカーがアクティブかどうかに関係なく。私はこれについて 2 つの考えを持っていました: レンダリングがまだ行われていないか、Adblock がまだ開始されていないかのどちらかです。それ以上調べる気も起きませんでした。
彼らは、Googleの広告コードがID「iframe」でiframeを作成するという事実を利用しています。そのIDのページにまだ何かがない限り、これも機能します。
<p id="ads">
<script type="text/javascript"><!--
google_ad_client = "their-ad-code-here";
/* 160x600, droite */
google_ad_slot = "their-ad-code-here";
google_ad_width = 160;
google_ad_height = 600;
//-->
</script>
<script type="text/javascript"
src="http://pagead2.googlesyndication.com/pagead/show_ads.js">
</script>
</p>
<script type="text/javascript"><!--
if(document.getElementsByTagName("iframe").item(0) == null)
{
document.write("<div style='width:160px; height:600px; padding-top: 280px; margin-left:5px;border:1px solid #000000; text-align:center; font-family:century gothic, arial, helvetica, sans serif;padding-left:5px;padding-right:5px;'>Advertising seems to be blocked by your browser.<br /><br /><span style='font-size:10px'>Please notice that advertising helps us to host the project.<br /><br />If you find these ads intrusive or inappropriate, please contact me.</span><img src='http://www.playonlinux.com/images/abp.jpg' alt='Adblock Plus' /></div>");
}
--></script>
以前のコメントでは、Google AdSense をテスト対象として使用していることに気付きました。一部のページではアドセンスが使用されておらず、テストとしてアドセンス ブロックを使用することはあまりお勧めできません。アドセンス ブロックは SEO に悪影響を及ぼす可能性があるためです。これは、アドブロッカーの単純なブロックされたクラスで検出する方法の例です。
HTML:
<div class="ad-placement" id="ablockercheck"></div>
<div id="ablockermsg" style="display: none"></div>
Jクエリ:
$(document).ready(function()
{
if(!$("#ablockercheck").is(":visible"))
{
$("#ablockermsg").text("Please disable adblocker.").show();
}
});
「ablockercheck」はアドブロッカーがブロックするIDです。したがって、表示されているかどうかを確認すると、アドブロッカーがオンになっているかどうかを検出できます。
安全な方法は、広告を内側にラップ<div>して高さを確認することです
<div id="check-ab">
/* your ads code */
</div>
setTimeout(function(){
if(document.getElementById("check-ab").offsetHeight === 0){
console.log("ads blocked");
}
else{
console.log("ads running");
}
}, 100);
adblock plus と bluehell ファイアウォールで動作します。
この質問の年齢にもかかわらず、私は最近それが非常に便利であることに気付いたので、他の人がまだそれを見ているとしか思えません. ここや他の場所を見た後、広告ブロッカーを間接的に検出するための主な 3 つのクライアント側チェックは 、ブロックされたdiv/ img、ブロックされたiframes、およびブロックされたリソース (javascript ファイル) をチェックすることであると推測しました。
多分それは行き過ぎか偏執的かもしれませんが、選択から1つまたは2つだけをブロックする広告ブロックシステムをカバーしているため、1つのチェックだけを行っていた場合はカバーされていない可能性があります.
チェックを実行しているページに次を追加します：（私はjQueryを使用しています）
<script type="text/javascript" src="jquery.js"></script>
<script type="text/javascript" src="advertisement.js"></script>
<script type="text/javascript" src="abds.js"></script>
ページの他の場所に次を追加します。
<div id="myTestAd"><img src="http://placehold.it/300x250/000000/ffffff.png&text=Advert" /></div>
私は餌の名前を持つ div と、「Advert」というテキストを含む外部でホストされた画像と、AdSense で使用されるサイズを使用しました (placehold.it に感謝します!)。
後で確認できるように、ドキュメントにadvertisement.js何かを追加する必要があります。前と同じことをしているように見えますが、実際にadvertisement.jsは、出力ではなく、ロードされているファイル ( ) 自体をチェックしています。
$(document).ready(
{
$("body").append("<div id=\"myTestAd2\">check</div>");
});
そして、すべてを組み合わせた広告ブロッカー検出スクリプト
$(document).ready(function()
{
var ifr = '<iframe id="adServer" src="http://ads.google.com/adserver/adlogger_tracker.php" width="300" height="300"></iframe>';
$("body").append(ifr);
});
$(window).on("load",function()
{
var atb = $("#myTestAd");
var atb2= $("#myTestAd2");
var ifr = $("#adServer");
setTimeout(function()
{
if( (atb.height()==0) ||
(atb.filter(":visible").length==0) ||
(atb.filter(":hidden").length>0) ||
(atb.is("hidden")) ||
(atb.css("visibility")=="hidden") ||
(atb.css("display")=="none") ||
(atb2.html()!="check") ||
(ifr.height()!=300) ||
(ifr.width()!=300) )
{
alert("You're using ad blocker you normal person, you!");
}
},500);
});
ドキュメントの準備ができたら、つまりマークアップが読み込まれたら、iframe もドキュメントに追加します。次に、ウィンドウがロードされると、つまりコンテンツが含まれます。画像などが読み込まれたら、次のことを確認します。
advertimsent.jsいない場合と同じです。そしてスタイル：
div#myTestAd, iframe#adServer
{
display: block;
position: absolute;
left: -9999px;
top: -9999px;
}
div#myTestAd2
{
display: none;
}
お役に立てれば
新しい AdSense コードを使用すると、コンテンツ チェックや CSS チェックを行わなくても簡単にチェックできます。
マークアップに通常どおり広告を配置します。
<ins class="adsbygoogle" style="display: block;"
data-ad-client="ca-pub-######"
data-ad-slot="#######"
data-ad-format="auto"></ins>
<script>(adsbygoogle = window.adsbygoogle || []).push({});</script>
次に、ページの下部にあるアドセンス コードを呼び出します (スクリプトを呼び出すときにフラグを使用しないでください)。"async"adsbygoogle.js
<script src="//pagead2.googlesyndication.com/pagead/js/adsbygoogle.js"></script>
次に、その下にこの小さなコード スニペットを追加します。
<script>
if (!adsbygoogle.loaded) {
// do something to alert the user
}
</script>
AdSense は常に、広告が読み込まれるときにフラグadsbygoogle.loadedを作成/設定しtrueます。チェックを setTimeout 関数に配置して、チェックを数秒遅らせることができます。
<script src="http://code.jquery.com/jquery-latest.js"></script>
<script>var adb=true;</script>
<script src="./getbanner.cfm?"></script>
<script>
$(document).ready(function(){if(adb)alert('AdBlock!');});
</script>
および getbanner.cfm ファイルで:
adb = false;
adblock を検出する最も簡単な方法だと思います。
jQuery と Google Adsense を使用している場合:
jQuery.getScript(
"https://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js",
function() {
// Load your ad now
}).fail(function() {
// Google failed to load main script, do something now
});
これはわかりやすいです。Google 広告のメイン JavaScript ファイルの読み込みに失敗すると AdSense が機能しないため、jQuery の fail 関数を使用して何かを行います。
「今すぐ追加をロード」は、次のような「ins」オブジェクトを追加するときです。
jQuery(".my_ad_div").append('<ins class="adsbygoogle"
style="display:block"
data-ad-client="ca-pub-xxx"
data-ad-slot="xxx"
data-ad-format="auto"
data-full-width-responsive="true"></ins>
<script>
(adsbygoogle = window.adsbygoogle || []).push({});
</script>');
また、「// Google がメイン スクリプトを読み込めませんでした。今すぐ何かを実行してください」では、通常、広告の場所に画像を配置します。
timing's答えはいい考えですが、もう機能しないので、jsファイルの名前を「ads」から「adsense」に更新しましたが、魅力のように機能しています!
これがコードです。おそらくこれは誰かを助けるでしょう：
<html>
<head>
<script src="/adsense.js"></script>
</head>
<body>
<script>
if( window.adblockDetecter === undefined ){
// Do anithing, adblocker detected!
alert('Adblocker Detected!');}
</script>
</body>
</html>
Js ファイルには、次の行だけを入れます。var adblockDetecter = true;
あなたはこれをチェックすることができ ます
タイミング回答の実装
head タグ内のスクリプトの前にこれを追加します。
<head>
<title></title>
<meta/>
<!--adBlocker detection code - START-->
<script src="//adblocker.fortiapp.com/ads.js"></script>
<script>
(function (i, o, g, r) {
i[o] = (typeof i[o] == typeof undefined) ? g : r
})(window, 'adblocker', true, false);
</script>
<!--adBlocker detection code - END-->
// Other scripts
</head>
その後、それを使用します。
if (adblocker) {
// the add blocker is enabled
}else{
// ad blocker is not enabled
}
私はあなたの緊張を理解し、要素がスクリプトによって作成されたか、または要素が非表示になっているかを確認できます。また、広告ブロックについて話す場合、要素の存在ではなく、要素の可視性のみを当てにすることができます.
サードパーティのスクリプトで作成された要素は存在しません。その時点でスクリプトに到達できない場合 (DNS エラー、リモート Web サーバー エラー、オフライン Web ページのプリロードなど)、常に誤検知が発生します。
チェック付きの他のすべての回答は正しいですが、これを覚えておいてください。
ブラウザの新しいタブをブロックする広告ブロックに問題がある場合は、次のようなことができます。
$('a').click(function(e){ // change $('a') into more specific selector
const openedWindow = window.open(this.href, '_blank');
// Check if browser tab was closed within 0.3 second (user can't, adblock does).
setTimeout(() => {
if (openedWindow.closed) {
alert('Adblock detected!');
}
}, 300);
e.preventDefault(); // return false if you like
});
このコードは、サイト全体をブロックするのではなく、ブラウザーのタブが閉じられている理由をユーザーに伝えるだけの場合にのみ役立ちます;)
これは私のために働いたものです：
function isAdBlocked() {
return (typeof(window.google_jobrunner) === "undefined") ? true : false;
}
$(document).ready(function(){
if(isAdBlocked()) {
alert('Y U NO LIKE ADS?');
}
});
現在、AdBlock Detector
と呼ばれる単純な JS スクリプトを使用してそれを行うより良い方法があり
ます。使用方法は次のとおりです。これをセクション
に追加します。<head>
<script type="text/javascript">
window.onload = function() {
var iframe = document.createElement('iframe'),
randomDomain = Math.floor(Math.random() * (10000 - 100 + 1)) + 100,
iframeLoaded = true;
iframe.src = "http://"+ randomDomain +".com/ads.html";
iframe.height = ".1px";
iframe.width = ".1px";
iframe.id = 'some-ad';
iframe.onload = function() {iframeLoaded = false;};
document.body.appendChild(iframe);
setTimeout(function() {
var someAd = document.getElementById('some-ad');
if(!iframeLoaded ||
someAd == null ||
someAd.style.display == "none" ||
someAd.style.display == "hidden" ||
someAd.style.visibility == "hidden" ||
someAd.offsetHeight == 0)
document.getElementById('ab-message').style.display = 'block';
someAd.remove();
}, 500);
};
</script>`<br>
ab-messageこれで、AdBlock ユーザーにメッセージを表示したい場所ならどこでも idを使用できます。
<div id="ab-message" style="display: none">Your message here!</div>
もともと非表示にするために追加されたインライン スタイルに注意してください (もちろん、独自の CSS ファイルからこれを行うこともできます)。
また、500 ミリ秒かかることにも注意してください。これは、広告ブロッカーが機能するのを待たなければならないか、機能しないためです。
まず、ランダムに生成されたリンクのソースを iframe に追加します。(一部の広告ブロックはスマートで、ある時点でリンクが偽物であることに気付くため、ランダムに生成されます)。
次に、その iframe に対して複数のチェックを実行します (正常に読み込まれたか、スタイルが変更されたかどうか)。これらのテストのいずれかが true の場合、ab-message要素を表示してユーザーをアドブロックします。
このスクリプトは、ほとんどの (すべてではないにしても) 広告ブロッカーで機能します。
要点を作成するだけでは意味がありませんが、代わりに Github プロジェクトを作成しましたが、それでも、それをチェックして、役に立った場合はスターを付けてください。
abDetector: シンプルなバニラ JavaScript AdBlock 検出器。
楽しみ。
ここでのパーティーには少し遅れましたが、jQuery を使用した古い AdSense コードについて、私が知っている最も簡単な解決策を次に示します。
$ads = $("ins");
if ($ads.length == 0) {
// Replacement code about you needing ad income
}
プレーンな JavaScript では、次のようになります。
$ads = document.getElementsByTagName("ins");
if ($ads.length == 0) {
// Replacement code about you needing ad income
}
生成される広告と一致することがわかっている任意$adsのセレクターを使用できます。たとえば、新しい AdSense コードを使用できます$("iframe#google_ads_frame1")。