document body style min height 200px function loadimagefromfile let ip document createElement input ip type file ip onchange console log ip ip let selFile ip files 0 console log selFile selFile let reader new FileReader reader onload re let img document createElement img document body appendChild img img src re target result reader readAsDataURL selFile ip click let but document createElement button document body appendChild but but innerHTML Load Image from File but onclick loadimagefromfile console log ready document body style min height 200px async function loadimagefromclipboard try const clipboardItems await navigator clipboard read let blobOutput null try blobOutput await clipboardItems 0 getType image png catch e if the clibpoard contains a url to an image e g https cat com cat jpg if blobOutput null try let textBlob await clipboardItems 0 getType text plain const textUrl await new Response textBlob text if textUrl indexOf https 0 textUrl indexOf textUrl 0 console log valid http address const response await fetch textUrl blobOutput await response blob catch e if blobOutput null new Throw convert to base64 const reader new FileReader reader onloadend const src reader result console log reader result data type base64 wL2dvYWwgbW9yZ let img document createElement img document body appendChild img img src src reader readAsDataURL blobOutput catch err console log no image in the clipboard let but document createElement button document body appendChild but but innerHTML Load Image from Clipboard but onclick loadimagefromclipboard console log ready
if blobOutput null try let textBlob await clipboardItems 0 getType text plain const textUrl await new Response textBlob text if textUrl indexOf https 0 textUrl indexOf textUrl 0 console log valid http address const response await fetch textUrl blobOutput await response blob catch e if blobOutput null new Throw convert to base64 const reader new FileReader reader onloadend const src reader result console log reader result data type base64 wL2dvYWwgbW9yZ let img document createElement img document body appendChild img img src src reader readAsDataURL blobOutput catch err console log no image in the clipboard let but document createElement button document body appendChild but but innerHTML Load Image from Clipboard but onclick loadimagefromclipboard console log ready