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

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

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


当前回答

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请求,你可以简单地计算一个假添加的高度。

顺便说一下,这里有一个完整的列表,与广告拦截器避免渲染的元素相匹配。

窗口。adBlockRunning = function() { return (getComputedStyle(document.getElementById("detect"))["display"] == "none") ?真:假; }() console.log (window.adBlockRunning); #{检测 身高:1 px; 宽度:1 px; 位置:绝对的; 左:-999 em; 上图:-999年新兴市场 } <div id="detect" class="ads AD adsbox doubleclick AD -placement carbon-ads"></div>

我有点晚了,这里有一个最简单的解决方案,我知道的老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")。

这个很好用

如果有广告拦截器,它会提醒你

简单地说,它发送一个头部请求到一个著名的广告公司的所有广告拦截器(谷歌广告),如果请求被阻止,那么adbloker存在。

checkAdBlocker (); 函数checkAdBlocker() { 尝试{ fetch ( new Request("https://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js", { 方法:“头”, 模式:“no-cors” }))。Catch(错误=> { showNotification () }); } catch (e) { //请求失败,可能是由于广告拦截程序 showNotification () } } 函数showNotification() { 警告(“请禁用广告拦截器”) }

在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

这份文件可能会有所帮助。 这是检测广告拦截软件最有效的方法 完全免费且易于实现 https://www.detectadblock.com/