我希望能够检测用户是否正在使用广告拦截软件,当他们访问我的网站。如果他们正在使用它,我想显示一条消息,要求他们关闭它以支持项目,就像这个网站一样。

如果你进入该网站,而你的浏览器启用了某种广告拦截软件,那么该网站就不会显示真正的广告,而是显示一个小横幅,告诉用户广告收入用于托管项目,他们应该考虑关闭广告拦截。

我想在我的网站上做到这一点,我正在使用adsense广告,我怎么能做到呢?


当前回答

他们利用谷歌的广告代码创建了一个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>

其他回答

我的解决方案并不针对特定的广告网络,而且是非常轻量级的。我已经在生产环境中运行了几年。AdBlock会屏蔽所有含有“广告”或“预竞价”字样的url。这就是我所做的:

我在webroot中添加了一个名为prebid-ads.js的小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>

uBlock Origin加载他们自己的ads-prebid.js,还原了这个答案中描述的技巧(骄傲!),他们的文件包含以下内容:

(function() {
    'use strict';
    window.canRunAds = true;
    window.isAdBlockActive = false;
})();

作为一种解决方案,只需将canRunAds变量重命名为一些有趣的东西,比如window。adsAreWithUs或window.money高于隐私。

Ans de Nijs的发现和解决方法。谢谢!

支持扩展

像ads.js这样的文件在Chrome上至少会被这些广告拦截器屏蔽:

AdBlock Adblock Plus Adblock职业 Ghostery

不适用于:

隐私獾

我使用JavaScript承诺和jQuery来检测用户是否启用了广告拦截器:

Create a small image and rename it to ads.jpg (or whatever extension). Create a JavaScript function to call it when you need: function hasAdBlocker() { return new Promise(function(resolve, reject) { let img = $('<img style="display: none;" src="ads.jpg" />'); img.on("load", reject); img.on("error", resolve); $("body").append(img); }); } Call it like this: hasAdBlocker().then(function(){ console.log('Has adBlock') }, function() { console.log('No adBlock dedected') })

我知道已经有足够多的答案,但由于这个问题出现在谷歌搜索“检测广告拦截”的主题上,我想提供一些见解,以防你不使用adsense。

具体来说,通过这个例子,您可以检测到是否使用了Firefox Adblock提供的默认Adblock列表。它利用了这个块列表中有一个CSS id为#bottomAd的元素。如果我在页面中包含这样一个元素,并测试它的高度,我知道广告拦截是否活跃:

<!-- some code before -->
<div id="bottomAd" style="font-size: 2px;">&nbsp;</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;不管广告拦截器是否有效。对此,我有两个想法:要么渲染还没有完成,要么Adblock还没有启动。我没有费心去进一步调查。

如果你使用jQuery和谷歌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
});

这更容易理解:如果谷歌广告主JavaScript文件加载失败,AdSense将无法工作,所以您使用jQuery的fail函数做一些事情。

“loading your add now”是当我添加“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>');

在“//谷歌加载主脚本失败,现在做点什么”中,我通常把图像放在广告的地方。

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类需要反映你实际的广告容器。但这应该有用。

EDIT

正如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...
    }
}

当然,如果需要的话,这两个都可以合并成一个if块。

注意可见性:隐藏将不会被捕捉以及(在布局空间保留,但广告不可见)。要检查这一点,可以使用另一个过滤器:

$('.myTestAd').filter(function fi(){
    return $(this).css('visibility') == 'hidden';
})

这将为您提供一个“不可见”的广告元素数组(理论上,任何大于0的都是一个问题)。