Google Chrome扩展程序 - 单击工具栏图标时打开新标签页

Alo*_*kin 68 google-chrome google-chrome-extension

如何为Chrome创建一个向工具栏添加图标的扩展程序,当您点击该图标时,它会打开一个包含一些本地网页的新标签页(例如:f.html)?

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

谢谢.

Abh*_*hta 92

对于较新的Chrome应用程序,情况并非如此.

具有manifest_version:2的较新的chrome应用程序需要将标签打开为:


chrome.browserAction.onClicked.addListener(function(activeTab)
{
    var newURL = "http://www.youtube.com/watch?v=oHg5SJYRHA0";
    chrome.tabs.create({ url: newURL });
});
Run Code Online (Sandbox Code Playgroud)

  • 我需要哪个文件来放置这个代码..是main.js还是popup.html ??? (6认同)
  • @DehanWjiesekara把它放在例如background.js中并且在你的清单中有`"background":{"scripts":["background.js"]}`. (5认同)

Moh*_*our 52

好吧,在扩展文档中,它在清单声明,您需要包含"标签"作为其权限.他们解释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"
  ],
}
Run Code Online (Sandbox Code Playgroud)

后台页面中,您将在浏览器操作上侦听鼠标单击事件.

chrome.browserAction.onClicked.addListener(function(tab) {
  chrome.tabs.create({'url': chrome.extension.getURL('f.html')}, function(tab) {
    // Tab opened.
  });
});
Run Code Online (Sandbox Code Playgroud)

如上所述,您会看到我使用了您在其他帖子中看到的问题.注意,这没有经过测试,但我相信它应该可行.

  • 请注意,添加“选项卡”权限将在安装时向用户显示“读取您的浏览历史记录”权限警告。文档说大多数“chrome.tabs”不需要此权限 https://developer.chrome.com/extensions/tabs 因为我没有密切关注这一点,所以我最近从 https://developer.chrome.com/extensions/tabs 失去了数百名用户/chrome.google.com/webstore/detail/inbox-by-gmail-checker/mpjmeeikbbgccbjkbfabocnjcaejdpmj (2认同)

cui*_*ing 5

chrome.tabs.create需要“标签”的许可。

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

window.open(url,'_blank');
Run Code Online (Sandbox Code Playgroud)