6

I try to develop my first chrome extension with react js. when I try to blocking a URL in the chrome extension using chrome.webRequest API In error page shows two errors.

'webRequestBlocking' requires manifest version of 2 or lower.

Unchecked runtime.lastError: You do not have permission to use blocking webRequest listeners. Be sure to declare the webRequestBlocking permission in your manifest.

and I'm declaring the "webRequestBlocking" permission in the manifest file. here is my 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>"
 ]
}

here is my background.js

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

and I have tried removing webRequestBlocking but also the same. can anyone help me is there a way to fix this?

Tharuka Dananjaya
  • 208
  • 3
  • 10
  • we can't use manifest v2. google chrome extension development documentation informed this. "As of January 17, 2022 Chrome Web Store has stopped accepting new Manifest V2 extensions. We strongly recommend that new extensions target Manifest V3." – Tharuka Dananjaya Sep 07 '22 at 05:14
  • 1
    Use declarativeNetRequest instead. – wOxxOm Sep 07 '22 at 05:26

2 Answers2

6

The error explains it self 'webRequestBlocking' requires manifest version of 2 or lower. so you can't use webRequestBlocking in manifest version 3 .

however chrome is giving an alternative by using declarativeNetRequestWithHostAccess API which is used to block or modify network requests by specifying declarative rules you can check here for more details .

monim
  • 3,641
  • 2
  • 10
  • 25
-1

You can change manifest_version to 2 and webRequestBlocking to permissions.

Adriaan
  • 17,741
  • 7
  • 42
  • 75
Saiful
  • 7
  • 1
  • 1
    but in google chrome extension development documentation informed this. "As of January 17, 2022 Chrome Web Store has stopped accepting new Manifest V2 extensions. We strongly recommend that new extensions target Manifest V3." – Tharuka Dananjaya Sep 07 '22 at 05:13
  • 1
    but webRequestBlocking is not working in v3. – Saiful Sep 07 '22 at 05:21
  • 1
    [Update the Manifest V3 migration guide](https://stackoverflow.com/questions/15532791/getting-around-x-frame-options-deny-in-a-chrome-extension/69177790#69177790) it may help to convert instead – Saiful Sep 07 '22 at 05:24