首页 文章

如何在Electron中使用<webview>方法

提问于
浏览 次
5

在Electron <webview> documentation上有一个可以与对象一起使用的方法列表 . 当我尝试运行任何方法时，它们都不起作用 . 当我查看检查器中 <webview> 元素的属性时，它说它的原型是 webview . （ __proto__ : webview ）

正是在那个存储所有方法的原型中 . 因此，当我使用这些方法时，我的元素基本上应该从它的原型继承那些方法（例如 myWebview.openDevTools() ） .

然而！当我使用 Object.getProptotypeOf(myWebview) 时，我得到 HTMLElement ，而不是 webview ，就像它在检查员中显示的那样 .

以下是我的代码示例：

<webview id="myWebview" src="path/to.file"></webview>

<script> 
  var myWebview = document.getElementById('myWebview');
  console.log("myWebview: ",myWebview);
  console.log("prototype: ",Object.getPrototypeOf(myWebview)); //=> HTMLElement
  myWebview.openDevTools();
</script>
javascript node.js chromium electron

2 回答

  • 2

    webview的文档说：

    如果要以任何方式控制来宾内容，可以编写侦听webview事件的JavaScript并使用webview方法响应这些事件 .

    通过使用以下代码，我可以在webview上调用openDevTools：

    <script> 
  var myWebview = document.getElementById('myWebview');
  myWebview.addEventListener("did-start-loading", function (e) {
    myWebview.openDevTools();      
  });
  </script>

    我猜这些方法不会立即应用于webview . 我尝试在document.readystate ==“complete”上访问它们但它们仍然不可用 . 希望绑定到上面的事件将为您提供所需的功能 .

    回复于
  • 7

    我发现了这个问题，并在Electron Documentation中添加了一个示例

    最重要的是，您需要向webview添加一个侦听器，该侦听器在webview元素准备就绪时进行侦听：

    webview.addEventListener("dom-ready", function(){
  webview.openDevTools();
});

    根据@Shwany的说法，当 did-start-loading 事件被触发时，webview的方法将可用，但是最好等到webview元素完全准备好使用 dom-ready

    有关更详细的说明：

    当窗口最初呈现DOM时，webview方法不可用 . 最初， <webview> 元素的原型仍然是通用 HTMLElement .

    它在页面呈现 <webview> 元素开始加载之后，然后将其原型更改为webview原型（与元素同名） . 当它获得对webview原型的访问权限时，它可以访问所有webview原型方法 .

    回复于

相关问题