实现图片复制到剪切板

export const imageCopy = async (url, that) => {

    try {

        var canvas = document.createElement('canvas')  //创建画布

        let img = new Image()  //创建一个 Image 对象

        img.setAttribute("crossOrigin", 'Anonymous') //跨越问题解决

        img.src = url //将 url 赋值给 img.src,相当于给浏览器缓存了一张图片

        img.onload = async () => {  // img加载完成

            canvas.width = img.width

            canvas.height = img.height

            canvas.getContext('2d').drawImage(img, 0, 0) //加载img到画布

            url = canvas.toDataURL('image/png')  //转换图片,格式为png

            //写入剪切板

            const image = await fetch(url)

            const blob = await image.blob()

            const item = new ClipboardItem({

                // 'text/plain': text,

                'image/png': blob

            })

            await navigator.clipboard.write([item])

        }

    } catch (e) {

        that.$message.error('浏览器版本过低不支持,请升级浏览器')

    }

}

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。