Support | 微信 & TG: @scomper

Surge 网页广告拦截案例分析

2016.10.18 10:07

遇到几个网友反应使用 Surge 广告拦截配置后出现异常情况,表现为网页打开的时间变长,或者网页看上去打开了但是加载的进度条一直在持续。对比分析发现出现这种情况大多是在 iOS 的 Safari 里,同样的配置在 Mac 里观察没有那么明显。

启用 Web 检查器

在 iPhone 上不太好观察网页打开后的后台加载情况,所以还需要一些简单的准备工作,以便能在 Mac 上观察 iPhone 的 Safari 网页加载情况。

  • 首先,需要打开 iPhone 上 Safari 的 Web 检查器,设置-Safari-高级-Web 检查器);
  • Web 检查器开启后,在 iPhone 的 Safari 中打开一个需要分析的页面;
  • Mac 上打开 Safari,并通过「开发」菜单项,打开已经连接的 iPhone 的「网页检查器」窗口。

分析元素加载时长

刷新网页就能直观的观察到网页内容的加载情况,打开时间变长,肯定是某些网页元素加载占用了大量的时间导致的,所以重点查看被拦截同时右侧有「菊花」旋转图标的元素。

以图示为例,这里判断的是 feng.com 的一个网页加载的情况,因为在 Surge 规则中包含:DOMAIN-SUFFIX,yes1.feng.com,REJECT,所以网页检查器中能看到 yes1.feng.com 的请求都被拦截下来(红色显示),而且不止一条记录。进一步观察能发现 submit.js 这个脚本的请求旁有一个转动的加载图标,这意味着很可能是因为这个被拦截的脚本一直在重试的缘故导致的网页加载缓慢。

Surge 的配置文件中 Rule 部分的拦截只基于域名的,被拦截(REJECT)后会返回 503 HTTP 状态码,告诉访问的客户端服务器当前无法处理请求,正常情况下 收到 503 也就应该放弃了,不过技术实现中总有例外,feng.com 就是个特殊的例子,发起请求的网页在收到 503 后依旧重试,执拗的直到超时才结束。这导致前端看上去网页一直在处于加载状态,或者前期是空白等很久页面突然都显示出来。

URL Rewrite 链接重定向

有没有办法来处理这种情况呢,Safari 里安装 JS Blocker 这样的扩展可以做到(直接拦截加载广告的 js),Surge 里利用 URL Rewrite 也能做到,不过毕竟不止专门处理广告拦截的,所以只能写具体的网页请求页面。

[URL Rewrite]
^http://www.google.cn http://www.google.com.hk header
^http://mp.weixin.qq.com/mp/report _ reject

^http://yes1.feng.com _ reject
^http://bbsanalytics.weiphone.net _ reject

URL Rewrite 里也可以 reject 某个链接的请求,而且处理方式上和 Rule 中的 reject 不一样,针对这里的示例而言,加上 ^http://yes1.feng.com _ reject 这么一句,网页不会再反复重试被 Rewrite 的链接对象,从而快速完成了网页的加载。


修改好配置再刷新网页试试,在 Web 检查器里能直观的看到网页的加载完成的时间缩短了,问题解决。

掌握了 Web 检查器的使用方法,以后遇到 Safari for iOS 的网页加载问题都可以采用类似方式进行分析。另外,Surge 不是拦截广告的专门应用,所以没有办法拦截网页元素层面的广告,只能从域名请求和具体的链接层面做一些处理。

Comments
Write a Comment