chrome extension “manifest_version”: 3 , 使用 chrome.declarativeNetRequest.updateDynamicRules(roles,function(){}); 來阻止瀏覽器下載特定網址

希望可以擋掉這個 url: https://test.sg/js/ads.js?v=20241127200620, 在 rule.condition.urlFilter = “*test.sg/js/ads.* 但是實際瀏覽網頁, 檔案還是被瀏覽器下載

您好，針對您在使用 Chrome 擴充功能 chrome.declarativeNetRequest.updateDynamicRules 嘗試阻擋特定網址 https://test.sg/js/ads.js?v=20241127200620 時遇到的問題，以下是一些可能的解決方案和注意事項：

1. 精確匹配 URL：

• 您的 rule.condition.urlFilter = "*test.sg/js/ads.*" 可能過於寬鬆。由於 URL 中包含查詢參數 ?v=20241127200620，因此僅使用 *test.sg/js/ads.* 可能無法完全匹配。
• 嘗試使用更精確的匹配模式，例如：
  • rule.condition.urlFilter = "test.sg/js/ads.js?v=20241127200620" (完全匹配)
  • rule.condition.urlFilter = "test.sg/js/ads.js" (匹配不帶查詢參數的版本)
  • rule.condition.urlFilter = "test.sg/js/ads*" (匹配任何以ads開頭的資源)
• 如果查詢參數的值會變動，您可以使用更複雜的匹配模式，例如正規表達式。

2. 使用正規表達式：

• declarativeNetRequest 支援使用正規表達式進行更靈活的 URL 匹配。
• 您可以嘗試使用以下正規表達式：
  • rule.condition.regexFilter = "test\\.sg\\/js\\/ads\\.js\\?v=.*"
  • 請注意，在正規表達式中，特殊字元（如 . 和 ?）需要進行轉義。

3. 檢查規則的優先順序：

• 如果您的擴充功能中有多個 declarativeNetRequest 規則，請確保您的阻擋規則具有足夠高的優先順序。
• rule.priority 屬性用於設定規則的優先順序，數值越小，優先順序越高。

4. 檢查規則的動作類型：

• 確保您的規則的 rule.action.type 屬性設定為 "block"，以阻止請求。

5. 檢查擴充功能的權限：

• 確保您的擴充功能在 manifest.json 檔案中具有足夠的權限。
• 您需要 declarativeNetRequest 和 declarativeNetRequestWithHostAccess 權限，以及對目標網域的 host permissions。
• 範例: JSON"permissions": [ "declarativeNetRequest", "declarativeNetRequestWithHostAccess" ], "host_permissions": [ "*://*.test.sg/*" ]

6. 檢查 Chrome 版本：

• declarativeNetRequest API 在 Chrome 84 及更高版本中可用。
• 確保您的 Chrome 瀏覽器版本足夠新。

7. 偵錯方法：

• 使用 Chrome 的開發人員工具（DevTools）的 “Network” 標籤來檢查網路請求，確認 ads.js 檔案是否被下載，以及請求的詳細資訊。
• 您可以使用 chrome.declarativeNetRequest.getDynamicRules 來檢查您的擴充功能是否成功新增了規則。
• 您可以使用chrome://net-export/來紀錄網路事件，以方便除錯。

範例程式碼：

JavaScript

chrome.declarativeNetRequest.updateDynamicRules({
  removeRuleIds: [1], // 移除現有規則（如果存在）
  addRules: [{
    "id": 1,
    "priority": 1,
    "action": { "type": "block" },
    "condition": {
      "urlFilter": "test.sg/js/ads.js?v=20241127200620",
      "resourceTypes": ["script"] // 只阻擋腳本
    }
  }]
}, function() {
  console.log("規則已更新");
});

請根據您的實際情況調整程式碼，並仔細檢查您的擴充功能權限和 Chrome 版本。希望這些資訊能幫助您解決問題。

---

以上面的範例, 修改成阻止下列的url:

["*.doubleclick.net/*",
"*.ssp.hinet.net/*",
"*a.amnet.tw/*",
"*adx.c.appier.net/*",
"*cdn.cookielaw.org/*",
"*clarity.ms/*"]

好的，以下是如何修改範例程式碼，以阻擋您提供的 URL 列表：

1. 修改 manifest.json：

首先，確保您的 manifest.json 檔案中有足夠的權限：

JSON

{
  "manifest_version": 3,
  "name": "URL Blocker",
  "version": "1.0",
  "permissions": [
    "declarativeNetRequest",
    "declarativeNetRequestWithHostAccess"
  ],
  "host_permissions": [
    "*://*.doubleclick.net/*",
    "*://*.ssp.hinet.net/*",
    "*://*.amnet.tw/*",
    "*://*.adx.c.appier.net/*",
    "*://*.cdn.cookielaw.org/*",
    "*://*.clarity.ms/*"
  ],
  "background": {
    "service_worker": "background.js"
  }
}

2. 修改 background.js：

然後，修改 background.js 檔案，以新增多個規則：

JavaScript

const urlsToBlock = [
  "*.doubleclick.net/*",
  "*.ssp.hinet.net/*",
  "*a.amnet.tw/*",
  "*adx.c.appier.net/*",
  "*cdn.cookielaw.org/*",
  "*clarity.ms/*"
];

const rules = urlsToBlock.map((url, index) => ({
  "id": index + 1,
  "priority": 1,
  "action": { "type": "block" },
  "condition": {
    "urlFilter": url,
    "resourceTypes": ["main_frame", "sub_frame", "script", "image", "stylesheet", "object", "xmlhttprequest", "other"] // 阻擋所有資源類型
  }
}));

chrome.declarativeNetRequest.updateDynamicRules({
  removeRuleIds: rules.map(rule => rule.id), // 移除現有規則
  addRules: rules
}, function() {
  console.log("規則已更新");
});

程式碼說明：

• urlsToBlock 陣列： 包含了您要阻擋的 URL 列表。
• rules 陣列： 使用 map 函式將 URL 列表轉換為 declarativeNetRequest 規則陣列。
  • 每個規則都有一個唯一的 id（從 1 開始）。
  • priority 設定為 1，表示高優先順序。
  • action.type 設定為 "block"，表示阻擋請求。
  • condition.urlFilter 設定為要阻擋的 URL。
  • resourceTypes 設定為阻擋所有資源類型，可以依據需求進行調整。
• chrome.declarativeNetRequest.updateDynamicRules：
  • removeRuleIds 移除所有現有規則。
  • addRules 新增 rules 陣列中的規則。

注意事項：

• 請確保您的 Chrome 瀏覽器版本支援 declarativeNetRequest API。
• 擴充功能權限非常重要，請仔細檢查 manifest.json 中的 permissions 和 host_permissions。
• 您可以使用 Chrome 開發人員工具的 “Network” 標籤來驗證 URL 是否被成功阻擋。
• resourceTypes可以依據需求調整，例如只阻擋script檔案，可以將resourceTypes設定為[“script”].

希望這些資訊對您有幫助。