Google Chrome 扩展程序 - 单击工具栏图标时打开新选项卡

Posted

技术标签:

【中文标题】Google Chrome 扩展程序 - 单击工具栏图标时打开新选项卡【英文标题】:Google Chrome Extensions - Open New Tab when clicking a toolbar icon 【发布时间】:2011-03-12 10:19:26 【问题描述】:

如何为 Chrome 创建一个扩展程序,将一个图标添加到工具栏,当您单击它时,它会打开一个带有一些本地网页的新选项卡(例如:f.html)?

我看到了this question,但它并没有真正解释我应该在清单文件中添加什么...

【问题讨论】:

【参考方案1】:

这不适用于较新的 chrome 应用程序。

较新的 chrome 应用具有 manifest_version: 2 要求标签打开为:


chrome.browserAction.onClicked.addListener(function(activeTab)

    var newURL = "http://www.youtube.com/watch?v=oHg5SJYRHA0";
    chrome.tabs.create( url: newURL );
);

【讨论】:

这是更好、更及时、更准确的答案,仅供参考 @DehanWjiesekara 把它放在例如background.js 并在你的清单中有"background": "scripts": [ "background.js" ] tabs.create 用于 onInstalled 在加载基本上只有一个本地 index.html 的解压扩展和一个现在完全打开 index.html 的 background.js 的上下文中触发一个新标签?出于某种原因,这对我现在不起作用,一定是我缺少一些简单的东西。 请记住,使用“选项卡”权限会在安装时向用户显示警告,即 chrome 扩展程序需要“读取您的浏览历史记录”,但如果您只想打开一个新选项卡,那么只需使用“activeTab”权限,它不会触发该警告。 你必须这样做,不是吗?【参考方案2】:

好吧,在extensions docs 中,它在manifest 中声明,您需要包含“标签”作为其权限。他们解释 hello world 应用程序的方式相同:

清单文件:


  "name": "My Extension",
  "version": "1.0",
  "description": "Opens up a local webpage",
  "icons":  "128": "icon_128.png" ,
  "background_page": "bg.html",
  "browser_action": 
    "default_title": "",
    "default_icon": "icon_19.png"
  ,
  "permissions": [
    "tabs"
  ],

在background page 中,您在浏览器操作上监听鼠标单击事件。

chrome.browserAction.onClicked.addListener(function(tab) 
  chrome.tabs.create('url': chrome.extension.getURL('f.html'), function(tab) 
    // Tab opened.
  );
);

正如您在上面所注意到的,您会看到我使用了您在另一篇文章中看到的问题。请注意,这未经测试,但我相信它应该可以工作。

【讨论】:

请注意,添加“选项卡”权限会在安装时向用户显示“读取您的浏览历史记录”权限警告。文档说大多数chrome.tabs不需要这个权限developer.chrome.com/extensions/tabs因为我没有密切关注这个,最近我从chrome.google.com/webstore/detail/inbox-by-gmail-checker/…失去了数百个用户【参考方案3】:

chrome.tabs.create 需要“tabs”的权限。

只需在扩展中使用 window.open 即可,无需任何许可。并且代码更短。我建议这个解决方案。

window.open(url,'_blank');

【讨论】:

我确实在我的扩展程序中使用了相同的代码,以便在单击通知按钮时打开新标签。但现在 3 个月后,我在单击该按钮时收到 aw..snap 页面错误。你知道为什么会这样吗? P.s:如果我使用另一个网址(例如:www.google.com),它可以正常工作,但它不适用于我的网站。 这似乎对我有用(尽管我只在我正在开发的本地非捆绑扩展中尝试过)。

以上是关于Google Chrome 扩展程序 - 单击工具栏图标时打开新选项卡的主要内容,如果未能解决你的问题,请参考以下文章

怎么设置chrome打开应用程序

如何使用 Chrome 扩展程序自动保存 Google Chrome 开发者工具的网络面板日志?

Google Chrome 扩展程序 + 使用 Facebook 登录 + Parse

google chrome 扩展程序导出

检测 Google Chrome 扩展的 browser_action 表单中的按钮点击

UiBot无法抓取Google Chrome元素和数据抓取工具无法使用的解决方案