javascript - Chrome 网络请求阻止不起作用

Question

我正在尝试使用 webrequest api，但在使用它来阻止网站时遇到问题。

list .json

{
  "manifest_version": 2,

  "name": "blocktwitter",
  "description": "block twitter",
  "version": "1.0",

  "permissions": [
  "https://ajax.googleapis.com/",
  "activeTab",
  "storage",
  "webRequest",
  "webRequestBlocking"
  ],

"background": {
"scripts": ["background.js"],
"persistent": true
  }
}

背景.js:

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

我复制了 Twitter 上的网址并粘贴了该网址，并从文档中复制了代码，但它仍然无法正常工作。我不确定我做错了什么。如有帮助，我们将不胜感激。

Answer 1

你有两个问题。

问题#1:无效的匹配模式

第一个问题是您传递给 chrome.webRequest.onBeforeRequest.addListener() 的 URL 不是有效的 match pattern 。匹配模式需要路径组件。如果您看过 console for your background page/script您会看到以下错误:

_generated_background_page.html:1 Unchecked runtime.lastError while running webRequestInternal.addEventListener: 'https://twitter.com' is not a valid URL pattern.

你的background.js应该是这样的:

chrome.webRequest.onBeforeRequest.addListener(
    function(details) {
        console.log('In webRequest');
        return {cancel: true};
    }, {
        urls: ["https://*.twitter.com/*"]
    }, ["blocking"]
);

问题 #2:没有 twitter.com 的主机权限

您需要拥有您要阻止的主机的权限。您必须在 permissions 中声明主机数组位于 manifest.json 。像这样的东西:

{
  "manifest_version": 2,

  "name": "blocktwitter",
  "description": "block twitter",
  "version": "1.0",

  "permissions": [
    "https://ajax.googleapis.com/*",
    "https://*.twitter.com/*",
    "activeTab",
    "storage",
    "webRequest",
    "webRequestBlocking"
  ],

  "background": {
    "scripts": ["background.js"],
    "persistent": true
  }
}