您无权使用阻止 webRequest 侦听器。请务必在清单中声明 webRequestBlocking 权限

Question

我尝试使用 React js 开发我的第一个 Chrome 扩展。当我尝试使用 chrome.webRequest API 阻止 chrome 扩展中的 URL 时，错误页面显示两个错误。

“webRequestBlocking”需要 2 或更低的清单版本。

未选中的runtime.lastError：您无权使用阻塞的webRequest侦听器。请务必在清单中声明 webRequestBlocking 权限。

我在清单文件中声明了“webRequestBlocking”权限。这是我的manifest.json

{
  "manifest_version": 3,
  "name": "Chrome Extension",
  "description": "First Extension",
  "options_page": "options.html",
  "background": {
  "service_worker": "background.bundle.js",
  "matches": [
   "<all_urls>"
  ]
},
 "action": {
 "default_title": "Open Extension",
 "default_icon": "icon-34.png"
 },
 "icons": {
 "128": "icon-128.png"
 },
 "content_scripts": [
 {
   "matches": [
    "http://*/*",
    "https://*/*",
    "<all_urls>"
   ],
   "js": [
    "contentScript.bundle.js"
   ],
   "css": [
    "content.styles.css"
   ]
  }
 ],
 "devtools_page": "devtools.html",
 "web_accessible_resources": [
 {
  "resources": [
    "content.styles.css",
    "icon-128.png",
    "icon-34.png"
   ],
   "matches": []
  }
 ],
  "permissions": [
  "activeTab",
  "tabs",
  "webRequest",
  "webRequestBlocking"
 ],
 "host_permissions": [
  "<all_urls>"
 ]
}

这是我的background.js

chrome.webRequest.onBeforeRequest.addListener(
  function(details) {
    console.log(details);
    return {cancel: true};
  },
  {urls: ["https://reactjs.org/"]},
  ["blocking"]
);

我尝试删除 webRequestBlocking 但也是一样的。谁能帮我有办法解决这个问题吗？

Answer 1

该错误自行解释'webRequestBlocking' requires manifest version of 2 or lower.，因此您无法在清单版本 3中使用webRequestBlocking。

然而，chrome 提供了一种替代方案，即使用 declarativeNetRequestWithHostAccessAPI，该 API 用于通过指定声明性规则来阻止或修改网络请求，您可以在此处查看更多详细信息。