如何在我的电子应用程序中添加自定义的Chrome扩展程序？

Question

我在向我的Electron BrowserWindow添加chrome插件时遇到了一些麻烦。

在创建窗口之前（ready事件触发后），我尝试添加浏览器需要进行屏幕共享的devtools扩展。

BrowserWindow.addDevToolsExtension('/home/USER/.config/chromium/Default/Extensions/dkjdkjlcilokfaigbckcipicchgoazeg/1.5_0');

我遵循了《电子指南》，并为他们的示例工作（添加了react开发工具）。当我使用自己的chrome扩展名执行完全相同的操作时，出现此错误：

[4735:1116/163422.268391:ERROR:CONSOLE(7701)] "Skipping extension with invalid URL: chrome-extension://extension-name", source: chrome-devtools://devtools/bundled/shell.js (7701)

我真的不明白为什么指定的错误是“无效的URL”，因为我正在使用React Addon做完全相同的事情/过程，而没有任何问题。我也不知道该怎么办。我的铬插件是否可能与电子不兼容？

Answer 1

您似乎正在尝试添加常规 Chrome 扩展程序而不是开发工具扩展程序。

该BrowserWindow.addExtension(path)方法适用于常规 Chrome 扩展程序：

BrowserWindow.addExtension(path)

• path 细绳

添加位于 的Chrome 扩展程序path，并返回扩展程序的名称。

如果扩展的清单丢失或不完整，该方法也不会返回。

注意：在发出模块ready事件之前不能调用此 API app。

^{- https://electronjs.org/docs/api/browser-window#browserwindowaddextensionpath}

相反，该BrowserWindow.addDevToolsExtension(path)方法用于开发工具扩展：

BrowserWindow.addDevToolsExtension(path)

• path 细绳

添加位于 的DevTools 扩展path，并返回扩展的名称。

扩展会被记住，所以你只需要调用一次这个 API，这个 API 不是为了编程使用。如果您尝试添加已加载的扩展，则此方法不会返回，而是将警告记录到控制台。

如果扩展的清单丢失或不完整，该方法也不会返回。

注意：在发出模块ready事件之前不能调用此 API app。

^{- https://electronjs.org/docs/api/browser-window#browserwindowadddevtoolsextensionpath}

请注意，在这两种情况下，您都需要等待ready来自app模块的事件被发出：

const { BrowserWindow, app } = require('electron')

let mainWindow = null

function main() {
  BrowserWindow.addExtension('/path/to/extension')
  mainWindow = new BrowserWindow()
  mainWindow.loadURL('https://google.com')
  mainWindow.on('close', event => {
    mainWindow = null
  })
}

app.on('ready', main)

Answer 2

目前正在积极支持 Electron 中的 Chromium 扩展。支持尚未完成，但GitHub 问题似乎定期发布更新。

手指交叉！

当前的拉取请求是为“刚好足够的扩展 [api] 加载一个简单的......扩展”开放的

Answer 3

Electron 9 对扩展提供了更多支持！

\n\n

要加载它们，请使用session.loadExtension：https ://github.com/electron/electron/blob/master/docs/api/extensions.md

\n\n

const { app, BrowserWindow, session } = require(\'electron\')\n\n// ... in your createWindow function, which is called after app.whenReady\n\nconst mainWindow = new BrowserWindow({...})\n\nconst ext = await session.defaultSession.loadExtension(\'/path/to/unpacked/chrome-ext\')\n\nconsole.log(\'ext\', ext)\n// outputs config file\n// {\n//   id: \'dcpdbjjnmhhlnlbibpeeiambicbbndim\',\n//   name: \'Up! \xe2\x80\x93 Free Social Bot\',\n//   path: \'/Users/caffeinum/Development/GramUp/chrome-ext\',\n//   url: \'chrome-extension://dcpdbjjnmhhlnlbibpeeiambicbbndim/\',\n//   version: \'1.7.0\',\n//   manifest: { ... }\n// }\n\n\n

\n\n

阅读更多：https ://github.com/electron/electron/blob/master/docs/api/extensions.md

\n\n

另外，还有另一个项目可以帮助您做到这一点，还添加了附加功能： https: //github.com/sentialx/electron-extensions

\n