僅在網站的子目錄中加載內容腳本

Question

如何僅在網站的子目錄中加載Chrome內容腳本。例如：

在：https://www.example.com/#!/video/*
不在：https://www.example.com/

所以我不想在主頁上，而是在視頻目錄加載。我嘗試過這樣的匹配模式，但它不起作用。

"matches": ["*://*.example.com/*", "*://*.example.com/#!/video/*"]

我的網址是這樣的：www.example.com/#!/video/random_numbers/some-random-string

PS：我也想從頁面的每Ajax請求後重新加載腳本。

Answer 1

問題是在"matches"中不支持URL片段（URL哈希），並且無法使用"content_scripts"節自動注入/自動移除基於哈希更改的腳本，因爲頁面實際上沒有重新加載。

從manifest.json中刪除整個"content_scripts"部分，並使用webNavigation API僅在需要時注入/激活內容腳本（需要"permissions: ["webNavigation"]）。

• background.js：

  chrome.webNavigation.onCommitted.addListener(function(details) { 
      injectOrActivate("onCommitted", details); 
  }); 
  chrome.webNavigation.onHistoryStateUpdated.addListener(function(details) { 
      injectOrActivate("onHashChange", details); 
  }); 
  
  function injectOrActivate(event, details) { 
      var tabId = details.tabId; 
  
      if (details.url.indexOf("#") < 0) { 
       deactivateContentScript(tabId); 
       return; 
      } 
  
      chrome.tabs.executeScript(tabId, {code: "injectedStatus"}, function(res) { 
       if (res[0] != "injected") { 
        chrome.tabs.executeScript(tabId, {file: "content.js"}, function(res) { 
         activateContentScript(tabId); 
        }); 
       } else { 
        activateContentScript(tabId); 
       } 
      } 
  } 
  
  function activateContentScript(tabId) { 
      chrome.tabs.sendMessage(tabId, {action: "activate"}); 
  } 
  
  function deactivateContentScript(tabId) { 
      chrome.tabs.sendMessage(tabId, {action: "deactivate"}); 
  } 
  

• content.js：

  var injectedStatus = "injected"; 
  chrome.runtime.onMessage.addListener(function(msg, sender, sendResponse) { 
      switch (msg.action) { 
       case "activate": 
        doSomething(); 
        break; 
       case "deactivate": 
        stopDoingSomething(); 
        break; 
      } 
  });