image图片转base64 js图片编码

最新推荐文章于 2024-10-09 21:27:45 发布

Chris__Wang

最新推荐文章于 2024-10-09 21:27:45 发布

阅读量615

点赞数

分类专栏：个人总结文章标签： vue中图片转为base64 图片编码 base64编码图片图片转二进制

本文链接：https://blog.csdn.net/Chris__wang/article/details/102917563

版权

个人总结专栏收录该内容

78 篇文章 1 订阅

订阅专栏

vue中将图片转为base64编码

methods:{
        handleSave(){//保存图片到本地
            var image = new Image(); 
            var base64 = '';
            image.src = document.getElementsByClassName('logo_pic')[0].src;
            this.getBase64Image(image.src,function(res){
                base64 = res
            })
        },
        getBase64Image(url, callback, outputFormat){//图片转base64编码
            var canvas = document.createElement('CANVAS'),
            ctx = canvas.getContext('2d'),
            img = new Image;
            img.crossOrigin = 'Anonymous';
            img.onload = function(){
                canvas.height = img.height;
                canvas.width = img.width;
                ctx.drawImage(img,0,0);
                var dataURL = canvas.toDataURL(outputFormat || 'image/png');
                callback.call(this, dataURL);
                canvas = null; 
            };
            img.src = url;
        },
        saveImageCallback(res){
            Toast('save success')
        }
    }

这里的图片路径不是相对路径