Question

我正在编写一个扩展程序，其中包含允许用户决定他们希望扩展程序运行的网站的选项。

假设用户在选项

中有此网站

site                          action
stackoverflow.com/*           change background css to blue
google.com/*                  change background css to green

我将这些字符串存储在选项中。当content_script运行时，我应该从选项中检索这些字符串，循环遍历每个字符串，使用urlParser解析为部分，将每个部分转换为正则表达式（转义除*之外的所有内容），并将其与document.URL进行比较？我最近看到，对于Urls的这种用户选项验证也应该通过后台脚本来完成，所以我不确定要走哪条路，或者是否有更明显的方法。

我认为像Adblocker和Vimium这样的扩展程序似乎具有此功能，但用于决定运行不的网站。我想弄清楚如何决定运行到的网站。

更新问题：由于我的content_script需要在document_start（在页面加载之前，因为它处理编辑页面外观）作为content_script运行，因此后台页面能够执行在加载网页之前>之前的content_script 是什么？

Answer 1

验证网页的网址应通过后台网页进行“验证”，因为用户的选项将在后台网页的上下文中托管在本地存储中。这就是我要做的......（虽然这更像是一个答案的建议）。

我不确定列表右栏中的操作会如何影响您的问题，抱歉。

（另请注意，您需要合并一个可以将globs解析为正则表达式的库（外部或自编）。）

<强>的manifest.json

permissions: ["tabs", "storage", "webRequest", "<all_urls>"]

<强> background.js

//allow the webrequest to run on all urls
var filter = { urls: "<all_urls>" };

//receives url information from webrequest listener
function listen(details) {
    getUserOpts()
        .then(function(arrayOfWhitelistUrls) {
            //you can't use globs here, need to use more powerful filtering mechanisms
            if (arrayOfWhitelistUrls.indexOf(details.url) > -1) {
                message();
            }
        });
}

//returns a promise containing user defined whitelist urls from background local storage
function getUserOpts() {
    return new Promise(function(res, rej) {
        chrome.storage.get("whitelist", function(data) {
            //you are saving all localhost data as a string, so you need to parse it first
            res(JSON.parse(data));
        });
    });
}

//messages content script and allows execution
function message() {
    chrome.tabs.query({active: true}, function(tabs) {
        chrome.tabs.sendMessage(tabs[0].id, {permission: true});
    });
}

chrome.webRequest.onBeforeRequest.addListener(listen, filter)

<强> contentscript.js

function listen(message) {        
    if (message.permission) {
        if (message.permission === true) {
            init();
        }
    }
}

//listen for message
chrome.runtime.onMessage.addEventListener(listen);

所以事情的运行顺序如下：

1. 后台页面会侦听每个网络请求
1. 在每个Web请求上，后台页面异步从本地存储中提取用户选项
1. 如果当前标签的网址通过了您的过滤器，请向您的内容脚本发送消息
1. 内容脚本接收消息然后运行

可能有一种更简单的方法可以做到这一点;此方法的缺点是您需要在每个内容脚本中包含权限网关。

如何在Content_Script中匹配用户选项中的网址？

1 个答案: