1. 首頁
  2. 問答
  3. 上傳前壓縮客戶端圖像

上傳前壓縮客戶端圖像

2011-04-09 140 views
25

有誰知道任何免費的腳本，儘可能壓縮JPG，GIF和PNG文件？上傳前壓縮客戶端圖像

來源

2011-04-09 xtremist

+4

所有這三個都是壓縮格式。進一步壓縮現有的圖像會導致質量損失。 – Charles 2011-04-09 19:45:06

+0

你對這個「smushit.com」有什麼評價？ – xtremist 2011-04-09 20:07:20

+0

@Charles不一定，大多數人都懶惰地壓縮他們的圖像。所以無損壓縮可能會大大減少大多數圖像的大小。 – 2017-05-02 11:34:51

回答

4

我在這裏讀到一個實驗：http://webreflection.blogspot.com/2010/12/100-client-side-image-resizing.html

的理論是，你可以用帆布上傳之前調整客戶端上的圖像。原型示例似乎只適用於最近的瀏覽器，雖然有趣的想法...

但是，我不確定使用畫布壓縮圖像，但您可以調整它們的大小。

來源

2011-04-09 19:47:26 David

+0

由我需要類似smushit.com – xtremist 2011-04-09 20:13:03

+0

我不認爲你可以在客戶端複製Smushit。 – David 2011-04-09 20:22:43

+0

$ mush-it => $ mu- $ hit。哈哈，我讓自己傷心使用jQuery ..... – 2017-05-02 11:37:45

51

我只是開發了一個名爲JIC來解決這個問題一個JavaScript庫。它允許你在客戶端壓縮jpg和png 100％，並且不需要外部庫！

你可以在這裏嘗試演示：http://makeitsolutions.com/labs/jic 這裏獲得來源：https://github.com/brunobar79/J-I-C

希望你喜歡它。

來源

2012-03-30 20:00:43 brunobar79

+1

沒辦法解壓縮回來？ – RWendi 2013-08-27 06:34:01

+17

您應該能夠通過簡單地調整圖像的大小來解壓縮它。你可能需要下載更多的ram才能做到這一點。 – Dan 2014-03-09 22:53:25

+0

@ brunobar79可以將圖像導出爲JavaScript Blob，以便我們可以在不使用PHP的情況下上傳圖像？ – 2015-11-19 23:10:46

4

我遲到了，但這個解決方案對我來說工作得非常好。基於this library，您可以使用此LIK一個功能 - 設置圖像質量，最大寬度，和輸出格式（JEPG，PNG）：

function compress(source_img_obj, quality, maxWidth, output_format){ 
    var mime_type = "image/jpeg"; 
    if(typeof output_format !== "undefined" && output_format=="png"){ 
     mime_type = "image/png"; 
    } 

    maxWidth = maxWidth || 1000; 
    var natW = source_img_obj.naturalWidth; 
    var natH = source_img_obj.naturalHeight; 
    var ratio = natH/natW; 
    if (natW > maxWidth) { 
     natW = maxWidth; 
     natH = ratio * maxWidth; 
    } 

    var cvs = document.createElement('canvas'); 
    cvs.width = natW; 
    cvs.height = natH; 

    var ctx = cvs.getContext("2d").drawImage(source_img_obj, 0, 0, natW, natH); 
    var newImageData = cvs.toDataURL(mime_type, quality/100); 
    var result_image_obj = new Image(); 
    result_image_obj.src = newImageData; 
    return result_image_obj; 
}

來源

2016-06-01 21:51:10 user1791914

3

如果你正在尋找一個庫，進行客戶端 - 側面圖像壓縮，你可以檢查一下：compress.js。這基本上可以幫助您純粹用JavaScript壓縮多個圖像並將它們轉換爲base64字符串。您可以選擇以MB爲單位設置最大尺寸以及首選的圖像質量。

來源

2016-12-19 09:41:51 alextanhongpin

相關問題

 相關問題