javascript - chrome.webRequest redirectUrl with URL Saved in chrome.storage.local

Question

我正在尝试拦截 Web 请求并将它们重定向到我保存在本地存储中的 URL，但它不起作用。我的代码如下:

chrome.webRequest.onBeforeRequest.addListener(
    function (details) {
        if (details.url === 'http://myapp.com/theurl') {
            chrome.storage.local.get("http://myapp.com/theurl", function (result) {
                return { redirectUrl: result.savedUrl }; //savedUrl property is the modified Url
            });
        }
    }, { urls: ["<all_urls>"] }, ["blocking"]);

对返回语句/url 进行硬编码:

chrome.webRequest.onBeforeRequest.addListener(
    function (details) {
        if (details.url === 'http://myapp.com/theurl') {
                return { returnUrl : 'http://myapp.com/modifiedurl' };
            });
        }
    }, { urls: ["<all_urls>"] }, ["blocking"]);

Answer 1

chrome.storage api 是 asynchronous ，因此您在此处采用的方法将行不通。您所拥有的代码所发生的事情的基本运行是:

1. 在 webrequest 之前，检查 url 是否为 http://myapp.com/theurl
2. 如果是，则异步调用 chrome.storage.local.get
3. chrome.storage.local.get 调用中的代码(即 return 语句)不会立即执行，将在稍后运行
4. 您的其余代码继续运行，您的 webRequest 监听器没有返回任何内容

您可以通过多种方式完成这项工作。最简单的方法是在加载扩展时将本地存储的值存储在某个变量中(将其称为 storage_cache)。然后从 webRequest 监听器你可以说 return { redirectUrl: storage_cache.savedUrl };

如果您的存储会频繁更改，那么有比这更好的方法...但是无论您选择哪种实现方式，要记住的关键是不要混淆同步和异步事件。