js壓縮圖片base64長度


 1 var myCanvas=$('.img-container > img').cropper('getCroppedCanvas');
 2 (function (base64){
 3     var image = new Image(),newBase64,MAX_HEIGHT = 160;
 4     image.onload = function(){
 5         var canvas = document.getElementById("myCanvas");
 6         if(image.height > MAX_HEIGHT) {
 7             image.width *= MAX_HEIGHT / image.height;
 8             image.height = MAX_HEIGHT;
 9         }
10         var ctx = canvas.getContext("2d");
11         ctx.clearRect(0, 0, canvas.width, canvas.height);
12         canvas.width = image.width;
13         canvas.height = image.height;
14         ctx.drawImage(image, 0, 0, image.width, image.height);
15         newBase64=canvas.toDataURL('image/jpeg',0.4);
      //上傳base64編碼
16 $.ajax({ 17 type: "post", 18 url: '地址', 19 data: { 20 21 }, 22 success: function (msg) { 23 42 }, 43 error: function (msg) { 44 tips.error('上傳圖片服務出錯,請稍候再試。') 45 } 46 }); 47 console.log('base64Size',newBase64.length/1024);50 }; 51 image.src = base64; 52 })(myCanvas.toDataURL('image/jpeg'));

 js壓縮圖片base64長度,不適於與高質量圖片;

通過原base64編碼在canvas中繪制新圖片,並取出canvas使用toDataUrl方法得到新的base64;

繪制圖片時通過改變原圖片大小和toDataUrl中參數控制圖片質量


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM