使用 chrome.webRequest api 时 url 不会阻塞

Question

我在 chrome.storage.sync 中存储了一些网址，如下所示......

sitesToBeBlocked: {
   "https://www.google.com/":"https://www.google.com/" ,
   "https://www.example.com/": "https://www.example.com/"
}

现在我正尝试使用下面的代码阻止这些网址......

Manifest.json

{
  "name": "chrome extension",
  "description": ".............",
  "version": "0.0.1",
  "manifest_version": 2,

  "background": {
    "scripts": ["/scripts/background/background.js"]
  },

  "content_scripts": [
    {
      "matches": ["https://*/*","http://*/*"] ,
      "js": ["/scripts/content/jquery-3.6.0.js","/scripts/content/content-script.js"]
    }
  ],

  "permissions": ["storage","unlimitedStorage","webRequest","webRequestBlocking","*://*/*"],

  "browser_action": {
    "default_popup": "/popup/popup.html",
    "default_icon": {
      ............
    }
  },

  "options_ui": {
      "page": "/options/options.html",
      "open_in_tab": true
  },
  
 }

background.js

function isRequestCancelled(sitesArray, url){
    return sitesArray.includes(url);
}

function blockListener (details) {
    chrome.storage.sync.get(null, (items)=>{
        var sitesArray = Object.keys(items['sitesToBeBlocked']);
        
        return { cancel: isRequestCancelled(sitesArray, details.url ) };
    });  
}
chrome.webRequest.onBeforeRequest.addListener( blockListener ,{ urls: ["<all_urls>"], types: [ 'main_frame' ] }, ['blocking'] );

但是网址没有被屏蔽，不知道怎么回事... 请帮我弄清楚我面临的确切问题......

Answer 1

我自己发现了我代码中的问题..

其实这里的问题是chrome.storage.sync的回调函数是异步的。由于 chrome.webRequest 的回调在 chrome.storage.sync 的回调 return.

之前终止

解决方法可以，

将所有内容放入 chrome.storage.sync 的回调中，这样每个函数都会 return 在 chrome.storage.sync 的回调执行后。

最后我用下面修改的代码解决了这个问题....

chrome.storage.sync.get(null,(items)=>{

  function isRequestCancelled(sitesArray, url){
    return sitesArray.includes(url);
  }

  function blockListener (details) {
     var sitesArray = Object.keys(items['sitesToBeBlocked']);
     return { cancel: isRequestCancelled(sitesArray, details.url ) };
  }
  chrome.webRequest.onBeforeRequest.addListener( blockListener ,{ urls: [" 
  <all_urls>"], types: [ 'main_frame' ] }, ['blocking'] ); 

});

实际线索来自

使用 chrome.webRequest api 时 url 不会阻塞

urls are not blocking while working with chrome.webRequest api

javascript

chrome-webrequest