无法通过 chrome 扩展与 iFrame 交互

Posted

技术标签:

【中文标题】无法通过 chrome 扩展与 iFrame 交互【英文标题】:Unable to interact with iFrame through chrome extension 【发布时间】:2015-12-11 15:42:25 【问题描述】:

我有一个包含 iFrame 的页面,它加载不同的网站,并希望能够与 iFrame 的内容进行交互(单击、聚焦、选择、输入值等)。

到目前为止,我可以检查 iFrame 是否已加载,但是一旦尝试执行简单的操作,例如在其中隐藏元素,则什么也没有发生。

manifest.json



  "manifest_version": 2,
  "name": "my Extension",
  "version": "0.1",

  "content_scripts" : [
    
      "matches": [
        "http://*.myPage.com/*",
        "https://*.iframePage.com/*"
      ],
      "js": ["lib/jquery-2.1.4.min.js", "content.js"]
    
  ]


content.js

console.log('Page Loaded');

var myFrame = $('iframe');

myFrame.ready(function() 
  console.log('Frame Loaded');
);

chrome 中也有一条警告说:

Uncaught SecurityError: Blocked a frame with origin "https://www.iframePage.com" from accessing a frame with origin "http://www.myPage.com".  The frame requesting access has a protocol of "https", the frame being accessed has a protocol of "http". Protocols must match.

不确定这是否与扩展问题有关。

【问题讨论】:

我似乎记得您可以规避扩展清单中的跨源问题 - 或许可以调查一下 警告意味着:httphttps 使用相同的协议。 您是否查看过设置all_frames 并使用消息传递与框架进行通信? 【参考方案1】:

这是一个跨域错误。

跨域问题与 iframe 之间的通信有关。你 始终可以嵌入任何 iframe,但如果来源不同,则 iframe 不能 互相交流。

您无法访问 iframe 的内容。

同源策略的基础是窗口可以在 仅当它们来自相同的上下文时 协议://域:端口,

请参阅此SO Answer-ways to circumvent Cross Domain。

【讨论】:

不好意思,有没有一种解决方案可以让我打开一个新选项卡而不是使用 iFrame 并以这种方式与网站交互?虽然我正在收听我页面上的事件并且需要使用它们来触发另一个页面上的操作。 我认为您无法以任何方式与其他域的网站进行交互。 扩展可以(可能) @JaromandaX :有可能,但我不确定。 当然,不存在跨域问题,因为协议问题导致 iframe 无法加载

以上是关于无法通过 chrome 扩展与 iFrame 交互的主要内容,如果未能解决你的问题,请参考以下文章

无法使用 jquery 访问通过 google chrome 内容脚本注入的 iframe 的内容

隐身标签的 Chrome 扩展

允许 Youtube iframe 显示与 Youtube.com 兼容的 Chrome 扩展程序

使用 JavaScript 将 Chrome 扩展注入 iFrame

从 Chrome 内容脚本扩展访问 iframe

Chrome 扩展将 jquery 注入 iframe