[英]Chrome extension message passing is not working?
In contentScript.js
the function is not called. 在contentScript.js
,未调用该函数。
var insertUI = true
// var hasExecutedOnce = false
chrome.browserAction.onClicked.addListener(function(tab) {
console.log(`clicked browserAction`)
// if (!hasExecutedOnce)
chrome.tabs.executeScript(tab.id, {
file: 'contentScript.js',
})
chrome.runtime.sendMessage({
from: 'background',
subject: insertUI ? 'insertUI' : 'removeUI',
})
chrome.runtime.onMessage.addListener(function(request, sender, sendResponse) {
if (request.subject === 'doneRemovingUI') insertUI = false
else if (request.subject === 'doneInsertingUI') insertUI = true
})
insertUI = !insertUI
// hasExecutedOnce = true
})
console.log(`bg`)
{
"manifest_version": 2,
"name": "Sample",
"version": "1.0.0",
"description": "Sample Extension",
"icons": {
"16": "icon16.png",
"19": "icon19.png",
"24": "icon24.png",
"32": "icon32.png",
"38": "icon38.png",
"48": "icon48.png",
"64": "icon64.png",
"128": "icon128.png"
},
"background": {
"scripts": ["background.js"],
"persistent": false
},
"browser_action": {
"default_icon": {
"19": "icon19.png",
"38": "icon38.png"
}
},
"permissions": ["activeTab", "<all_urls>"]
}
var body = document.getElementsByTagName('body')[0]
function insertUI() {
console.log(`insertUI`)
var div = document.createElement('div')
div.setAttribute('id', 'sample-extension-12345')
div.innerHTML = `<h1>Sample Extension</h1>`
body.appendChild(div)
}
function removeUI() {
console.log(`removeUI`)
var divId = document.getElementById('sample-extension-12345')
body.removeChild(divId)
}
function main() {
console.log(`main called`)
chrome.runtime.onMessage.addListener(function(msg, sender, sendResponse) {
console.log({ msg, sender, sendResponse })
if (msg.subject === 'insertUI') {
insertUI()
sendResponse({
from: 'content',
subject: 'doneInsertingUI',
})
} else if (msg.subject === 'removeUI') {
removeUI()
sendResponse({
from: 'content',
subject: 'doneRemovingUI',
})
}
})
}
console.log(`contentScript`)
main()
So everything works. 所以一切正常。 insertUI()
& removeUI()
works individually in contentScript.js
but the chrome.runtime.onMessage.addListener
is never called. insertUI()
和removeUI()
在contentScript.js
可以单独工作,但是从不调用chrome.runtime.onMessage.addListener
。
The console.log()
in it are not called. 其中的console.log()
不会被调用。 Rest everything works. 休息一切正常。 Inserting in DOM & removing DOM works separately. 插入DOM和删除DOM分别工作。 They just need to work when browser_action
is toggled. 当切换browser_action
时,它们只需要工作browser_action
。
Iván Nokonoko answered the problem above in comments. 伊万·诺科诺科(IvánNokonoko)在评论中回答了上述问题。 Posting it here for brevity - 为了简洁起见,在这里发布-
var hasExecutedOnce = false
function addUI(tabId) {
chrome.tabs.sendMessage(tabId, {
from: 'background',
subject: 'isUIAdded?',
})
}
chrome.browserAction.onClicked.addListener(function(tab) {
if (!hasExecutedOnce) {
chrome.tabs.executeScript(
tab.id,
{
file: 'contentScript.js',
},
function() {
addUI(tab.id)
},
)
hasExecutedOnce = true
}
addUI(tab.id)
})
{
"manifest_version": 2,
"name": "Sample",
"version": "1.0.0",
"description": "Sample Extension",
"icons": {
"16": "icon16.png",
"19": "icon19.png",
"24": "icon24.png",
"32": "icon32.png",
"38": "icon38.png",
"48": "icon48.png",
"64": "icon64.png",
"128": "icon128.png"
},
"background": {
"scripts": ["background.js"],
"persistent": false
},
"browser_action": {
"default_icon": {
"19": "icon19.png",
"38": "icon38.png"
}
},
"permissions": ["activeTab", "<all_urls>"]
}
var body = document.getElementsByTagName('body')[0]
function insertUI() {
var div = document.createElement('div')
div.setAttribute('id', 'sample-extension-12345')
div.innerHTML = `<h1>Sample Extension</h1>`
body.appendChild(div)
}
function removeUI() {
document.getElementById('sample-extension-12345').remove()
}
function main() {
chrome.runtime.onMessage.addListener(function(request, sender, sendResponse) {
if (request.subject === 'isUIAdded?') {
const id = document.getElementById('sample-extension-12345')
if (id === null) insertUI()
else removeUI()
}
})
}
main()
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.