爲Chrome擴展插入內容腳本不起作用

Question

我已經研究過這個話題，但沒有點擊。我正在嘗試製作一個簡單的Chrome擴展程序。細節並不重要，但基本上當用戶點擊某個網站上的某個按鈕時，頁面會重定向到不同的URL。我已經輸入了虛擬URL，僅用於說明。這裏是我的代碼：

的manifest.json

{ 
    "manifest_version": 2, 
    "name": "Blah", 
    "version": "1.0", 
    "description": "Blah blah", 
    "icons": { "16": "icon16.png", 
      "48": "icon48.png", 
      "128": "icon128.png" }, 
    "content_scripts": [ 
     { 
     "matches": ["*://url1.com/*"], 
     "js": ["contentscript.js"] 
     } 
    ], 
    "web_accessible_resources": ["script.js"] 
} 

contentscript.js（找到另一個堆棧溢出問題，它不能完全確定是如何工作的）

var s = document.createElement("script"); 
s.src = chrome.extension.getURL("script.js"); 
s.onload = function() { 
    this.remove(); 
}; 
(document.head || document.documentElement).appendChild(s); 

的script.js

document.getElementById("id1").addEventListener("click", redirect); 
function redirect() { 
    console.log("Testing!"); // This works! 
    window.location.replace("url2.org"); 
} 

當我點擊相應的按鈕時，文本被記錄到控制檯，所以我知道我在做som正確。不過，我猜測我並沒有將腳本實際注入頁面，這就是爲什麼我的頁面沒有重定向。任何幫助，將不勝感激！

Answer 1

下面是一個例子：

的script.js

// wait that page finished loading 
window.addEventListener("load", function load(event){ 
// for the current tab, inject the "inject.js" file & execute it 
    chrome.tabs.executeScript(tab.ib, { 
     file: 'inject.js' 
    }); 
},false); 

inject.js

// this is the code which will be injected into a given page... 

document.getElementById("id1").addEventListener("click", redirect); 
function redirect() { 
    console.log("Testing!"); // This works! 
    window.location.replace("url2.org"); 
} 

的manifest.json

{ 
    "name": "Inject", 
    "version": "0.0.1", 
    "manifest_version": 2, 
    "description": "Injecting stuff", 
    "content_scripts": [{ 
     "matches": ["http://example.com/*"], 
     "js": ["script.js"] 
    }], 
    "permissions": [ 
    "http://example.com/*", 
    "tabs" 
    ] 
}