Iframe 在google chrome扩展中访问框架内的元素

我正在开发一个chrome扩展，当用户点击浏览器操作按钮时，应该会打开一个新的选项卡。屏幕应该用框架分割。在框架内，我有文本框和iframe。文本框的作用类似于url栏，当用户在文本框中输入url时，我将更新iframe的内容

这里是我的实际问题，当用户单击iframe内的任何链接时，我必须更新url栏，但我无法为iframe内的链接添加事件侦听器，问题是我无法访问iframe内的元素，我得到的错误如下“不安全的javascript试图访问URL。。。。。。从框架中……”

这个页面是chrome扩展选项卡，如果它是其他页面，我可以在框架内插入内容脚本来添加事件监听器，所以我不能在这里使用内容脚本

我尝试过但没有成功的事情： i） 在manifest.json中，我将权限添加为“权限”：[ “标签”， “http://”， “https://” ] 但是没有起作用。

---

ii）已尝试--允许从chrome浏览器中的文件访问文件，但不起作用

您可以使用to作为单击事件侦听器，当用户单击新链接时，使用to将新URL传递出iframe。

您可以使用to作为单击事件侦听器，当用户单击新链接时，使用to将新URL传递出iframe。

您不需要将脚本插入扩展内的html文件中。从这些文件中，您可以从页面脚本访问chrome.*API

也就是说，如果iframe和带有textbox的frame位于不同的域中，则不能从另一个域访问，因为跨站点脚本安全性会阻止它

我需要看到更多的HTML文件，你已经有，但你可能可以这样做

在扩展选项卡（包含文本框）中：

在背景页中：

chrome.extension.onRequest.addListener(function(request, sender) {
   if (request.type === "urlUpdate") {
      chrome.tabs.sendRequest(sender.tab.id, {type: "urlUpdate", url: request.url});
   }
});

最后，要在

http://*

和

https://*

上运行的内容脚本。请确保您的清单中有此脚本（将其添加到现有内容脚本列表中）：

将

all_frames

设置为

true

以使脚本在iframe内运行，这一点很重要

然后，您将在

address.js

中看到这个：

if (window.top !== window) {
   chrome.extension.sendRequest({type: "urlUpdate", url: location.href});
}

if (window.top !== window) {
   window.top.postMessage(location.href, chrome.extension.getURL(""));
}

基本上，

window.top

检查应该通过只从iFrame内部发送url更新消息来避免混淆。您可能需要进行更多过滤，以防止它在您不希望的其他页面上运行

---

这是未经测试的，但我相信这种解决方案会起作用。

您不需要将脚本注入扩展内的html文件。通过这些，您可以从页面脚本访问chrome.*API

也就是说，如果iframe和带有textbox的frame位于不同的域中，则不能从另一个域访问，因为跨站点脚本安全性会阻止它

我需要看到更多的HTML文件，你已经有，但你可能可以这样做

在扩展选项卡（包含文本框）中：

在背景页中：

chrome.extension.onRequest.addListener(function(request, sender) {
   if (request.type === "urlUpdate") {
      chrome.tabs.sendRequest(sender.tab.id, {type: "urlUpdate", url: request.url});
   }
});

最后，要在

http://*

和

https://*

上运行的内容脚本。请确保您的清单中有此脚本（将其添加到现有内容脚本列表中）：

将

all_frames

设置为

true

以使脚本在iframe内运行，这一点很重要

然后，您将在

address.js

中看到这个：

if (window.top !== window) {
   chrome.extension.sendRequest({type: "urlUpdate", url: location.href});
}

if (window.top !== window) {
   window.top.postMessage(location.href, chrome.extension.getURL(""));
}

基本上，

window.top

检查应该通过只从iFrame内部发送url更新消息来避免混淆。您可能需要进行更多过滤，以防止它在您不希望的其他页面上运行

---

这是未经测试的，但我相当有信心这种解决方案会奏效。

事实上，根据@abraham给出的答案，我认为你可以做到这一点

在扩展选项卡（带有地址栏）中：

在

address.js

中：

if (window.top !== window) {
   chrome.extension.sendRequest({type: "urlUpdate", url: location.href});
}

if (window.top !== window) {
   window.top.postMessage(location.href, chrome.extension.getURL(""));
}

---

你不需要在背景页中添加任何内容。

事实上，根据@abraham给出的答案，我认为你可以这样做

在扩展选项卡（带有地址栏）中：

在

address.js

中：

if (window.top !== window) {
   chrome.extension.sendRequest({type: "urlUpdate", url: location.href});
}

if (window.top !== window) {
   window.top.postMessage(location.href, chrome.extension.getURL(""));
}

你不需要背景页上的任何东西