图片转base64码

HTML5强大的FileReader对象

canvas的toDataURL方法

 

 /*转换函数*/  

function startt() {  

var imgFile = new FileReader();  

        imgFile.readAsDataURL(img.files[0]);  

        imgFile.onload = function () {  

var imgData = this.result; //base64数据    

            imgShow.setAttribute('src', imgData);  

            conte.value = imgData;  

            len.innerHTML += imgData.length;  

        }  

    }  

 

利用canvas 将图片转化为base64 编码格式

var canvas = document.createElement("canvas");
var ctx = canvas.getContext('2d'),
   img = new Image;
   img.src="./vheider.jpg";
 //  img.setAttribute('crossOrigin', 'anonymous')  // 图片跨域时有用
   img.onload = function(){
       canvas.height = img.height;
       canvas.width = img.width;
       ctx.drawImage(img,0,0);
       dataURL =canvas.toDataURL("image/jpeg");

        $('#img').attr('src', dataURL);
        console.log(canvas.toDataURL("image/jpeg"))

  };
posted @ 2018-02-22 09:55  沐少白  阅读(125)  评论(0)    收藏  举报