JS将div转为图片，base64、Blob、File类型

最新推荐文章于 2024-05-22 16:05:37 发布

带刺玫瑰DCMG

最新推荐文章于 2024-05-22 16:05:37 发布

阅读量1.1k

点赞数

文章标签： javascript 前端开发语言

带刺玫瑰

本文链接：https://blog.csdn.net/qweeryyioop/article/details/130744054

版权

JS将div转为图片，base64、Blob、File类型

html2canvas(document.getElementById("preview"), {
        // width: 30, //截图宽度
        // height: 50, //截图高度
        backgroundColor: null, //画出来的图片有白色的边框,不要可设置背景为透明色（null）
        useCORS: true, //支持图片跨域
        scale: 1, //设置放大的倍数
    }).then((canvas) => {
        let url = canvas.toDataURL("image/png"); // toDataURL: 图片格式转成 base64
        let blob=toBlob(url);//封装toBlob方法，转为blob类型
        var file = new File([blob], "123", {type: "image/png", lastModified: Date.now()});//转为File类型
        let blobUrl=URL.createObjectURL(file);
        console.log(blob)
        console.log(file)
        console.log(blobUrl)

        // let a = document.createElement("a");
        // a.href=url;
        // a.download="123"
        // a.click();
    });