Javascript tabs.executeScript - 传递参数和使用库？
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/4976996/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
tabs.executeScript - passing parameters and using libraries?
提问by Gadi A
I am writing a Chrome extension that needs to modify pages in a specific domain according to some given parameter, which needs XSS in order to be obtained, so simply using a content script seems impossible. So, I've decided to inject the script using tabs.executeScript.
我正在编写一个 Chrome 扩展，它需要根据一些给定的参数修改特定域中的页面，这需要 XSS 才能获得，所以简单地使用内容脚本似乎是不可能的。所以，我决定使用 tabs.executeScript 注入脚本。
Now I need to know two things: First, how can I pass parameters to the script when using executeScript? I guess I can use messages, but isn't there a more direct way to pass the parameter while injecting the script?
现在我需要知道两件事：第一，在使用executeScript时如何将参数传递给脚本？我想我可以使用消息，但是在注入脚本时没有更直接的方法来传递参数吗？
Second, my script uses jQuery, so I need to include jQuery somehow. It's silly, but I'm not sure how to do it. So far, I embedded jQuery in the HTML page I was writing (for example background.html).
其次，我的脚本使用 jQuery，所以我需要以某种方式包含 jQuery。这很愚蠢，但我不知道该怎么做。到目前为止，我在我正在编写的 HTML 页面中嵌入了 jQuery（例如 background.html）。
回答by serg
If you don't want to use messaging then:
如果您不想使用消息传递，则：
chrome.tabs.executeScript(tabId, {file: "jquery.js"}, function(){
chrome.tabs.executeScript(tabId, {code: "var scriptOptions = {param1:'value1',param2:'value2'};"}, function(){
chrome.tabs.executeScript(tabId, {file: "script.js"}, function(){
//all injected
});
});
});
(jquery.jsshould be placed into extension folder). Script options will be available inside scriptOptionsvariable in the script.js.
（jquery.js应该放在扩展文件夹中）。脚本选项将scriptOptions在script.js.
With messaging it is just as easy:
使用消息传递同样简单：
chrome.tabs.executeScript(tabId, {file: "jquery.js"}, function(){
chrome.tabs.executeScript(tabId, {file: "script.js"}, function(){
chrome.tabs.sendMessage(tabId, {scriptOptions: {param1:'value1',param2:'value2'}}, function(){
//all injected
});
});
});
You would need to add a request listener to script.js:
您需要将请求侦听器添加到script.js：
chrome.runtime.onMessage.addListener(function(message, sender, sendResponse) {
var scriptOptions = message.scriptOptions;
console.log('param1', scriptOptions.param1);
console.log('param2', scriptOptions.param2);
doSomething(scriptOptions.param1, scriptOptions.param2);
});
回答by UltimatePeter
Building off the direct method above, I was able to inject code into a new tab directly from the background script on my Chrome Extension. However, be advised that the code section of the executeScript command will not simply take variables, but only a string. Therefore, after experimenting, I found we need to setup the string of commands beforehand and include the variables we want. Like this:
基于上面的直接方法，我能够直接从 Chrome 扩展程序的后台脚本中将代码注入新选项卡。但是，请注意，executeScript 命令的代码部分不会简单地采用变量，而只会采用字符串。因此，经过实验，我发现我们需要预先设置命令字符串并包含我们想要的变量。像这样：
var sendCode = 'document.getElementsByClassName("form-control n-gram")[0].value = "' + TMObj.brand + '";';
var TMUrl = "http://website.com";
chrome.tabs.create({ url: TMUrl }, function(tab){
chrome.tabs.executeScript(null, {code: sendCode});
});
});
This worked well!
这工作得很好！
回答by vedant
Better way to include dependencies
包含依赖项的更好方法
Add the dependant libraries (and other .js files) to the background scripts in your manifest.jsonby:
将依赖库（和其他 .js 文件）添加到您的后台脚本中manifest.json：
"background": {
"scripts": [
"jquery.js",
"main.js"
]
List the dependencies before app code so that they are loaded before.
在应用程序代码之前列出依赖项，以便在之前加载它们。
Reference: Register Background Scripts
Note: this would perform eager-loading of the scripts, instead of lazy-loading as with executeScript.
注意：这将执行脚本的预先加载，而不是像executeScript.
