是否可以更改Chrome扩展程序中弹出窗口的网址?

时间:2012-12-02 20:19:59

标签: google-chrome-extension

我有一个Chrome扩展程序,当点击该按钮时会打开一个弹出窗口:

"browser_action": {
    "default_popup": "popup.html"
},

当加载弹出窗口时,我希望它重定向到不同的URL,具体取决于当前活动的浏览器选项卡的URL。

我在弹出窗口中尝试过window.location.href = "http://example.com/",但只是得到一个空白页。

我已经尝试在填充整个弹出窗口的iframe中加载URL - 这很好 - 但是当新URL调用window.close()时我需要关闭弹出窗口,这似乎不是当它在iframe中时可被检测到。

这可能吗?

1 个答案:

答案 0 :(得分:1)

如果是您自己创建的页面,则可以使用window.postMessage从iframe中的页面向弹出窗口发送消息,告知其关闭。
您文件中需要的代码是......
popup.js

// change #frame to point at your iframe
var frame = document.querySelector('#frame');

window.addEventListener('message', closeWindow, false);

function closeWindow(event) {
    if(frame.src.indexOf(event.origin) === 0 && event.data == 'closeWindow') window.close();
}
iframe

中的

页面

window.close = function() {
    window.parent.postMessage("closeWindow", window.parent.location.href);
}

要为iframe中的任何页面执行此操作,我无法想到任何真正干净的方式,但这样做。
拥有一个内容脚本,该脚本在所有帧中的每个URL上运行,通过检查其window.parent的url来检查它是否在iframe中。 如果它在iframe中,则用上面的方法覆盖window.close事件。
我们想要覆盖的window.close函数位于页面非内容脚本的上下文中,因此将脚本附加到页面。
这是执行此操作的代码...
manifest.json

{
  "name": "PopUp IFrame Parent Window Close",
  "description" : "http://stackoverflow.com/questions/13673428/is-it-possible-to-change-the-url-of-the-popup-window-in-a-chrome-extension",
  "version": "1.0",
  "permissions": [
    "tabs", "<all_urls>"
  ],
  "browser_action": {
      "default_title": "Test Closing IFrames parent if in popup",
      "default_icon": "icon.png",
      "default_popup": "popup.html"
  },
 "content_scripts": [
    {
      "matches": ["<all_urls>"],
      "js": ["myscript.js"],
      "all_frames":true
    }
  ],
  "manifest_version":2
}

popup.html

<html>
<head>
<script type="text/javascript" src='popup.js'></script>
</head>
<body>
<iframe id="frame" src="http://localhost/windowclose.html"></iframe>
</body>
</html>

popup.js

function onLoad() {
    // change #frame to point at your iframe
    var frame = document.querySelector('#frame');

    window.addEventListener('message', closeWindow, false);

    function closeWindow(event) {
        if(frame.src.indexOf(event.origin) === 0 && event.data == 'closeWindow') window.close();
    }

}

window.addEventListener("load", onLoad)

myscript.js

hijackClose = function() {
    window.close = function() {
        window.parent.postMessage("closeWindow", window.parent.location.href);
    }
}

// Executing an anonymous script
function exec(fn) {
    var script = document.createElement('script');
    script.setAttribute("type", "application/javascript");
    script.textContent = '(' + fn + ')();';
    document.documentElement.appendChild(script); // run the script
    document.documentElement.removeChild(script); // clean up
}

if(window.parent && window.parent.location.href == chrome.extension.getURL('popup.html')) {
    exec(hijackClose);
}

...现在任何在弹出窗口iframe中调用window.close的页面都会关闭弹出窗口。