简单 Chrome 扩展：在新选项卡中打开 url

Question

我想创建一个像 Panda or the Product Hunt Extension 这样的 "new tab" 扩展：用户可以打开一个新标签页，里面有我的网站，隐藏 url.

我已经用很棒的 Extensionizr 生成了我的包，这是我的 manifest.json :

manifest.json

{
  "name": "My app",
  "version": "0.0.1",
  "manifest_version": 2,
  "description": "My awesome app",
  "homepage_url": "http://myapp.com",
  "icons": {
    "16": "icons/icon16.png",
    "48": "icons/icon48.png",
    "128": "icons/icon128.png"
  },
  "default_locale": "en",
  "background": {
    "scripts": [
      "src/bg/background.js"
    ],
    "persistent": false
  },
  "permissions": [
    "tabs",
    "http://myapp.com/*"
  ]
}

我的background.js来自this answer，问题好像很相似

background.js

chrome.browserAction.onClicked.addListener(function(activeTab) {
  var newURL = "http://myapp.com";
  chrome.tabs.create({ url: newURL });
});

当我尝试从扩展设置运行背景页面时，我仍然收到此错误：Uncaught TypeError: Cannot read property 'onClicked' of undefined

当我打开一个新标签时，Google Chrome 趁机向我展示了一个 google 搜索页面。

我做错了，我也不知道how/where/why

Answer 1

那是因为您需要在清单中注册浏览器操作。这是您的清单，底部添加了浏览器操作。

{
  "name": "My app",
  "version": "0.0.1",
  "manifest_version": 2,
  "description": "My awesome app",
  "homepage_url": "http://myapp.com",
  "icons": {
    "16": "icons/icon16.png",
    "48": "icons/icon48.png",
    "128": "icons/icon128.png"
  },
  "default_locale": "en",
  "background": {
    "scripts": [
      "src/bg/background.js"
    ],
    "persistent": false
  },
  "permissions": [
    "tabs",
    "http://myapp.com/*"
  ],
  "browser_action": {}
}

以下是浏览器操作文档：https://developer.chrome.com/extensions/browserAction

Answer 2

你完全偏离了轨道。你不想打开一个（简单的）新标签，你想替换 "New Tab page".
正确解释了为什么您的代码不起作用，但它不会执行您想要的操作。

要替换Chrome的新标签页，您需要使用Override Pages:

  "chrome_url_overrides" : {
    "newtab": "myPage.html"
  },

在 myPage.html 中，您可以为远程内容添加 <iframe>。

简单 Chrome 扩展：在新选项卡中打开 url

Simple Chrome Extension : Open an url in a new tab

google-chrome-extension