ADBlock的实现原理

ADBlock的实现基于以下两种情况进行拦截:

        1)对URL请求的拦截,这种URL广告一般是网页中div元素嵌入了一个iframe/image元素,然后加载一个广告链接或者GIF图片。如CSDN博客网站:http://blog.csdn.net/cteng/article/details/42681299


        右下角的一个小广告,其dom代码:

 http://f12.baidu.com/it/u=1775265002,2744098895&fm=76id="img_10" class="figure"style="opacity: 1;">,这是百度广告联盟的广告。

         AdBlock对于页面内容的广告过滤是特定于网站的(事先写好过滤的filter,即过滤规则),对domain字符串的进行精确匹配。其作者用JavaScript把这些URL匹配规则映射为了正则表达式,然后再用正则表达式对目标URL进行匹配过滤。这类似于哈希表一样,在匹配的时候,按照相同的方法将URL,分成一些keyword,然后通过keyword去找对应的filter,最后再匹配找到的filter。这样就不需要遍历规则表,大大地提高了匹配时间。

         2)对于页面DOM嵌入广告内容的处理,这种一般是通过CSS3 Selector定位到这些DOM元素,然后设置其display等于none !important。思考:对于简单的DOM元素处理,有个问题是会出现ajax加载延迟,如果通过setTimeOut等几秒后才注入执行Js脚本,可能有些内容尚未加载出来,清除不彻底,但是如果使用setInterval隔一段事件持续注入Js脚本的话又会影响性能。最好是在浏览器内核里做一个DOM Mutation事件监控的daemon:如果检测到有新的DOM节点加入,当然必须是在DOM Content Loaded之后,就发送一个通知给客户端,客户端再调度广告屏蔽脚本的重新执行。这样在彻底清除广告的同时,又降低对性能的影响。

       此外除了ADBlock自身过滤广告的方式,网上还有以下几个有趣的方案:

       1)引入协作式过滤:当用户标明网页中的某个元素属于广告,那么,浏览器内核可以智能地定位到这个DOM元素,并生成一个有效的CSS Selector,这样就可以动态地扩展用户的本地过滤规则库,然后再通过上传到云端服务器形成大数据,从中挖掘出公共的广告拦截规则库。

       2)加cookies,对于有些广告,比如网站的app推广,第一次进入网站时会弹出来,然后叉掉后加入cookie,第二次访问就不会出现了。对于这种广告可以通过浏览器主动添加到cookie的方式,这样用户第一次访问也不会跳出广告。

      3)模拟点击,对于有些可以叉掉的广告,而又没有cookie,每次访问都会出现,可以写脚本让浏览器帮你进行网页模拟点击,直接帮点击那个叉,但碰到网速不好,特别是移动端很可能出现广告出现一下就消失的效果,用户体验可能不是很好。

2.ADBlock过滤规则

         从官方的easylistchina.txt规则表中(https://easylist-downloads.adblockplus.org/easylistchina.txt),总结了几种常用规则:1)基本过滤规则,要拦截的url地址,如:http://example.com。 

        2)定义例外规则,可以使用@@表示后面的是例外,不会拦截;也可以配合|使用。如:@@|http://example.com。

        3)匹配网址开头和结尾,使用管线符号|表示最前端或者最末端。如:阻挡以swf结尾,swf|;阻挡以http开头的,|http。||开头可以匹配http://、https://和http://www.等协议的开头。

        4)标记分隔符,通常需要接受过规则的任何分隔符,分隔符可以除了字母、数字或_-.%之外的任意字符。

        5)注释,使用!作为注释的开始,也可以在注释的上面书写任何想些的文案。

        6)限定的特定域名,如果在域名之前有“~”,该过滤规则不适用于这个域名的页面(需要AdBlock Plus 1.1或更高版本)。例如,~example.com##*.sponsor将适用于除了“example.com”之外的域名。

        7)标记分隔符,通常您需要接受过滤规则的任何分隔符。例如,您可能写这样一个规则阻挡http://example.com/和http://example.com:8000/但不能阻挡http://example.com.ar/。在这里,符号(^)用作一个分隔符。分隔符可以是除了字母、数字或者_ – . %之外的任何字符。这个地址的结尾也是作为一个分隔符,下面的例子中所有的分隔符以红色标记出:http:// example.com : 8000 / foo.bar ? a = 12 & b = %D1%82%D0%B5%D1%81%D1%82。所以这个地址可以通过这些过滤规则过滤^example.com^或^%D1%82%D0%B5%D1%81%D1%82^或^foo.bar^。

       8)CSS元素,使用##开头,classname用.,id用#。

       更具体的可以参考官网:https://adblockplus.org/zh_CN/filters

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
  • 序言:七十年代末,一起剥皮案震惊了整个滨河市,随后出现的几起案子,更是在滨河造成了极大的恐慌,老刑警刘岩,带你破解...
    沈念sama阅读 204,445评论 6 478
  • 序言:滨河连续发生了三起死亡事件,死亡现场离奇诡异,居然都是意外死亡,警方通过查阅死者的电脑和手机,发现死者居然都...
    沈念sama阅读 85,889评论 2 381
  • 文/潘晓璐 我一进店门,熙熙楼的掌柜王于贵愁眉苦脸地迎上来,“玉大人,你说我怎么就摊上这事。” “怎么了?”我有些...
    开封第一讲书人阅读 151,047评论 0 337
  • 文/不坏的土叔 我叫张陵,是天一观的道长。 经常有香客问我,道长,这世上最难降的妖魔是什么? 我笑而不...
    开封第一讲书人阅读 54,760评论 1 276
  • 正文 为了忘掉前任,我火速办了婚礼,结果婚礼上,老公的妹妹穿的比我还像新娘。我一直安慰自己,他们只是感情好,可当我...
    茶点故事阅读 63,745评论 5 367
  • 文/花漫 我一把揭开白布。 她就那样静静地躺着,像睡着了一般。 火红的嫁衣衬着肌肤如雪。 梳的纹丝不乱的头发上,一...
    开封第一讲书人阅读 48,638评论 1 281
  • 那天,我揣着相机与录音,去河边找鬼。 笑死,一个胖子当着我的面吹牛,可吹牛的内容都是我干的。 我是一名探鬼主播,决...
    沈念sama阅读 38,011评论 3 398
  • 文/苍兰香墨 我猛地睁开眼,长吁一口气:“原来是场噩梦啊……” “哼!你这毒妇竟也来了?” 一声冷哼从身侧响起,我...
    开封第一讲书人阅读 36,669评论 0 258
  • 序言:老挝万荣一对情侣失踪,失踪者是张志新(化名)和其女友刘颖,没想到半个月后,有当地人在树林里发现了一具尸体,经...
    沈念sama阅读 40,923评论 1 299
  • 正文 独居荒郊野岭守林人离奇死亡,尸身上长有42处带血的脓包…… 初始之章·张勋 以下内容为张勋视角 年9月15日...
    茶点故事阅读 35,655评论 2 321
  • 正文 我和宋清朗相恋三年,在试婚纱的时候发现自己被绿了。 大学时的朋友给我发了我未婚夫和他白月光在一起吃饭的照片。...
    茶点故事阅读 37,740评论 1 330
  • 序言:一个原本活蹦乱跳的男人离奇死亡,死状恐怖,灵堂内的尸体忽然破棺而出,到底是诈尸还是另有隐情,我是刑警宁泽,带...
    沈念sama阅读 33,406评论 4 320
  • 正文 年R本政府宣布,位于F岛的核电站,受9级特大地震影响,放射性物质发生泄漏。R本人自食恶果不足惜,却给世界环境...
    茶点故事阅读 38,995评论 3 307
  • 文/蒙蒙 一、第九天 我趴在偏房一处隐蔽的房顶上张望。 院中可真热闹,春花似锦、人声如沸。这庄子的主人今日做“春日...
    开封第一讲书人阅读 29,961评论 0 19
  • 文/苍兰香墨 我抬头看了看天上的太阳。三九已至,却和暖如春,着一层夹袄步出监牢的瞬间,已是汗流浃背。 一阵脚步声响...
    开封第一讲书人阅读 31,197评论 1 260
  • 我被黑心中介骗来泰国打工, 没想到刚下飞机就差点儿被人妖公主榨干…… 1. 我叫王不留,地道东北人。 一个月前我还...
    沈念sama阅读 45,023评论 2 350
  • 正文 我出身青楼,却偏偏与公主长得像,于是被迫代替她去往敌国和亲。 传闻我的和亲对象是个残疾皇子,可洞房花烛夜当晚...
    茶点故事阅读 42,483评论 2 342

推荐阅读更多精彩内容

  • 摘自Adblock Plus 撰写 Adblock Plus 过滤规则AdBlock Plus 过滤规则介绍基本过...
    palmlove阅读 9,732评论 0 5
  • Spring Cloud为开发人员提供了快速构建分布式系统中一些常见模式的工具(例如配置管理,服务发现,断路器,智...
    卡卡罗2017阅读 134,594评论 18 139
  • Android 自定义View的各种姿势1 Activity的显示之ViewRootImpl详解 Activity...
    passiontim阅读 171,431评论 25 707
  • 这一次葛吉夫工作坊,在开课之前我和格格说,很累。没有休息的时间。 格格说这一次课程期间让我完全做学员,不管会务工作...
    尚灵心阅读 243评论 1 2
  • 1 减少过渡绘制 1.1 怎么查看是否存在过度绘制? 我们可以通过手机设置里面的开发者选项,打开Show GPU ...
    zsj1225阅读 775评论 0 1