如何接收从内容脚本发送到popup.js/html的消息？

我无法弄清楚如何从我的内容脚本发送一些数据到popup.html。这是一个点击元素的xpath。我很新Chrome扩展程序所以也许很明显。如何接收从内容脚本发送到popup.js/html的消息？

我已阅读关于消息传递的文章，但我在那里有一个混乱。

我想出如何发送来自xpathget.js的消息，但我不知道如何接收它并在popup.html上显示它，因为它在点击某个元素后关闭。

manifest.json的

{ 
    "manifest_version": 2, 
    "name": "Product", 
    "description": "This is a plugin collaborating with product.com", 
    "version": "1.0", 
    "browser_action": { 
    "default_icon": "spy-icon.png", 
    "default_popup": "popup.html", 
    "default_title": "Click here!" 
    }, 
    "icons":{ 
    "64":"spy-icon.png" 
    }, 
    "background": { 
    "scripts": ["authentication.js"] 
    }, 
    "content_scripts": [ 
    { 
     "matches": ["<all_urls>"], 
     "js": ["xpathget.js"] 
    } 
    ], 
    "permissions": [ 
    "activeTab", 
    "https://ajax.googleapis.com/", 
    "cookies", 
    "<all_urls>" 
    ], 
    "content_security_policy": "script-src 'self' https://ajax.googleapis.com; object-src 'self'" 
}

popup.js

$(document).ready(function() { 
    $('body').height(280); 
    $('html').height(280); 
    MESSAGE_GET_HANDLER(){ 
     ALTER_THE_HTML; 
    } 
});

我想，我必须xpath字符串给popup.js然后改变popup.html HTML和它的完成。

xpathget.js

document.onclick= function(event) { 
    if (event===undefined) event= window.event;      // IE hack 
    var target= 'target' in event? event.target : event.srcElement; // another IE hack 

    var root= document.compatMode==='CSS1Compat'? document.documentElement : document.body; 
    var mxy= [event.clientX+root.scrollLeft, event.clientY+root.scrollTop]; 

    var path= getPathTo(target); 
    var txy= getPageXY(target); 
    chrome.runtime.sendMessage({xpath: path}, function() { 
     alert('sent'); 
    }); <== I HAVE TO SEND THIS PATH TO PLUGIN 
} 

function getPathTo(element) { 
    if (element.id!=='') 
     return 'id("'+element.id+'")'; 
    if (element===document.body) 
     return element.tagName; 

    var ix= 0; 
    var siblings= element.parentNode.childNodes; 
    for (var i= 0; i<siblings.length; i++) { 
     var sibling= siblings[i]; 
     if (sibling===element) 
      return getPathTo(element.parentNode)+'/'+element.tagName+'['+(ix+1)+']'; 
     if (sibling.nodeType===1 && sibling.tagName===element.tagName) 
      ix++; 
    } 
} 

function getPageXY(element) { 
    var x= 0, y= 0; 
    while (element) { 
     x+= element.offsetLeft; 
     y+= element.offsetTop; 
     element= element.offsetParent; 
    } 
    return [x, y]; 
}

来源

2016-10-02 Milano Slesarik

你能更好地解释你的扩展中实际发生了什么吗？点击页面上应该打开弹出窗口并传递消息的内容？这里的流量不完全清楚。 – DelightedD0D

有没有办法让工具栏弹出打开，一旦你点击一个网页或外部弹出的任何地方。一旦它关闭，它的环境/上下文/对象和事件监听器就不再存在了。
工具栏弹出窗口也无法以编程方式重新打开。

继续在DOM对话框/ div中添加到互动，例如uBlock's element picker does.或打开一个新窗口'popup'类型通过chrome.windows.create。

来源

2016-10-02 15:31:37 wOxxOm

如何接收从内容脚本发送到popup.js/html的消息？

回答

相关问题