我希望能够检测用户是否正在使用广告拦截软件，当他们访问我的网站。如果他们正在使用它，我想显示一条消息，要求他们关闭它以支持项目，就像这个网站一样。
如果你进入该网站，而你的浏览器启用了某种广告拦截软件，那么该网站就不会显示真正的广告，而是显示一个小横幅，告诉用户广告收入用于托管项目，他们应该考虑关闭广告拦截。
我想在我的网站上做到这一点，我正在使用adsense广告，我怎么能做到呢?
当前回答
在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
其他回答
只需在你的网站上添加小脚本:
var isAdsDisplayed = true;
名称为adsbygoogle.js
然后做以下事情:
<script src="/js/adsbygoogle.js"></script>
<script>
if(window.isAdsDisplayed === undefined ) {
// AdBlock is enabled. Show message or track custom data here
}
</script>
找到了这个解
<script src="http://code.jquery.com/jquery-latest.js"></script>
<script>var adb=true;</script>
<script src="./getbanner.cfm?"></script>
<script>
$(document).ready(function(){if(adb)alert('AdBlock!');});
</script>
在getbanner中。cfm文件:
adb = false;
我认为这是检测广告拦截最简单的方法。
async function hasAdBlock() {
try {
await fetch("https://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js", {
method: "HEAD",
mode: "no-cors",
})
return false;
} catch(e) {
return true;
}
}
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的都是一个问题)。
如果使用新的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函数中，以延迟检查几秒钟。
