如何在 Google Chrome 扩展中启动新的 window

Question

我正在尝试为 Google Chrome 开发一个扩展，但我遇到了一些问题，我想在用户单击它时启动或创建一个新的 window图标。

像这样：http://i.imgur.com/8iRkEOb.png

非常感谢！

Answer 1

首先，如果您在清单中定义了 default_popup - 您需要将其删除，因为它会干扰您要捕获的点击事件。

然后，您需要在后台脚本中捕获事件：

chrome.browserAction.onClicked.addListener(function(tab) {
  // ...
});

接下来，如果我们想要一个window，我们可能想看看windows API。 create() 听起来像你需要的：

chrome.browserAction.onClicked.addListener(function(tab) {
  chrome.windows.create({/* options */});
});

您需要什么选项？假设你想从你的扩展中打开一个页面，你需要一个 URL 包裹在 chrome.runtime.getURL:

chrome.browserAction.onClicked.addListener(function(tab) {
  chrome.windows.create({
    // Just use the full URL if you need to open an external page
    url: chrome.runtime.getURL("mypage.html")
  });
});

然后，要像您显示的那样显示 window，但没有顶部工具栏，您需要 window 类型 "popup":

chrome.browserAction.onClicked.addListener(function(tab) {
  chrome.windows.create({
    url: chrome.runtime.getURL("mypage.html"),
    type: "popup"
  });
});

最后，如果您想在 window 打开后做一些事情，请使用回调：

chrome.browserAction.onClicked.addListener(function(tab) {
  chrome.windows.create({
    url: chrome.runtime.getURL("mypage.html"),
    type: "popup"
  }, function(win) {
    // win represents the Window object from windows API
    // Do something after opening
  });
});

Answer 2

background.js

chrome.browserAction.onClicked.addListener(function(activeTab)
{
    chrome.windows.create({ url: chrome.runtime.getURL("popup.html"), type: 
    "popup" });
});

manifest.json

{  
    "manifest_version": 2,  
    "name": "",  
    "description": "",  
    "version": "1.0", 

    "chrome_url_overrides": {
        "newtab": "popup.html" //the html to show in popup
    },

    "browser_action": {
        "default_icon": "img/zi.png" //some icon
    },

    "permissions": [
        "tabs"
    ],

    "background": {
        "scripts": ["background.js"],
        "persistent": false
    }
}

如何在 Google Chrome 扩展中启动新的 window

How to launch a new window in Google Chrome Extension

javascript

google-chrome-extension