html base64 js再压缩,js获取图片的base64编码并压缩

获取图片的base64编码

　　　　　

function $_(id) {

return document.getElementById(id);

}

function gen_base64() {

var file = $_('upload_file').files[0];

r = new FileReader(); //本地预览

r.onload = function(){

$_('base64_output').value = r.result;

$_('myImg').src= r.result;

}

r.readAsDataURL(file); //Base64

}

案例2：js压缩图片

function getUrl(fil) {

var Cnv = document.getElementById('myCanvas');

var Cntx = Cnv.getContext('2d');//获取2d编辑容器

var imgss = new Image();//创建一个图片

var agoimg=document.getElementById("ago");

for (var intI = 0; intI < fil.length; intI++) {//图片回显

var tmpFile = fil[intI];

var reader = new FileReader();

reader.readAsDataURL(tmpFile);

reader.onload = function (e) {

url = e.target.result;

imgss.src = url;

agoimg.src=url;

agoimg.onload = function () {

//等比缩放

var m = imgss.height / imgss.width;

Cnv.width = 300 ;//该值影响缩放后图片的大小

Cnv.height =300*m;

//img放入画布中

Cntx.drawImage(agoimg, 0, 0,300,300*m);

//把画布中的数据，写出到某img的src里

var Pic = document.getElementById("myCanvas").toDataURL("image/png");

var imgs =document.getElementById("press");

imgs.src =Pic ;

}

}

}

}

old img::

new img::

效果图

以上就是js获取图片的base64编码并压缩的详细内容，更多关于js 图片base64编码的资料请关注脚本之家其它相关文章！