有天在开发一个页面,里面用到了一张图片,图片对应的是一个名字叫ads的数据服务,全称大概是analyse data service,分析型数据服务,图片名字就取了一个ads.png,一开始也觉得没啥,就这么开发了,但是测试的时候发现,这张图片死活加载不出来,控制台提示net::ERR_BLOCKED_BY_CLIENT

一开始以为是图片格式有问题,于是重新转了一下图片,发现问题依旧,单独在新TAB打开这个图片又能正常显示,所以把图片格式问题排除了。

于是就把问题放到这个报错信息上net::ERR_BLOCKED_BY_CLIENT,blocked by client,被客户端,也就是浏览器给拒绝了,难道是返回的头信息有什么问题?server端是webpack起的一个静态文件服务,看了看浏览器的请求记录,发现只有request,都没有response,看来请求都没有走出浏览器。

为了验证上述问题,我把服务停了,然后然后手动更改图片的URL链接,使得重新加载,发现任然报错了,那么就可以确定问题在浏览器端。

各种google,stackoverflow,baidu,都没有找到一个合适的解答,而且其他图片全都没问题,唯独这张图片加载不出来,尝试用命令行起chrome,然后看看控制台输出,也没看到什么有价值的log。心如死灰之际,起身去了趟厕所,尿尿过程中,想到,不如把图片上传到CDN或者一些云服务试试看。

回来立马就传到了OTS上,因为传上去之后文件名会被改变,变成了一些自动生成的信息,然后把网址拿过来,放到了页面上,居然神奇得发现图片能正常显示了,看来找对了方向,和之前的一对比,马上就发现了文件名上有一些不一样,再一看之前的文件名ads,不就是广告么,一下就想到了adblock,至此,折腾了这么久,总算是找到原因了,也找到元凶: adblock,不过这也算是adblock的一个策略吧,从文件名上入手,去搜索了一下adblock的一些别的策略,谨防再次入坑。

id2