美文网首页
Electron截图功能(webview)

Electron截图功能(webview)

作者: 我叫Aliya但是被占用了 | 来源:发表于2020-09-10 20:05 被阅读0次

使用html2canvas遇到webview容易有跨域问题,所以使用原生capturePage方法

      remote
        .getCurrentWindow()
        .capturePage({ x: 0, y: 0, width: window.innerWidth, height: window.innerHeight })
        .then((res: NativeImage) => {
          const image = new Image();
          image.src = res.toDataURL();  // base64
          image.onload = () => {
            const canvas = document.createElement('canvas');
            canvas.width = image.naturalWidth;
            canvas.height = image.naturalHeight;
            // 不加这两句图片会被放大
            canvas.style.width = `${canvas.width / window.devicePixelRatio}px`;
            canvas.style.height = `${canvas.height / window.devicePixelRatio}px`;
            canvas.getContext('2d')!.drawImage(image, 0, 0);
            // canvas正常可用
          };
        })
        .catch((err) => console.log(err));

相关文章

网友评论

      本文标题:Electron截图功能(webview)

      本文链接:https://www.haomeiwen.com/subject/difmektx.html