从电子网络视图中获取选定的文本

Question

如何从电子应用程序的 web 视图中获取选定的文本？ 我正在使用 Angular 和 Electron。所以我有一个有 webview 的组件：

<webview id="foo" attr.src={{activeUrl}} style="height: 600px"></webview>

这是我用来获取选定文本的：

let rightClickPosition = null;
const menu = new Menu();
const menuItem = new MenuItem({
  label: 'Get selected text',
  click: () => {
    // does not work for selected text in webview
    console.log(window.getSelection().toString());
  }
});
menu.append(menuItem);
window.addEventListener('contextmenu', (e) => {
  e.preventDefault();
  rightClickPosition = {x: e.x, y: e.y};
  menu.popup(remote.getCurrentWindow());
}, false);

问题：window.getSelection().toString() 不适用于 web 视图中的选定文本。它仅适用于 webview 之外的文本。

Answer 1

webView 是 Electron 中的一种特殊标签。正如文件 (https://electronjs.org/docs/api/webview-tag) 所说，Unlike an iframe, the webview runs in a separate process than your app. It doesn't have the same permissions as your web page and all interactions between your app and embedded content will be asynchronous.。

由于它是不同的过程并且不允许直接交互，因此您可以在 webview 和外框之间使用 ipc 进行通信。检查 Electron 的 ipc 是否建立。具体来说，您可能对 ipcRenderer.sendToHost 感兴趣，用于渲染器主机和 web 视图。