我希望能够检测用户是否正在使用广告拦截软件,当他们访问我的网站。如果他们正在使用它,我想显示一条消息,要求他们关闭它以支持项目,就像这个网站一样。
如果你进入该网站,而你的浏览器启用了某种广告拦截软件,那么该网站就不会显示真正的广告,而是显示一个小横幅,告诉用户广告收入用于托管项目,他们应该考虑关闭广告拦截。
我想在我的网站上做到这一点,我正在使用adsense广告,我怎么能做到呢?
我希望能够检测用户是否正在使用广告拦截软件,当他们访问我的网站。如果他们正在使用它,我想显示一条消息,要求他们关闭它以支持项目,就像这个网站一样。
如果你进入该网站,而你的浏览器启用了某种广告拦截软件,那么该网站就不会显示真正的广告,而是显示一个小横幅,告诉用户广告收入用于托管项目,他们应该考虑关闭广告拦截。
我想在我的网站上做到这一点,我正在使用adsense广告,我怎么能做到呢?
当前回答
我用jquery最简单的解决方案是:
$.ajax({
url: "/scripts/advertisement.js", // this is just an empty js file
dataType: "script"
}).fail(function () {
// redirect or display message here
});
advertising .js什么都不包含。当有人使用adblock时,它失败了,函数被调用。
其他回答
AdBlock似乎阻止加载AdSense(等)JavaScript文件。所以,如果你使用异步版本的AdSense广告,你可以检查adsbygoogle是否是一个数组。这必须在几秒钟后检查,因为异步脚本是…异步的。以下是一个大致的大纲:
window.setTimeout(function(){
if(adsbygoogle instanceof Array) {
// adsbygoogle.js did not execute; probably blocked by an ad blocker
} else {
// adsbygoogle.js executed
}
}, 2000);
为了澄清,这里有一个AdSense异步广告代码的示例:
<!-- this can go anywhere -->
<script async src="//pagead2.googlesyndication.com/pagead/js/adsbygoogle.js"></script>
<!-- this is where the ads display -->
<ins class="adsbygoogle" ...></ins>
<script>
(adsbygoogle = window.adsbygoogle || []).push({});
</script>
注意adsbygoogle被初始化为一个数组。adsbygoogle.js库将此数组更改为Object {push:…}当它执行时。在一段时间后检查变量的类型可以告诉您脚本是否已加载。
如果使用新的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函数中,以延迟检查几秒钟。
我使用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') })
如果你正在使用react和钩子:
import React, { useState, useEffect } from 'react'
const AdblockDetect = () => {
const [usingAdblock, setUsingAdblock] = useState(false)
let fakeAdBanner
useEffect(() => {
if (fakeAdBanner) {
setUsingAdblock(fakeAdBanner.offsetHeight === 0)
}
})
if (usingAdblock === true) {
return null
}
return (
<div>
<div
ref={r => (fakeAdBanner = r)}
style={{ height: '1px', width: '1px', visibility: 'hidden', pointerEvents: 'none' }}
className="adBanner"
/>
Adblock!
</div>
)
}
export default AdblockDetect
如果你有问题的adblock阻止新标签在浏览器中,你可以这样做:
$('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
});
这段代码是有用的,如果你不想阻止整个网站,只是告诉用户为什么他们的浏览器标签是关闭的;)