Javascript Chrome扩展和内容脚本只能在“检查弹出窗口”模式下通信_Javascript_Google Chrome Extension_Content Script

Javascript Chrome扩展和内容脚本只能在“检查弹出窗口”模式下通信

javascript google-chrome-extension

Javascript Chrome扩展和内容脚本只能在“检查弹出窗口”模式下通信,javascript,google-chrome-extension,content-script,Javascript,Google Chrome Extension,Content Script,我有一个相当简单的扩展和内容脚本： manifest.json： ext-script.js： content-script.js： ext-page.htm：插入内容脚本的示例页面：我的问题是：如果我选择扩展并检查弹出窗口，这意味着启动调试模式，并单击示例页面上的mybutton按钮，那么我将收到扩展返回的消息，我可以在页面的控制台中看到它。我想要的是在单击示例页面中的按钮后立即获得该消息，当然不需要调试扩展。如果我没有检查扩展，则会收到以下错误消息：未知的事件处理程序中出错：Type

我有一个相当简单的扩展和内容脚本：

manifest.json：

ext-script.js：

content-script.js：

ext-page.htm：

插入内容脚本的示例页面：

我的问题是：如果我选择扩展并检查弹出窗口，这意味着启动调试模式，并单击示例页面上的mybutton按钮，那么我将收到扩展返回的消息，我可以在页面的控制台中看到它。我想要的是在单击示例页面中的按钮后立即获得该消息，当然不需要调试扩展。如果我没有检查扩展，则会收到以下错误消息：

未知的事件处理程序中出错：TypeError:无法读取未定义的属性“Affore”

谢谢

我认为，由于您正在弹出窗口中的main.js内执行警报，因此弹出窗口需要打开。尝试在background.js中插入警报。由于background.js作为内容脚本插入到示例页面中，因此警报应该显示在示例页面中

而不是在background.js中

    if( msg ) {
        chrome.extension.sendRequest( msg );
    }

做

文件建议有如下清单：

{
    "manifest_version": 2,
    "name": "Test",
    "version": "0.1",
    "background": {
    "scripts": ["background.js"],
    //this script is the main one which your extension communicates with
    "persistent": false
},
"browser_action": {
    "default_title": "BET",
    "default_popup": "popup.html"
    //this html file is the one that will be shown when clicked on your extension icon
},
"content_scripts": [{
    //this file will get injected into the tabs
    "matches": ["file:///*"],
    "js": ["content.js"]
}],
"permissions": [
    "tabs",
    "<all_urls>"
]

在background.js中，您将收到消息

chrome.runtime.onMessage.addListener(function(request, sender, sendResponse) {
    console.log(request.greeting);
    if (request.greeting == "hello")
        sendResponse({farewell: "goodbye"});
});

通过这种方式，您将能够记录从注入脚本发送到扩展的内容……只需从扩展页面打开后台控制台

如果你稍微改变一下结构，希望这会有所帮助。如果有帮助，请告诉我，那有什么意义？我在这里所写的应该是将代码驻留在main.js中的扩展连接到我的内容脚本驻留在background.js中。如果我想简单地调用content script background.js中的某个内容，那么我的问题的重点是什么？实际上，我试图通过content script发送一条消息，并在扩展中捕获它并显示它。也许我应该使用另一种技术，但这就是我的目标。是的，我想你的目标是做其他事情。我不是专家，但根据我的经验，扩展有一个背景脚本，内容脚本可以与之通信。您的脚本命名约定与文档建议的不同，但无论如何……我会更新我的答案，并提供一个建议，我会尝试一下，但我建议您删除清单中与问题无关的第一部分，否则乍一看，这听起来不是一个合适的答案。技术上，在您的问题中，您希望在单击后立即弹出警报。问题的第一部分将立即弹出。和已被弃用，改为使用chrome.runtime.sendMessage和chrome.runtime.onMessage。我已经更改了这些，但仍然是相同的错误消息。我认为，即使某些方法被弃用，它至少在一段时间内不会出现错误。

<!DOCTYPE html>
<html>
<head>
    <script src='./ext-script.js'></script>
</head>
<body>
    This is a test Extention.
</body>
</html>

<html>
<head>
    <title>Connecting to a Chrome Extention using Content Script</title>
</head>

<body>
    <p>
        <!--<input id="btn" type="button" value="open document" />-->
        <input id="mytext" type="text" />
        <input id="mybutton" name="mybutton" type="button" value="open document" />
    </p>
</body>
</html>

    if( msg ) {
        chrome.extension.sendRequest( msg );
    }

var msg = document.getElementById( 'mytext' ).value;
    if( msg ) {
        alert( msg );
    }

{
    "manifest_version": 2,
    "name": "Test",
    "version": "0.1",
    "background": {
    "scripts": ["background.js"],
    //this script is the main one which your extension communicates with
    "persistent": false
},
"browser_action": {
    "default_title": "BET",
    "default_popup": "popup.html"
    //this html file is the one that will be shown when clicked on your extension icon
},
"content_scripts": [{
    //this file will get injected into the tabs
    "matches": ["file:///*"],
    "js": ["content.js"]
}],
"permissions": [
    "tabs",
    "<all_urls>"
]

chrome.tabs.sendMessage(tabs[0].id, {greeting: "hello"}, function(response) {
    console.log(response.farewell);
});

chrome.runtime.onMessage.addListener(function(request, sender, sendResponse) {
    console.log(request.greeting);
    if (request.greeting == "hello")
        sendResponse({farewell: "goodbye"});
});