2026年这个小站的第一次更新,居然是做了个反广告插件拦截功能...

周末把网站全站做了个本地备份,增加了「感受和观点」这个栏目,也增加了点小功能,和免费资源无关。

广告的重要性

在网站的关于页面,我提过我这个网站的采用技术栈,除了写文章的人力成本,最大的成本是服务器和图片的 cdn 托管,文章末尾也假豪横地说了「网站运行无需赞助」,这很大程度上是因为网站接入了 Google Adsense,加上我多年以来借家人亲戚的手机号不断注册新的阿里云 / 腾讯云账号,以极低的价格买了新客专享的服务器,到期就全站迁移至新的服务器,才得以让网站持续运行多年。

如果没有广告,网站很难维持图片储存服务以及服务器费用。可能是受 AI 的影响吧,Adsense 的收益越来越少,去年年中我就在网站里加了几行代码:

function checker() {
  if (/mobile|android/i.test(navigator.userAgent)) return; 
   console.log('checker works');
  if (window._AdBlockInit === undefined){
    (new Image()).src = `/stat.webp?p=${location.pathname}&r=${Date.now()}`;
    console.log('had detected');
  }
}

这段代码的用途是,当电脑端的用户访问网站时,如果广告被插件拦截,就会访问一个极小的图片,这样我就能在网站日志中统计广告被拦截的次数。一开始每天只有30%左右的广告拦截量,虽然比重已经很高了,但我也不想做什么措施,因为我也知道没有广告体验更好。

太多人安装了广告拦截插件

但最近我翻看日志发现,安装广告拦截插件的用户已经超过 50% 了,影响太大了,所以只能做这么一个提示,告诉那些用插件拦截广告的用户:

如果我的网站内容能帮助到你,请给我的网站开个白名单(不是关闭插件,只是在访问我的网站的时候,暂停拦截广告)。

反广告拦截弹窗示意图
反广告拦截弹窗示意图

本来只是想让 DeepSeek 简单帮我写一个代码弹窗提示,但弄出来体验真差,感觉像是网站故障了一样,所有又花了1、2个小时调样式,调体验,最后采用的是在文章内页弹出一个占用半个屏幕的弹窗,这样既能让初次进来的用户看到我的文章列表,又能达到目的(需要停止拦截广告才能看到完整的文章)。

代码也很简单,写好一个右半屏弹窗 HTML 和 CSS 代码,在上面检测广告被拦截的 JS 代码后面增加显示弹窗就行:

const help = document.querySelector('.help-card-mask');
if(help){
   help.classList.add('show');
}

无奈之举

上一次这么无奈,决定手动给网站上所有文章图片加上水印。这不仅不美观,还需要花费我手动操作的时间(手动是因为需要确保水印挡在不容易处理的地方)。这么做的原因是不少自媒体号直接抄袭我的文章和图片,丢给 AI 洗稿,很多时候投诉无门,才迫不得已加上水印作为证明。

这里也说一下,现在自媒体平台对「那些免费的砖」的抄袭、盗图举报已经非常友好,一旦发现抄袭、洗稿和盗图,提交原文链接以及发表日期的证据来举报,几乎 10 分钟内就能给支持处理。