消息传递chrome扩展

时间:2012-11-11 09:04:41

标签: google-chrome-extension sendmessage

我想创建一个扩展,其中内容脚本将消息发送到后台页面,然后在浏览器操作上意味着单击扩展图标将访问该背景页面并获取一些数据。我在windows8上使用chrome版本23.0.1271.64 m。

我收到了以下错误。 端口错误:无法建立连接。接收端不存在。

我试图解决同样的问题。但人们正在使用chrome20 +不支持的sendRequest。我还找到了针对chrome 20+提到的解决方案。但不行。请帮忙。

以下是文件内容。

的manifest.json

{
  "name": "Test Extension",
  "version": "1.0",
  "manifest_version": 2,
  "description": "A test extension.",
  "background": "background.html",
  "content_scripts": [
    {
      "matches": ["<all_urls>"],
      "js": ["jquery.js","content.js"]
    }
  ],
 "permissions": ["tabs", "http://*/", "https://*/"],
   "browser_action": {
    "default_icon": "icon.png",
    "default_popup": "popup.html"
  }
}

background.html

<html>
<head>
    <script src="background.js"></script>
</head>
<body>
    <h1>Wy</h1>
</body>
</html>

background.js

chrome.extension.onMessage.addListener(function(request, sender, sendResponse) {
    // Chrome 20+
    alert(request);
    console.log('received in listener');
  sendResponse({farewell: "goodbye"});

});

content.js

$(function(){
console.log('start-sending message');

chrome.extension.sendMessage({greeting: "hello"},function(response){alert(response);});

console.log('end-sending message');
});

popup.html

<!doctype html>
<html>
  <head>
    <title>Getting Started Extension's Popup</title>
    </style>

    <!-- JavaScript and HTML must be in separate files for security. -->
    <script src="jquery.js"></script>
    <script src="popup.js"></script>

  </head>
  <body>
  </body>
</html>

popup.js

$(function(){
  var str_html = "<tr><td width='60%'>S</td><td width='40%'>15</td></tr><tr><td width='60%'>M</td><td width='40%'>25</td></tr>";
  $('#sizes_container').html(str_html);
  var bkg = chrome.extension.getBackgroundPage();
    console.log(bkg);
});

1 个答案:

答案 0 :(得分:0)

您错误地将已弃用的"background_page"属性与"background"的新签名混合在一起。使用background pages的正确方法是:

"background": {
    "scripts": ["background.js"]
}

您可以完全摆脱background.html,因为它没有用处(<body>的内容未被使用)(如果您确实需要它,请使用"background": {"page": "background.html"})。< / p>

关于sendRequest,它确实已弃用,但尚未删除。

关于您的弹出页面:您没有任何ID为sizes_container的元素,因此您显然看不到任何输出。