最近在移動端設計頭像上傳功能時，原本是以<input type="file">直接通過formData上傳，然而實際使用情況是：對于過大的圖片（高像素手機所拍攝的照片等）上傳時間過長會導致上傳失敗，而每次都上傳原始大小的圖片（后臺處理壓縮）十分影響用戶體驗，所以研究了一下通過canvas壓縮圖片并上傳的方法，以下是整理的一些思路和心得：

一、<input type="file">獲取本地圖片，并將圖片繪制到畫布中。此處的難點在于：由于瀏覽器的保護機制，無法直接獲取到本地文件的圖片路徑，所以需要將本地圖片編譯成base64格式再做上傳，代碼如下：

發表評論 共有條評論 用戶名: 密碼: 驗證碼: 匿名發表