Unggah file gambar: apakah kompresi di sisi klien sudah dimungkinkan?

Saat menawarkan pengunggahan file foto, biasanya pengguna akan memiliki file JPEG yang sangat padat dan besar (10+ megapiksel) dari kamera atau ponsel mereka. Di sisi server, file-file ini akan dikompres ulang menjadi sesuatu seperti 800x600px dan kualitas JPEG 7 atau 8.

Apakah mungkin untuk melakukan kompresi ulang di sisi klien? Sehingga saya hanya perlu mentransmisikan 100kB (800x600px) dan bukan 3 MB atau lebih. Sesuatu seperti:

(1) Dengan FileSystem API API baru ( http://slides.html5rocks.com/#filewriter ), dimungkinkan untuk membaca data file foto ke JS sisi klien.

(2) Maka akan diperlukan untuk menyandikan ulang data JPEG, yang mungkin, tapi saya tidak bisa menemukan perpustakaan untuk itu (belum). Adakah yang tahu perpustakaan seperti itu?

(3) Langkah terakhir adalah POST data JPEG yang dikompres ulang ke sisi server untuk penyimpanan dan dapatkan URL ke file foto yang disimpan kembali dari server untuk dimasukkan ke dalam HTML klien.

Saya mencari beberapa plugin jQuery, perpustakaan JS lainnya atau contoh halaman web yang melakukan ini.

Plupload mendukung pengubahan ukuran html5 gambar dan kemudian mengunggahnya, ia juga memiliki cadangan untuk browser yang tidak didukung ( batuk IE ) di Flash, Silverlight (dan hal-hal kuno seperti Google Gears dan BrowserPlus).

Anda dapat memuat gambar ke elemen kanvas, mengubah ukurannya dan kemudian mengambil kembali gambar untuk mengunggahnya.

Lihat demo ini: http://makeitsolutions.com/labs/jic

Ini perpustakaan javascript yang dibuat oleh saya yang memecahkan masalah itu.

Hal ini memungkinkan Anda untuk mengompresi jpg dan png di sisi klien 100% dengan javascript dan tidak ada perpustakaan eksternal yang diperlukan!