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

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

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


当前回答

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的都是一个问题)。

其他回答

我在我的网站上使用的这种方法,也许你会发现它很有用。在我看来,这是最简单的解决办法。

AdBlocker阻止特定的类和html元素,通过检查这些选择器的任何被阻止的广告在开发控制台(他们都列出),你可以看到哪些元素将总是被阻止。

例如,只要在stackoverflow上检查这个问题页面,你就会看到一堆被阻止的广告。

例如,任何带有bottom-ad类的元素都会被自动阻塞。

我用bottom-ad类创建了一个非空div元素: < span style=" font - family:宋体;"身高:1 px;“>你好< / div > 页面加载后,检查该元素是否被隐藏。我使用的是jQuery,但也可以使用javascript: $ (' .bottom-ad ') . css('显示')= =“没有”或更好的利用美元(.bottom-ad) .(:可见)

如果值为真,则AdBlocker是活动的。

尽管这个问题已经过时了,但我最近发现它非常有用,因此只能假设还有其他人在看它。在看了这里和其他地方之后,我猜测,间接检测广告拦截器的主要三种客户端检查是检查被阻止的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;
}

希望这能有所帮助

我的建议是:不要这样做!

在任何情况下,你把人们视为“做错事的人”都会导致他们反击。

这是我的建议。

在页面顶部放一个不显眼的小消息(不管广告是否被阻止),文字我完全尊重你阻止广告的权利,并链接到另一个页面/弹出标题为阅读更多....

在另一页上,清楚地表明你明白这是他们的电脑,他们可以自由地使用广告拦截。

也要以一种非指责的方式明确表示,使用这些拦截器会让你更难发布优质内容(详细解释原因),虽然你不希望广告拦截器出现在你的网站上,但这完全是他们的决定。专注于关闭阻塞的积极方面。

那些强烈反对广告的人会忽略这一点,但你从来没有机会说服他们。那些漠不关心的人很可能会被你的吸引力所动摇,因为你没有做“让我走我的路,否则我就拿着我的球回家”的事情,老实说,这应该是五岁孩子的专属领域。

记住,没有人拿枪指着你的头强迫你把东西放到网上。尊重你的读者/用户,你可能会发现很多人会回报你。

如果使用新的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>

然后你在你的页面底部调用adsense代码(注意,在调用adsbygoogle.js脚本时不要使用"async"标志):

<script src="//pagead2.googlesyndication.com/pagead/js/adsbygoogle.js"></script>

然后在下面添加一小段代码:

<script>
if (!adsbygoogle.loaded) {
   // do something to alert the user
}
</script>

AdSense总是创建/设置标志adsbygoogle。当广告加载时,你可以将检查放在setTimeout函数中,以延迟检查几秒钟。

在React.js中,你可以做以下事情:

class AdblockDetect extends Component {
  constructor (props) {
    super(props)
    this.state = {
      usingAdblock: false
    }
  }

  componentDidMount() {
    this.setState({ usingAdblock: this.fakeAdBanner.offsetHeight === 0 });
  }

  render() {
    if (this.state.usingAdblock === true) {
      return this.props.children;
    }

    return (
      <div
        ref={r => (this.fakeAdBanner = r)}
        style={{ height: '1px', width: '1px', visiblity: 'none', pointerEvents: 'none' }}
        className="adBanner"
      />
    );
  }
}

class App extends Component {
  render() {
    return (
      <div className="App">
        <AdblockDetect>You are using adblock</AdblockDetect>
      </div>
    );
  }
}

来源:https://stackoverflow.com/a/55635499/5539715