斗鱼扩展--拦截广告,让网页加载更快(四)

代码可以在 https://pan.baidu.com/s/1uN120-18hvAzELpJCQfbXA  处下载

 

有些广告的 图片,从请求到 下载到本地后加载,让网页加载速度变慢,其实我也不怎么看广告的。那就屏蔽掉吧。

主要代码,先在  manifest.json 申请阻断网络请求的 权限,并指定后台运行的js.

"permissions": [
        "webRequest",
        "webRequestBlocking",
        "<all_urls>"
    ],
    "background": {
        "scripts": ["js/BaseJs/background.js"]
    },
}

 

 

在js/BaseJs/目录创建background.js文件,写后台代码。

阻断的代码写在 background.js内(此处以百度为例).

chrome.webRequest.onBeforeRequest.addListener(
    function(details) { return {cancel: true}; },
    {
        urls: [
            "*://*.baidu.com/*"
        ]},
    ["blocking"]
);

 

 

 

 

请求被阻断了,然后,我们只需要找出 斗鱼上要阻断 广告图片的源地址,阻断即可。

下面是我的一些 阻断 请求,background.js 的代码如下

 

 1 / https://rpic.douyucdn.cn/asrpic/*.jpg // 房间外显图片一定别阻止
 2 var blockUrls =[
 3     "https://sta-op.douyucdn.cn/nggsys/*.jpg",    // 视频框内游戏推广
 4     "https://sta-op.douyucdn.cn/nggsys/*.png",    // 视频框内游戏推广
 5     "https://shark.douyucdn.cn/app/douyu/res/page/*.gif",    //源图片出错预备图
 6     "https://cs-op.douyucdn.cn/nggsys/*.jpg",    //其它游戏推广
 7     "https://cs-op.douyucdn.cn/nggsys/*.png",    //其它游戏推广    
 8     "https://sta-op.douyucdn.cn/vod-cover/*.jpg",    //视频内的推荐图片
 9     "https://sta-op.douyucdn.cn/vod-cover/*.png",    //视频内的推荐图片
10     "http://image.wan.douyu.com/upload/*.png",    //个人说明里的游戏推广
11     "https://shark.douyucdn.cn/app/douyu/res/com/*.jpg?*",    //斗鱼公会
12     "https://shark.douyucdn.cn//app/douyu/res/page/room-normal/clientdown/*.png?*",    //客户端下载页图片
13 ];
14 var callback =function(details){
15     if (blockUrls.length<=0 || blockUrls[0] == "" || blockUrls[0] == null) {
16         return {cancel: false};
17     }
18     return {cancel: true};
19 };
20 var filter = {urls:blockUrls};
21 var opt_extraInfoSpec = ["blocking"];
22 chrome.webRequest.onBeforeRequest.addListener(callback, filter, opt_extraInfoSpec);

 

 

 

打开个 房间 看效果。

 

 

 

看来阻断了不少,红色的 即为 阻断的请求。

 

 

 

被阻断后的页面,太影响 美观了,所以要 美化下,就是移除这些不想看的元素。

转载于:https://www.cnblogs.com/likehc/p/9416300.html

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值