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

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

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


当前回答

不需要超时和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';
});

其他回答

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

如果你正在使用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

这对我来说很好……

<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 = '&nbsp;';
                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>

只需在你的网站上添加小脚本:

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>

找到了这个解

异步函数detectAdBlock() { let adBlockEnabled = false const googleAdUrl = 'https://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js' 尝试{ 等待取回(新的请求(googleAdUrl))。catch(_ => adBlockEnabled = true) } catch (e) { adBlockEnabled = true }最后{ console.log(' adBlockEnabled: ${adBlockEnabled} ') } } detectAdBlock ()