html2canvas - How To Copy Canvas As Image To Clipboard Using Javascript Programmatically - Stack Overflow

admin管理员组

文章数量:1403343

I already use html2canvas.js to take a screenshot of a specific div, now I wonder if I could use js to copy the canvas element as an image to clipboard, then user can just click to have an image of what they want on their clipboard, all they need to do is just paste it.

Codepen Demo

I already use html2canvas.js to take a screenshot of a specific div, now I wonder if I could use js to copy the canvas element as an image to clipboard, then user can just click to have an image of what they want on their clipboard, all they need to do is just paste it.

Codepen Demo

• javascript
• html2canvas

Share Improve this question Follow asked Oct 27, 2016 at 7:03 AlessiaAlessia 9691111 silver badges1616 bronze badges

Add a ment  | 

1 Answer 1

Sorted by: Reset to default 6

It work only on https or 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
              });
          });
        });
      }

本文标签： html2canvasHow To Copy Canvas As Image To Clipboard Using Javascript ProgrammaticallyStack Overflow