使用浏览器视图在浏览器窗口上设置覆盖

Question

我正在执行一项任务，该任务要求在显示应用程序的现有浏览器窗口上放置一个叠加层。叠加层的目的是在特定点上画一些圆，在通过浏览器窗口加载的应用程序中放置了一些对象的特定点上（基本上，叠加层仅突出显示这些对象并提供删除选项）。

我的挑战是如何加载该叠加层以及它的外观：我想这将是一个我能够以某种方式（在浏览器视图中尚未弄清楚）加载的React组件。这个想法是通过ipc通信访问放置在应用程序上的对象。

我看到浏览器视图加载了一个url，但是我不确定如何在其中加载一个react组件（或者即使有可能这样做）。

另一个挑战是在加载应用程序后如何显示叠加层（通过使用设置范围和设置背景色，我看到显示了浏览器视图，然后加载了应用程序并将其放置在浏览器视图内容的顶部）

如果您可以提出其他方法来实现这种叠加效果，我愿意接受任何建议/建议。

谢谢。

Answer 1

只是一个建议。为什么不创建一个新的透明浏览器窗口并将其覆盖在当前窗口上。通过ipc在窗口之间共享叠加组件数据。

或者，如果可以的话，通过http共享电子应用程序中运行本地服务器的数据。我总是觉得这相对容易，因为您不必一直发送消息来同步数据。但这也有缺点。

Answer 2

我最终使用了loadUrl和preload js组合：我正在加载一个基本html文件，其div具有一个id，并且我在网络偏好设置中为浏览器视图指定了加载js文件的位置， html并创建将使用单击事件监听器填充它的对象。