如何访问 <webview> 的 DOM在电子?

问题描述

我刚刚开始使用 Electron，之前有使用 node-webkit (nw.js) 的经验.

I'm just getting started with Electron, with prior experience with node-webkit (nw.js).

在 nw.js 中，我能够创建 iframe，然后访问所述 iframe 的 DOM，以获取标题、favicon 等内容.几天前，当我拿起 Electron 将我的 nw.js 应用程序移植到它时，我看到了使用 webviews 而不是 iframes 的建议，仅仅是因为它们更好.现在，我上面提到的功能在 nw.js 中相对容易实现，但我不知道如何在 Electron 中实现(示例很少).有人可以帮忙吗?

In nw.js, I was able to create iframes and then access the DOM of said iframe in order to grab things like the title, favicon, &c. When I picked up Electron a few days ago to port my nw.js app to it, I saw advice to use webviews instead of iframes, simply because they were better. Now, the functionality I mentioned above was relatively easy to do in nw.js, but I don't know how to do it in Electron (and examples are slim to none). Can anyone help?

另外，我的 webview 有后退/前进按钮(我打算有多个).我在文档中看到我可以在 webview 上调用函数来执行此操作，但我尝试过的也没有任何效果(而且，我还没有找到在野外使用它们的示例).

Also, I have back/forward buttons for my webview (and I intend on having more than one). I saw in the documentation that I could call functions for doing so on a webview, but nothing I have tried worked either (and, I haven't found examples of them being used in the wild).

推荐答案

除了 guest 以 NetOperatorWibby，从主人到客人也非常有用.目前唯一的方法是使用 <webview>.executeJavaScript(code, userGesture).这个 api 有点粗，但是可以.

Besides guest to host IPC calls as NetOperatorWibby, it is also very useful to go from host to guest. The only way to do this at present is to use the <webview>.executeJavaScript(code, userGesture). This api is a bit crude but it works.

如果您正在使用远程访客，例如扩展"第三方网页，您还可以使用 webview preload 属性，它会在页面上运行任何其他脚本之前执行您的自定义脚本.请注意，出于安全原因，preload api 将在您的自定义脚本完成时核对在自定义 JS 文件的根命名空间中创建的任何函数，但是此托管过程不会核对您在根中声明的任何对象.因此，如果您希望自定义函数保持不变，请将它们捆绑到一个单例对象中，您的自定义 API 将在页面完全加载后保持不变.

If you are working with a remote guest, like "extending" a third party web page, you can also utilize webview preload attribute which executes your custom script before any other scripts are run on the page. Just note that the preload api, for security reasons, will nuke any functions that are created in the root namespace of your custom JS file when your custom script finishes, however this custodial process will not nuke any objects you declare in the root. So if you want your custom functions to persist, bundle them into a singleton object and your custom APIs will persist after the page fully loads.

[update] 这是一个我刚刚写完的简单示例:Electron-Webview-Host-to-Guest-RPC-Sample

[update] Here is a simple example that I just finished writing: Electron-Webview-Host-to-Guest-RPC-Sample

这篇关于如何访问 &lt;webview&gt; 的 DOM在电子?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持跟版网！