广告是现在很多互联网公司重要的收入来源之一,甚至对于部分公司,有可能是赚钱的唯一途径,互联网公司恨不得将广告潜入到每一个用户能看到的网页中去。而另外一方面,许多用户早已厌倦了各种各样的广告,想着办法利用各种软件去屏蔽各种广告。根据 Deloitte 最近的一项调查表明,2017 年有 31% 的美国人在他们的计算机上使用了某种形式的广告拦截器。以 Adblock Plus 软件为例,它是世界上最受欢迎的广告拦截器之一,其累计下载量已经超过 5 亿,今天,本文就以它为例,向大家介绍广告拦截器是如何工作的。
Adblock Plus 的作用
如下图所示,Adblock Plus 能够过滤掉网站上的广告内容,使你看到一个清爽的没有广告的网页:
AdBlock Plus 阻止哪些广告
Adblock Plus 公司表示他们并不想默认阻止所有的广告,在 2009 年的一份用户调研报告中显示,只有 25% 的人群会主动选择去屏蔽所有广告。AdBlock Plus 默认会屏蔽一些特别恶意性的广告,例如动画广告、自动播放的广告、弹窗广告、Flash 广告、图片太大的广告等等。像下图中的绿色广告部分,占据了网页的顶部、侧边栏、底部等,并且总体占用百分比低于某个阈值的话,广告就不会被屏蔽。如果广告直接显示在网页正面内容中的话(红色区域),就会被屏蔽掉。
AdBlock Plus 如何屏蔽广告
AdBlock Plus 主要采用阻止 HTTP 请求加载和隐藏广告元素这两种方式屏蔽广告。一般而言,广告大多数位于另外一台服务器上,采用不同的域名,所以大多数屏蔽都是通过阻止 HTTP 请求加载来完成的,同时这也能提高网页整体的加载速度。
如果广告和网页是在一台服务器上存储的,那么 AdBlock Plus 会采用 CSS 过滤器来屏蔽广告。它会使用 nsIStyleSheetService 样式表服务来将自定义的 CSS 加载到网页上,从而覆盖掉网页默认的 CSS:
为什么它如此之快
广告拦截器的卖点之一就是让你的页面加载速度更快,AdBlock Plus 的创建者 Wladimir Palant 痴迷于哪种算法能简化工具的过滤器匹配过程。正如 Wladimir Palant 所述,他改进过的 Boyer-Moore 算法匹配速度运行得非常快,该算法有效结合了两种模式匹配方法: 坏字符启发式和良好后缀启发式。坏字符启发式将采用第一个不匹配的字符(从右到左),并在模式中寻找匹配的字符:
如果没有匹配的字符,则整个模式将移动到不匹配的字符之外,因为如果字符没有出现在模式中的任何位置,则无法匹配。这样可以节省搜索匹配的时间。
算法中使用的另一种技术是良好后缀启发式。如果模式和字符串之间的几个字符匹配(从右向左扫描),这将会继续查看匹配后缀是否有出现在其他位置。如果是这样,它将继续向下移动,以便测试模式中的其它“好后缀”是否匹配。
下面代码是对上述算法的一个大致描述:
对开发者有什么启示
作为开发者,我们需要了解热门广告过滤器的基本工作方式。通过了解它们是如何工作的,我们才能确保自己投放在网页上的广告尽可能的不被过滤器所屏蔽掉。
领取专属 10元无门槛券
私享最新 技术干货