将图片(路径)转换为Base64 和 将base64转换为file类型

简介: 将图片(路径)转换为Base64 和 将base64转换为file类型


var image={
    /* 将图片(路径)转换为Base64 */
    getBase64FromImageURL(url, callback) {
        let suffix = url.split('.').slice(-1)[0];//扩展名 
        var canvas = document.createElement('canvas'),
            ctx = canvas.getContext('2d'),
            img = new Image;
        img.crossOrigin = 'Anonymous';
        img.src = url;
        img.onload = function () {
            canvas.height = img.height;
            canvas.width = img.width;
            ctx.drawImage(img, 0, 0);
            var base64URL = canvas.toDataURL(`image/${suffix || 'png'}`);
            callback(base64URL);
            canvas = null;
        };
    },
    /* 将base64转换为file类型 */
    getFileFromBase64(base64, filename) {
        var arr = base64.split(','),
            mime = arr[0].match(/:(.*?);/)[1],
            bstr = atob(arr[1]),
            n = bstr.length,
            u8arr = new Uint8Array(n);
        while (n--) {
            u8arr[n] = bstr.charCodeAt(n);
        }
        return new File([u8arr], filename, { type: mime });
    }
}
/* 测试用例 */
image.getBase64FromImageURL('1.png', (base64URL)=> {
    console.log(base64URL);
    var imgURL = image.getFileFromBase64(base64URL, 'imgName');
    console.log(imgURL);
});


相关文章
|
8月前
|
存储 编解码
如何将BDMV文件转换为MKV或MP4?
许多拥有蓝光光驱的用户可能在电脑上存储了一些BDMV文件。虽然这些文件提供了高质量的视频和音频,但由于其文件格式的限制,它们可能无法在某些设备上播放。因此,将BDMV文件转换为常见的MKV或MP4文件就变得非常重要。本文将介绍一种简单而有效的方法来完成这个转换过程。
1204 2
|
开发者
处理base64图片数据的方式
处理base64图片数据的方式
139 4
|
前端开发 API
图片或文件Blob、File、Base64之间的相互转换
在做前端项目的时候,遇到图片的上传或者下载时,不可避免的会遇到Blob、File、Base64三种类型的转换。那么今天就总结下,三者之间的相互转换。 首先我们看看base64 ,File 对象,Blob 对象长什么样的,怎么来的。
541 1
|
人工智能 Java 对象存储
Java获取阿里云图片临时URL与图片文件转换Base64编码方法
在使用阿里云人工智能产品服务时,有部分服务需要上传的参数中包含文件URL,当我们没有开通OSS服务时,可以使用临时URL服务、或部分服务支持Base64编码格式,此文章为生成临时URL-JavaSDK方案与图片文件转换Base64编码方案。
2056 0
|
6月前
|
JavaScript
Base64如何切割后面的内容,如何提取data:image/png;base64,之后的内容,Vue中.split中截取的数组如何使用数组进行获取
Base64如何切割后面的内容,如何提取data:image/png;base64,之后的内容,Vue中.split中截取的数组如何使用数组进行获取
|
8月前
|
存储 前端开发 JavaScript
前端base64转file文件方法
前端base64转file文件方法
729 0
后端返回的base64流形式的图片,怎么放在src中
后端返回的base64流形式的图片,怎么放在src中
187 0
.NET指定图片地址下载并转换Base64字符串
.NET指定图片地址下载并转换Base64字符串
161 0
图片转base64 并根据格式加前缀
图片转base64 并根据格式加前缀
441 0
|
数据安全/隐私保护
批量注册图片,可以根据需要修改data,base64编码
批量注册图片,可以根据需要修改data,base64编码
139 0

热门文章

最新文章