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

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

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


当前回答

我还没有看到任何好的,简单的答案来解决这两种类型的广告拦截在今天普遍使用,所以我将提供我自己的答案。

广告拦截器类型1:根据脚本名称(AdBlock, uBlock来源等)拦截网络广告脚本。

广告拦截器类型2:基于服务主机名的广告数据库(FireFox内容拦截器,各种网关插件等)拦截网络广告。

这个解决方案对两者都有效。它会弹出一个巨大的粉色“呼吁框”,要求用户禁用广告拦截器。我们喜欢把它放在菜单下面,内容上面。我们实际上并没有阻止对网站的访问-这只是把页面上的内容往下推了一点,但人们会发现这很烦人,几乎所有人都会遵守并禁用他们在你的网站上的广告拦截器。

这就是解决方案:

A)创建一个名为advertising .js的文件,并将其放置在你的web服务器的根目录下,由以下代码行组成:

document.write('<div id="tester">an advertisement</div>');

B)在你的网页中注入以下内容(你甚至可以使用你的广告服务器代码来做到这一点!)建议位置在菜单下方,内容上方。

<script src="advertisement.js"></script>
<table id="tbl_ab_appeal" style="width: 900px; margin-left:auto; margin-right: auto; padding: 25px; background: #FCC; border: 1px solid #F66; visibility:collapse; border-collapse: collapse;">
    <tr>
        <td>We've detected that you're using an <strong>ad content blocking</strong> browser plug-in or feature. Ads provide a critical source of revenue to the continued operation of [This website name].&nbsp; We ask that you disable ad blocking while on [This
            website name] in the best interests of our community.</td>
    </tr>
</table>
<script>
    if (document.getElementById("tester") == undefined) adsBlocked();

    function adsBlocked() {
        document.getElementById("tbl_ab_appeal").style.visibility = "visible";
        document.getElementById("tbl_ab_appeal").style.borderCollapse = "separate";
        document.getElementById("tbl_ab_appeal").style.marginTop = "10px"
        document.getElementById("tbl_ab_appeal").style.marginBottom = "10px"
    }
</script>
<script onerror="adsBlocked()" src="//www.googletagservices.com/tag/js/gpt.js"></script>

它是如何工作的?消息被加载,但被设为零高度且不可见。如果本地脚本advertising .js运行失败,或者远程AdSense脚本www.googletagservices.com/tag/js/gpt.js加载失败,则该方框可见。

其他回答

不需要超时和DOM嗅探。简单地尝试从流行的广告网络加载一个脚本,看看广告拦截器是否拦截了HTTP请求。

/**
 * Attempt to load a script from a popular ad network. Ad blockers will intercept the HTTP request.
 *
 * @param {string} url
 * @param {Function} cb
 */
function detectAdBlockerAsync(url, cb){
    var script = document.createElement('script');

    script.onerror = function(){
        script.onerror = null;
        document.body.removeChild(script);
        cb();
    }

    script.src = url;
    document.body.appendChild(script);
}

detectAdBlockerAsync('http://ads.pubmatic.com/AdServer/js/gshowad.js', function(){
    document.body.style.background = '#c00';
});

如果你使用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>');

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

我知道已经有足够多的答案,但由于这个问题出现在谷歌搜索“检测广告拦截”的主题上,我想提供一些见解,以防你不使用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还没有启动。我没有费心去进一步调查。

尽管这个问题已经过时了,但我最近发现它非常有用,因此只能假设还有其他人在看它。在看了这里和其他地方之后,我猜测,间接检测广告拦截器的主要三种客户端检查是检查被阻止的div/img,被阻止的iframes和被阻止的资源(javascript文件)。

也许它有点夸张或偏执,但它涵盖了广告拦截系统,这些系统只会从选择中屏蔽一到两个,因此如果你只做了一次检查,可能就不会被覆盖。

在页面上,你正在运行检查添加:(我使用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!)

在advertising .js中,您应该在文档中附加一些内容,以便稍后检查。虽然看起来和前面做的一样,但实际上是在检查文件(advertising .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添加到文档中。然后,当窗口加载时,即内容include . images等加载,我们检查:

第一个测试div的尺寸和可见性。 第二个测试div的内容是“check”,就像如果advertimsent.js没有被阻止一样。 iframe的尺寸(我猜是能见度,因为隐藏对象没有高度或宽度?

以及款式:

div#myTestAd, iframe#adServer
{
    display: block;
    position: absolute;
    left: -9999px;
    top: -9999px;
}

div#myTestAd2
{
    display: none;
}

希望这能有所帮助

不是一个直接的回答,但我会把信息放在广告后面。而不是试图检测它,它会在广告没有显示时显示出来。