Background.js文件回调中的未定义Dom元素

时间:2019-07-14 21:37:47

标签: javascript google-chrome google-chrome-extension

我对chrome扩展还比较陌生,因此我仍在努力围绕各种术语/功能进行介绍。

我正在构建一个基本应用程序,该应用程序将基于某些DOM元素信息,在单击浏览器操作(工具栏中的扩展图标)时打开一个URL。

我有一个content_script.js文件来获取DOM信息,然后将它作为我的background.js的参数传递到回调中,并单击它。但是,总是将参数设为未定义,并且出现以下错误:

“未选中的runtime.lastError:无法建立连接。接收端不存在。”

由于我似乎无法在我的content.js文件中放置调试器,因此无法调试它,但是如果将调试器放在background.js中,则可以看到参数未定义。它正在打开一个新标签,只是没有我的论点。

manifest.json

{
"manifest_version": 2,
"name": "Open Page",
"description": "Opens the Page",
"version": "1.0",
"browser_action": {
    "default_icon": "ext.png",
    "default_title": "Ext Title"
},
"background": {
    "scripts": ["background.js"]
    },
"content_scripts": [
    {
        "matches": ["google.com/*"],
        "js": ["content.js"]
    }
],
"permissions": [
    "tabs"
]

}

content.js

chrome.runtime.onMessage.addListener(openURL)

function openURL(message) {

if (message.msg === "Open URL") {
    let artist = document.getElementById("band-name-location").firstElementChild.innerText.split(" ").join("%20")
    let album = document.getElementById("name-section").firstElementChild.innerText.split(" ").join("%20")
    sendResponse(album, artist)
}

}

background.js

function openTab(album, artist) {
chrome.tabs.create({url: `https://open.spotify.com/search/results/${album} 
${artist}`})
}

chrome.browserAction.onClicked.addListener(function(tab) {
chrome.tabs.sendMessage(tab.id, {msg: "Open URL"}, openTab)
})

0 个答案:

没有答案