electron - 如何在Electron中显示NativeImage-6ren

electron - 如何在Electron中显示NativeImage

转载作者：行者123 更新时间：2023-12-03 12:21:11

我有一个 Electron WebView。我想截取其内容的屏幕快照，并将其显示在我的应用程序中的某个位置。

我尝试使用 webview.capturePage 方法，该方法返回Native Image。

如何将图像添加到DOM并显示在我的应用程序上？我不确定如何转换。

最佳答案

您可以为此使用 image.toDataURL (如@Mikaeru所建议的)。

<html>
  <body>
    <webview id="view" src="https://www.github.com/" style="width:320px; height:240px">
    </webview>
    <button id="capture">Capture</button>
    <img id="show" src="" />
    <script>
      const wv = document.getElementById('view')
      const b = document.getElementById('capture')
      const i = document.getElementById('show')
      b.addEventListener('click', () => {
        wv.capturePage((img) => {
          i.src = img.toDataURL()
        })
      })
    </script>
  </body>
</html>