我正在尝试创建一个chrome扩展程序,该扩展程序使用本地'blanksite.html'创建一个新标签,并注入一些JavaScript代码将其变为绿色。到目前为止,这就是我所拥有的。
background.js
chrome.browserAction.onClicked.addListener(function(activeTab){
chrome.tabs.create({'url': chrome.extension.getURL("blanksite.html") }, function(tab) {
chrome.tabs.executeScript(tab.id, {
code: 'document.body.style.backgroundColor="green"'
});
});
});
manifest.json
{
"manifest_version": 2,
"name": "Open Green Google Tab",
"description": "This extension opens a Green Google tab.",
"version": "1.0",
"background":{
"scripts": ["background.js"]
},
"browser_action": {
"default_icon": "icon.png"
},
"permissions": [
"tabs",
"activeTab"
]
}
这会在新标签页中打开“ blanksite.html”(字面上是一个空的html文件),但不会将标签页变为绿色。
我已经在Chrome extension: create tab then inject content script into it处阅读了其他答案,所以我知道为什么它不起作用(无法将代码直接插入chrome:// extension页面);但是我无法使其他答案上发布的解决方案对我有用。是否有清晰,完整的小代码片段可以使我想要执行的工作?
恐怕我不太了解消息传递,因此对于将其作为一个整体的任何解决方案,将不胜感激。
最佳答案
不知道为什么启动从后台页面传递到blanksite.html的消息不会成功(也许在创建时听完Blanksite.html中的消息已经太晚了吗?)。
但是,启动从blanksite.html传递消息并在响应中执行相应的操作效果很好,请参见以下示例代码:
blanksite.html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
</head>
<body>
<script src="blanksite.js"></script>
</body>
</html>
blanksite.js
chrome.runtime.sendMessage({src: "newtab"}, function(response) {
if(response.action === 'changeColor') {
document.body.style.backgroundColor = 'green';
}
});
background.js
chrome.browserAction.onClicked.addListener(function(activeTab) {
chrome.tabs.create({url: chrome.runtime.getURL('newtab.html')});
});
chrome.runtime.onMessage.addListener(function(request, sender, sendResponse) {
if(request.src === 'blanksite') {
sendResponse({action: 'changeColor'});
}
});
关于javascript - 将Javascript注入(inject)Chrome扩展程序的新创建的标签页中,我们在Stack Overflow上找到一个类似的问题:https://stackoverflow.com/questions/38057056/