如何以编程方式使用Javascript将画布作为图像复制到剪贴板

Question

我已经使用html2canvas.js截取特定div的屏幕截图，现在我想知道我是否可以使用js将canvas元素作为图像复制到剪贴板，然后用户只需点击即可他们想要在他们的剪贴板上的图像，他们需要做的就是粘贴它。

Codepen Demo

Answer 1

仅适用于https或localhost：

    function getScreenShot(Src){
        let src = document.getElementById(Src);
        html2canvas(src).then(function(canvas) {
          document.getElementById("explain-scr").appendChild(canvas);
          canvas.toBlob(function(blob) {
            navigator.clipboard
              .write([
                new ClipboardItem(
                  Object.defineProperty({}, blob.type, {
                    value: blob,
                    enumerable: true
                  })
                )
              ])
              .then(function() {
                  // do something
              });
          });
        });
      }