从chrome扩展中注入函数/变量以进行分页

时间:2012-04-29 15:31:12

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


我正在编写Chrome扩展程序,可为用户访问的某些页面添加功能 为此,我需要注入一些页面需要能够调用的变量和函数。
这些变量/函数在内容脚本中生成。

但是,由于内容脚本在隐蔽环境中运行,因此主页无法访问它。

根据这篇文章: http://code.google.com/chrome/extensions/content_scripts.html#host-page-communication 内容脚本和主机页面可以通过添加事件来通过DOM进行通信 但这是一种可怕的做事方式,我真的很想看到一些方法来轻松注入方法/变量。

有可能吗?

谢谢!

2 个答案:

答案 0 :(得分:4)

如果它仍然引起任何人的兴趣,我找到了一个解决方案,通过消息在内容脚本和页面之间进行通信。

发送脚本上的内容如下:

window.postMessage({ type: "messageType", params: { param: "value", anotherParam: "value" } }, "*"/*required!*/);

然后在接收脚本上执行以下操作:

window.addEventListener("message", function(event) {
        // We only accept messages from ourselves
        if (event.source != window)
            return;

        switch (event.data.type) {
        case "blabla":
            // do blabla
            // you can use event.data.params to access the parameters sent from page.
            break;
        case "another blabla":
            // do another blabla 
            break;
        }
    });

答案 1 :(得分:0)

以下是我在扩展程序http://pagexray.com/extension/

上编码的方式 你的manifest.json上的

 "content_scripts": [
    {
        "matches": ["http://*/*"],
        "js": ["script.js"]
    }
],
你的script.js上的

(function(){
  var script = document.createElement('script');
  script.src = "http://example.com/external.js";
  script.addEventListener('load', function() { });
  document.head.appendChild(script);
})();