我希望能够检测用户是否正在使用广告拦截软件,当他们访问我的网站。如果他们正在使用它,我想显示一条消息,要求他们关闭它以支持项目,就像这个网站一样。
如果你进入该网站,而你的浏览器启用了某种广告拦截软件,那么该网站就不会显示真正的广告,而是显示一个小横幅,告诉用户广告收入用于托管项目,他们应该考虑关闭广告拦截。
我想在我的网站上做到这一点,我正在使用adsense广告,我怎么能做到呢?
我希望能够检测用户是否正在使用广告拦截软件,当他们访问我的网站。如果他们正在使用它,我想显示一条消息,要求他们关闭它以支持项目,就像这个网站一样。
如果你进入该网站,而你的浏览器启用了某种广告拦截软件,那么该网站就不会显示真正的广告,而是显示一个小横幅,告诉用户广告收入用于托管项目,他们应该考虑关闭广告拦截。
我想在我的网站上做到这一点,我正在使用adsense广告,我怎么能做到呢?
当前回答
大多数adblocker取消对ads.js的HTTP请求,并为元素制作0px,但有时adblocker删除了DOM,上面的一些答案将失败,因为没有检查元素的存在。
使用setTimeout()是一个很好的实践,因为没有它,将使脚本与广告拦截器竞争。
下面的脚本将检查dom是否存在/已删除,如果存在则检查元素的offsetHeight。
setTimeout(函数(){ var a = document.querySelector('.showads'), B = a ?(a.offsetHeight ?False:真):真; console.log(“广告了吗?”,b) }, 200);//不要太快,否则会使结果出错。 <div class="ads showads"> 我爱你,我爱你,我爱你。 < / div >
其他回答
我在我的网站上使用的这种方法,也许你会发现它很有用。在我看来,这是最简单的解决办法。
AdBlocker阻止特定的类和html元素,通过检查这些选择器的任何被阻止的广告在开发控制台(他们都列出),你可以看到哪些元素将总是被阻止。
例如,只要在stackoverflow上检查这个问题页面,你就会看到一堆被阻止的广告。
例如,任何带有bottom-ad类的元素都会被自动阻塞。
我用bottom-ad类创建了一个非空div元素: < span style=" font - family:宋体;"身高:1 px;“>你好< / div > 页面加载后,检查该元素是否被隐藏。我使用的是jQuery,但也可以使用javascript: $ (' .bottom-ad ') . css('显示')= =“没有”或更好的利用美元(.bottom-ad) .(:可见)
如果值为真,则AdBlocker是活动的。
他们利用谷歌的广告代码创建了一个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>
我有点晚了,这里有一个最简单的解决方案,我知道的老AdSense代码与jQuery:
$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")。
这对我来说很好……
<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>
</head>
<body>
<p>If you click on me, I will disappear.</p>
<p>Click me away!</p>
<p>Click me too!</p>
<script>
var adBlockEnabled = false;
var adSense = document.createElement('div');
adSense.innerHTML = ' ';
adSense.className = 'adsbox';
document.body.appendChild(adSense);
window.setTimeout(function() {
if (adSense.offsetHeight === 0) {
adBlockEnabled = true;
}
adSense.remove();
if (adBlockEnabled) {
alert('Adblock enabled');
} else {
alert('Adblock disabled or Not installed');
}
}, 100);
</script>
</body>
</html>
html文件
<script src="wp-banners.js"></script>
<script>
if(document.getElementById('LavXngdFojBe')){
alert('Blocking Ads: No');
} else {
alert('Blocking Ads: Yes');
}
</script>
wp-banners.js
var e=document.createElement('div');
e.id='LavXngdFojBe';
e.style.display='none';
document.body.appendChild(e);
这也显示在https://detectadblock.com上。