谷歌浏览器扩展框架内的访问元素

我正在开发一个Chrome浏览器扩展，当用户点击浏览器动作按钮时，一个新的选项卡应该打开那里的屏幕应该使用框架分裂。在框架内我有文本框以及iframe。文本框会像url栏一样，当用户在文本框中输入url时，我会更新iframe的内容。谷歌浏览器扩展框架内的访问元素

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

这个页面是Chrome扩展标签页，如果是其他页面，我可以注入内容脚本来在框架内添加事件监听器，所以我不能在这里使用内容脚本。

的事情，我试过，但没有工作： I）的manifest.json我添加的权限为 “权限”： “标签”，的 “http：// /”， “HTTPS： // /“ ] 但无效。二）试图--allow-文件访问从档案的Chrome浏览器，但没有奏效

来源

2011-11-25 kalai selvan

您不需要将脚本注入html文件里面的的扩展名。从这些，你将能够从页面脚本访问铬。* API。这就是说，如果iframe和带有文本框的框架位于不同的域中，则由于跨站点脚本安全性阻止了它，所以不能从另一个域访问它。

我需要看到更多的你已经有了HTML文件，但你也许能够做这样的事......

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

chrome.extension.onRequest.addListener(function (response) { 
    if (response.type === "urlUpdate") { 
     document.getElementById("addressBar").value = response.url; 
    } 
});

在后台页面：

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

最后，内容脚本在http://*和https://*运行。请确保你在你的清单（将其添加到内容脚本的现有列表）有这样的：

"content_scripts": [ 
    { 
     "matches": ["http://*/*", "https://*/*"], 
     "js": ["address.js"], 
     "all_frames": true 
    } 
];

这是你有all_frames设置为true拿到脚本的iframe内运行重要。

然后，你必须在这个address.js：

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

基本上，window.top检查只能由从iframe内的网址发送更新消息避免混淆。您可能需要更多筛选，以防止它在您不想要的其他页面上运行。

这是未经测试的，但我相当确信这种解决方案是可行的。

来源

2011-11-25 14:44:08 Jeremy

可以使用content script为click事件监听器，当用户点击一个新的链接使用window.postMessage到将新网址传递给iframe。

来源

2011-11-25 14:20:26 abraham

其实，从@abraham给出的答案开始，我认为你可以做到这一点。

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

window.addEventListener("message", function(msg) { 
    document.getElementById("addressBar").value = msg.data; 
}, false);

在address.js：

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

你不会需要在后台页面什么。

来源

2011-11-25 14:52:15 Jeremy

谷歌浏览器扩展框架内的访问元素

回答

相关问题