看了下，距離上次發帖都是去年10月份的事，忙於工作的我很少跑博客園里面來玩了。
做這個小網站的初衷是 https://tinypng.com/ 這個網站有時候訪問很慢，然后自己去研究了下圖片壓縮。
網上有看到 https://tinypng.com/ 中使用的 pngquant , 我去下載了pngquant的cli看了下，然后就開始了這個小網站的基礎。
先看看前端頁面：
這個功能還會擴建，所以現在界面只有簡潔的一部分。
現在的功能基本上只有圖片壓縮和打包下載，
前端頁面用到的： vue、webuploader、jq、layer、jszip
后端：express、co、md5、imagemin
才開始的時候使用的是純pngquant-lib操作，雖然成功了，但是只能壓縮png圖片，所以拋棄了，去npmjs網站看了下，最后決定壓縮直接用imagmin 前人栽樹后人乘涼嘛。
整個流程邏輯，簡單說就是：上傳-壓縮-打包
下面我就分步來說說處理的內容；
1. 上傳
這里的上傳使用的百度webuploader插件，用習慣了。
上傳只做的對圖片的驗證，其它的沒處理，比如文件大小什么的，所以大文件上傳估計會有問題。
在用戶打開頁面的時候會分配一個目錄用於保存上傳的圖片和壓縮圖片，其主要作用就是保存當前上傳信息，后期擴展會用到，現在沒什么大用處，主要作用可以避免用戶上傳圖片不會出現沖突的情況。
2. 壓縮
壓縮使用的是：imagemin 寫這個的是真大神 現在圖片外流的圖片壓縮算法基本上都有他的影子 膜拜，不廢話了
對imagemin進行一個簡單的包裝，方面項目內部使用
成功壓縮后返回壓縮后的圖片大小、名稱和base64數據
3. 打包：使用的是jszip在前端打包，本來想在后端打包，但是考慮到性能問題，打包就交給前端了，前端也沒考慮瀏覽器兼容，
數據返回后，把接受到的數據放到zip里面去，然后就可以等待用戶下載了。
遇到的問題：
1. imagemin中
imageminMozjpeg壓縮配置：
2. jszip壓縮，不需要 data:image/png;base64, 這個字符串，但是為了前端預覽壓縮后的文件，我在后端添加了這段文件頭
開始搗鼓了半天，只知道報錯，
最后打開jszip.js里面才看到
需要把base64頭部的文件信息去掉，然后手動解決
最后總算搞定了。
這個壓縮工具也算不錯，不過什么都壓縮，但是只有圖片會進行處理，如果是其它文件它只會移動了文件而不壓縮，即便是改變后綴也不會壓縮。
我測試了100多張jpg圖片，基本能壓縮65%左右，不過不知道什么原因，壓縮后用qq的圖片瀏覽器看到居然有問題，其它的地方看到都沒問題
最后附上github地址：https://github.com/zoeDylan/z_img