从chrome的扩展程序内容脚本中访问iframe内容

Question

我正在做一个插件来对界面进行一些转换.我一直在unsafe javascript attempt to access frame with url.... Domains, protocols and ports must match(典型的跨站点问题)

但作为扩展程序,它应该可以访问iframe的内容http://code.google.com/chrome/extensions/content_scripts.html ...

没有人知道如何访问它的内容,以便它们可以被捕获吗？

Answer 1

通常没有直接访问不同来源window对象的方法.如果要在不同帧中的内容脚本之间进行安全通信,则必须向后台页面发送消息,后台又将消息发送回选项卡.

这是一个例子:

部分manifest.json:

"background": {"scripts":["bg.js"]},
"content_scripts": [
    {"js": ["main.js"], "matches": ["<all_urls>"]},
    {"js": ["sub.js"], "matches": ["<all_urls>"], "all_frames":true}
]

main.js:

var isTop = true;
chrome.runtime.onMessage.addListener(function(details) {
    alert('Message from frame: ' + details.data);
});

sub.js:

if (!window.isTop) { // true  or  undefined
    // do something...
    var data = 'test';
    // Send message to top frame, for example:
    chrome.runtime.sendMessage({sendBack:true, data:data});
}

后台脚本'bg.js':

chrome.runtime.onMessage.addListener(function(message, sender) {
    if (message.sendBack) {
        chrome.tabs.sendMessage(sender.tab.id, message.data);
    }
});

另一种方法是使用chrome.tabs.executeScriptin bg.js来触发主内容脚本中的函数.

相关文件

• 消息传递 ^{c.runtime.sendMessage/ c.tabs.sendMessage/c.runtime.onMessage}
• MessageSender和Tab类型.
• 内容脚本
• chrome.tabs.executeScript

Answer 2

我知道这是一个老问题,但我最近花了半天时间来解决它.通常创建iframe看起来像这样:

var iframe = document.createElement('iframe');
iframe.src = chrome.extension.getURL('iframe-content-page.html');

此框架与页面的起源不同,您将无法获取其DOM.但是,如果您仅为css隔离创建iframe,则可以通过其他方式执行此操作:

var iframe = document.createElement('iframe');
document.getElementById("iframe-parent").appendChild(iframe);
iframe.contentDocument.write(getFrameHtml('html/iframe-content-page.html'));
.......
function getFrameHtml(htmlFileName) {
    var xmlhttp = new XMLHttpRequest();
    xmlhttp.open("GET", chrome.extension.getURL(html/htmlFileName), false);
    xmlhttp.send();

    return xmlhttp.responseText;
}
.......
"web_accessible_resources": [   
    "html/htmlFileName.html",
    "styles/*",
    "fonts/*"
]

之后,您可以使用iframe.contentDocument访问iframe的DOM