javascript - 我可以从代码启动 Chrome 扩展 API 吗？

Question

是否可以在网站内启动 Google Chrome 扩展程序？例如，运行一些将启动扩展 UI 的 javascript？

我正在构建一个网络应用程序，允许用户截取他们的桌面屏幕截图并进行编辑。我已经使用 dektopCapture 启动并运行了一个示例扩展但它是一种“应用”风格的扩展。

• 它允许选择一个流媒体窗口，然后取一个扩展 UI 中的快照(使用按钮)保存为图像字符串

---

我的问题是:

是否可以从我的网络应用程序中启动 desktopCapture UI(从中获取可用窗口的窗口)，也许是一个按钮，获取流并将其放置在 canvas/HTML5 视频元素上我的网络应用程序？

我想我可以在扩展中连接一个事件监听器并使用 runtime.onMessage从我的应用程序中发布消息

注意事项:

如果有更直观的方法来做到这一点，我可以走那条路 - 例如，如果我可以在网络应用程序中保持尽可能多的交互，而只在后台运行扩展程序，那将变得更好。

扩展是 browser_action 类型，但我希望它适用于单个页面(应用程序的网页)所以如果它可以在 page_action 中使用我'相反，我更喜欢那个。如果我可以从网页中触发它，那么真的不需要有 browser_action 图标

我还计划构建一个 FF 扩展，因此也欢迎任何见解。

Answer 1

所以我正在回答我自己的问题。

我已经设法使用 externally_connectables 让它工作了.

The externally_connectable manifest property declares which extensions, apps, and web pages can connect to your extension via runtime.connect and runtime.sendMessage.

1。在manifest.json中声明app/webpage

只需在 manifest.json 中将您的网络应用程序/页面声明为 externally_connectable。

例如，我想连接我的应用托管在 Github Pages 上，我的域名是 https://nicholaswmin.github.io ，所以它有点像这样:

"externally_connectable": {
  "matches": ["https://nicholaswmin.github.io/*"]
}, //rest of manifest.json

2。在background.js中为消息设置事件监听器

然后在您的 background.js 中设置一个事件监听器，如下所示:

chrome.runtime.onMessageExternal.addListener(function(request, sender, sendResponse) {
 //Stuff you want to run goes here, even desktopCapture calls
});

3。从您的网页/应用程序页面发送消息

然后像这样从您的网络应用程序/网站中调用它:

chrome.runtime.sendMessage("APP ID GOES HERE", 
                       {data: { key : "capture"}});

确保您的网站在 manifest.json 中正确声明为 externally_connectable 并且您在发送消息时传递了应用程序 ID