jQuery转发插件小记

最新推荐文章于 2022-03-29 17:08:08 发布

EricJeffrey

最新推荐文章于 2022-03-29 17:08:08 发布

阅读量284

点赞数

分类专栏： JavaScript

本文链接：https://blog.csdn.net/q15037911903/article/details/103690425

版权

JavaScript 专栏收录该内容

3 篇文章 0 订阅

订阅专栏

动机: 国内外许多网站都会使用谷歌CDN的jQuery: https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js，不翻墙的话访问不到。之前在360极速浏览器的商店里面看到了个CDN转发器，能够将jQuery重定向到百度的jQuery库里面，但是已经不能在新版的chrome上运行了，因此参考chrome扩展的API仿照做了个。

扩展文件结构:

manifest.json - 清单文件，包括权限，图标等信息

{
    "name": "jQuery转发",
    "version": "1.0",
    "description": "将从谷歌cdn获取的jQuery更改为从百度cdn获取",
    "permissions": [
        "declarativeContent",
        "activeTab",
        "webRequest",
        "http://*/*",
        "https://*/*",
        "webRequestBlocking"
    ],
    "background": {
        "scripts": [
            "background.js"
        ],
        "persistent": true
    },
    "page_action":{
        "default_popup": "popup.html"
    },
    "icons":{
        "128":"icon_128.png"
    },
    "manifest_version": 2
}

background.js - 注册事件处理程序文件，如网页发起请求的onBeforeRequest事件

chrome.webRequest.onBeforeRequest.addListener(
    function (details) {
        var url = details.url;
        if (url.indexOf("//ajax.googleapis.com/ajax/libs/jquery/") > -1) {
            console.log('change cdn');
            var urls = url.split('/');
            if (urls[urls.length - 2].length <= 3) {
                urls[urls.length - 2] += '.0';
            }
            var newUrl = urls[0] + '//cdn.bootcss.com/jquery/' + urls  [urls.length - 2] + '/jquery.min.js';
            console.log(newUrl);
            return { redirectUrl: newUrl };
        }
        return { cancel: false };
    },
    {
        urls: ["<all_urls>"],
        types: ["script"]
    },
    ["blocking"]
);