简体   繁体   English

Chrome扩展程序sendMessage从popup.html到content.js不起作用

[英]Chrome Extension sendMessage from popup.html to content.js not working

I'm trying to build an Extension which sends data from the popup.html to the tab dome, but I can't get the sendMessage to work and I don't understand why. 我正在尝试构建一个扩展程序,该程序将数据从popup.html发送到选项卡圆顶,但是我无法使sendMessage正常工作,我也不明白为什么。 I'm following this guidline: https://developer.chrome.com/extensions/messaging.html 我正在遵循以下准则: https : //developer.chrome.com/extensions/messaging.html

here are my sources: 这是我的资料来源:

manifest:
{
   "manifest_version": 2,
   "name": "OMG Campaign Preview Maker",
   "description": "Easy OMG Campaign Preview Maker",
   "background": {  "scripts": ["background.js"]},
   "version": "0.1",
   "content_scripts": [
        {
          "matches": ["http://*/*", "https://*/*"],
          "js": ["jquery-1.7.min.js", "content.js"]
        }
    ],
   "browser_action": {
      "default_icon": "logo_128.jpg",
      "popup": "popup.html",
      "default_popup": "popup.html"
   },
   "icons": {
      "128": "logo_128.jpg"
   }
}

popup.html popup.html

<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<script type="text/javascript" src="jquery-1.7.min.js"></script>
<script type="text/javascript" src="popup.js"></script>
</head>
<body>
<h1>Clicks</h1>
<p>extra1:
  <input type="text" name="extraclicks[]" id="extra1">
  <br>
  extra2:
  <input type="text" name="extraclicks[]" id="extra2">
  <br>
  extra3:
  <input type="text" name="extraclicks[]" id="extra3">
  <br>
  <br>
  <input type="submit" name="sendclicks" id="sendclicks" value="Invia Clicks">
</p>
</body>
</html>

popup.js popup.js

function sendClicks(){
    console.log("popup.js > sendClicks()");
    var clicksArr = new Array();

    $("input[name='extraclicks\\[\\]']").each(function(i, value){
        clicksArr.push($(this).val());
    });

    chrome.tabs.getSelected(null, function(tab) {
        console.log("popup.js > tab id: "+tab.id)
        chrome.tabs.sendMessage(tab.id, {type:"clicks" },
            function(response) {
                console.log(response.msg);
            }
        );
    });
    console.log("avra' inviato?");
}

$(function(){
    console.log("popup.js > OMD Extension ready");
    $('#sendclicks').click(function(){sendClicks();});
});

content.js content.js

chrome.extension.onMessage.addListener(function(request, sender, sendResponse) {
    console.log("content.js > onMessage");

    if (request.type == 'clicks') {
        console.log("content.js > clicks");
        sendResponse({msg: "success"});
    }
});

While I can perfectly see the logs gnerated from popup.js in the console, I don't see any of the logs launched by content.js. 虽然我可以在控制台中完美地看到从popup.js生成的日志,但看不到content.js启动的任何日志。 What am I doing wrong? 我究竟做错了什么?

oops, I think you just send message to popup.js itself... 糟糕,我想您只是将消息发送到popup.js本身...

getSelected in popup.js listen the activity of popup tab(it is a tab in chrome too) thus, the tab id is actually the popup tab, not the tab where your content.js are inserted popup.js中的getSelected侦听popup选项卡(也是chrome中的一个选项卡)的活动,因此,选项卡ID实际上是弹出式选项卡,而不是您的content.js插入的选项卡

BTW getSelected is deprecated. BTW getSelected已过时。 Try alternatives? 尝试替代方法? http://developer.chrome.com/extensions/tabs.html#method-getCurrent http://developer.chrome.com/extensions/tabs.html#method-getCurrent

Ok, I'm stupid... the wrong thing was... the inspector page I was watching. 好吧,我很愚蠢……错误的事情是……我正在观看的检查器页面。 "console.log" inside of the content.js prints on the TAB INSPECTOR CONSOLE not on the extension one! content.js内部的“ console.log”打印在TAB INSPECTOR CONSOLE上,而不是扩展名上!

I hope it will help others. 我希望它会帮助其他人。

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

相关问题 在popup.html和content.js之间的Chrome扩展消息传递 - Chrome extension messaging between popup.html and content.js 在content.js(Chrome扩展程序)中发生操作时,如何检查popup.html页面? - How to check popup.html page when action occurs within content.js (Chrome Extension)? chrome扩展中的popup和content.js无法通信 - popup and content.js not communicating in chrome extension Chrome扩展程序-如何将变量从JS传递到popup.html? - Chrome Extension - How to pass variables from JS to popup.html? 在Chrome扩展程序中将(对象的)数组从popup.js传递到content.js - Passing array (of objects) from popup.js to content.js in chrome extension Chrome扩展程序如何将数据从内容脚本发送到popup.html - Chrome Extension how to send data from content script to popup.html Chrome扩展程序将Background.js中的值保存到存储中并在popup.html上显示 - Chrome Extension Saving Values from Background.js into Storage and displaying on popup.html Chrome扩展程序-select2库可在控制台中使用,但不能在content.js中使用 - Chrome extension - select2 library working into console but not in content.js 如何在 chrome 扩展中从 background.js 引用 popup.html DOM? - How to reference popup.html DOM from background.js in chrome extension? 如何在Chrome扩展程序中通过鼠标调整POPUP.html页面的大小 - How to resizing POPUP.html page from mouse in chrome extension
 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM