在我的chrome扩展程序中，我有多个文件将脚本注入网站，我想知道如何为某个网站注入1个文件。为了更好地解释
我的Chrome扩展程序有1个文件要注入Github，另一个文件要注入不同的网站我如何将每个文件注入自己的网站没有将两个文件注入每个文件网站。所以每个文件都会被注入到自己的网站中。
答案 0 :(得分：2)
通过content_scripts中的manifest.json键或chrome.tabs.executeScript()中的条目注入JavaScript文件。
chrome.tabs.executeScript() 如果您不需要每次注入匹配的URL，那么您应该使用chrome.tabs.executeScript()。当用户点击browserAction或pageAction按钮开始与您的扩展程序进行互动时尤其如此。
鉴于chrome.tabs.executeScript()是一个直接的JavaScript API调用，我将假设您了解如何根据tab.url属性中的URL选择注入的内容。
注入 stackContent.js 可能如下所示：
chrome.tabs.executeScript(tabId,{
file: "stackContent.js"
}, result => {
handleExecuteScriptAndInsertCSSErrors(tabId);
});
注入 jquery.js 和 stackContent.js 可能如下所示：
chrome.tabs.executeScript(tabId,{
file: "jquery.js"
}, result1 => {
handleExecuteScriptAndInsertCSSErrors(tabId);
chrome.tabs.executeScript(tabId,{
file: "stackContent.js"
}, result2 => {
handleExecuteScriptAndInsertCSSErrors(tabId);
});
});
您还应该检查chrome.runtime.lastError报告的错误。我在Chrome和Firefox WebExtensions中使用的功能是：
function handleExecuteScriptAndInsertCSSErrors(tabId) {
if(chrome.runtime.lastError) {
let message = chrome.runtime.lastError.message;
let isFirefox = !!window.InstallTrigger;
let extraMessage = tabId ? 'in tab ' + tabId + '.' : 'on this page.';
if((!isFirefox && message.indexOf('Cannot access a chrome:') > -1) //Chrome
|| (isFirefox && message.indexOf('No window matching') > -1) //Firefox
) {
//The current tab is one into which we are not allowed to inject scripts.
// This is most likely because we are injecting based on a action button
// click. You should disable the action button when a tab is active on
// which you can not perform the task that is expected by the user.
let messageText= 'This extension, ' + chrome.runtime.id
+ ', does not work ' + extraMessage;
//alert(messageText); //Use for testing
console.log(messageText);
} else {
//Report the error
if(isFirefox) {
//In Firefox, runtime.lastError is an Error Object including a stack trace.
console.error(chrome.runtime.lastError);
} else {
console.error(message);
}
}
}
}
content_scripts键
在 manifest.json 中，您有一个content_scripts密钥，用于描述始终注入匹配网址的脚本或CSS。如果您需要一个脚本，或者CSS要始终注入匹配的网址，您应该使用此功能。
虽然总是注入脚本可能会更方便，但除非需要，否则应该认真考虑不这样做。如果您要加载大型脚本和/或在大量网站（例如所有URL）上，您应该特别远离这样做。不加选择地在大量网站上注入您的脚本（包括库）会占用用户计算机上的大量资源，从而导致性能下降，影响用户体验。如果您需要从网站内部开始进行交互，请尝试加载等待该交互开始的较小脚本，然后向后台脚本发送消息以注入其余功能。有时您确实需要一直加载脚本，但尝试从用户的角度考虑它，而不仅仅是编写扩展程序的方便之处。作为使用content_scripts过度注入脚本的示例，this question was asked将78个不同脚本注入每个 https://页面的扩展名。
content_scripts键包含一组对象。每个对象描述一个注射指令。该对象可以包含多个条件和多个文件，但每个文件都是全有或全无;要么注入该对象中描述的所有文件，要么不注入，具体取决于URL是否匹配。如果您希望将某些文件注入某些URL并将其他文件注入其他URL，则可以使用单独的对象来描述每个组。
一个例子，它注入 jquery.js ＆amp; stackContent.js 到Stack Exchange站点和 jquery.js ＆amp; exampleContent.js 到example.com的内容是：
"content_scripts": [
{
"matches": [
"http*://*.askubuntu.com/*",
"http*://*.mathoverflow.net/*",
"http*://*.serverfault.com/*",
"http*://*.stackapps.com/*",
"http*://*.stackexchange.com/*",
"http*://*.stackoverflow.com/*",
"http*://*.superuser.com/*"
],
"js": ["jquery.js", "stackContent.js"]
},
{
"matches": ["http*://*.example.com/*"],
"js": ["jquery.js", "exampleContent.js"]
}
]
根据您的操作，您需要具有与您感兴趣的匹配网址互动的权限和/或使用chrome.tabs。从以上例子中可以看出：
"permissions": [
"tabs",
"http*://*.askubuntu.com/*",
"http*://*.mathoverflow.net/*",
"http*://*.serverfault.com/*",
"http*://*.stackapps.com/*",
"http*://*.stackexchange.com/*",
"http*://*.stackoverflow.com/*",
"http*://*.superuser.com/*",
"http*://*.example.com/*"
]
答案 1 :(得分：0)
使用Tampermonkey / Greasemonkey扩展，标题如下：
// ==UserScript==
// @name MTV Statistical Data For Tampermonkey & Greasemonkey
// @namespace MTV_statistical_data
// @include /^https?://(www\.)?mytrafficvalue\.com/shareholders\.html(\#marketplace)?$/
// @author facebook.com/igor39
// @version 7.5
// @grant none
// @description Improving the user experience & provide more of statistics on the page www.mytrafficvalue.com/shareholders.html
// ==/UserScript==