如何在Google Chrome扩展程序中重定向某些网页?

时间:2014-07-31 13:03:55

标签: javascript google-chrome google-chrome-extension

我在后台脚本中使用chrome.webRequest.onBeforeRequest来收听用户正在发出的所有请求。我的扩展现在只是一个清单和这个bg脚本。

然后检查网址是否与正则表达式匹配:

chrome.webRequest.onBeforeRequest.addListener(
     checkRedirect, {urls: ["<all_urls>"]}, ["blocking"]
);

function checkRedirect(details) {   
    var location = getLocation(details.url);

    if(/some_regex/.test(details.url)) {
        var redirect_url = 'http://some_redirect.com' + location.pathname;
        chrome.tabs.update({url: redirect_url});
    }

    return {cancel: false}; 
}

function getLocation(href) {
    var l = document.createElement('a');
    l.href = href;
    return l;
};

因此,如果用户进入某个页面或点击该页面的链接,我想重定向他。 上面的代码工作得很好; 问题是指页面请求时,例如CSS然后那些CSS最终会出现在用户屏幕上。


所以我想要的只是过滤页面/点击请求..怎么做?

1 个答案:

答案 0 :(得分:4)

types设置为['main_frame'],将事件通知限制在顶级框架中(如果您还要包含框架,请使用['main_frame', 'sub_frame']。)

虽然之前的建议会解决您的问题,但我建议您更进一步,摆脱chrome.tabs.update。使用redirectUrl替换之前的请求,并重定向到所需的网址。

如果您的网址格式匹配方法非常简单,可以表达为match pattern,请将过滤器合并到webRequest API过滤器的"urls"键中。这会降低您的扩展程序对浏览器性能的影响。

chrome.webRequest.onBeforeRequest.addListener(function(details) {
    var location = getLocation(details.url); // getLocation defined in question
    var redirect_url = 'http://some_redirect.com' + location.pathname;
    return { redirectUrl: redirect_url };
}, {
    types: ['main_frame', 'sub_frame'],
    urls: ['*://*/*some_pattern*']
}, ['blocking']);

注意:如果您不准备处理非http请求,请不要使用<all_urls>