微信小程序上傳圖片并等比列壓縮到指定大小的實例代碼

發(fā)布時間：2020-09-26 14:01:06 來源：腳本之家閱讀：570 作者：騎摩托敲代碼欄目：web開發(fā)

微信小程序官方API中 wx.chooseImage() 是可以進行圖片壓縮的，可惜的是不能壓縮到指定大小。

實際開發(fā)中需求可能是壓縮到指定大?。?/p>

原生js可以使用canvas來壓縮，但由于微信小程序?qū)anvas有封裝，使得利用canvas來壓縮圖片有了一些區(qū)別：

代碼放在了git:https://github.com/jonyellow/code-diary/tree/master/%E5%B0%8F%E7%A8%8B%E5%BA%8F/%E5%9B%BE%E7%89%87%E5%8E%8B%E7%BC%A9

直接上代碼：

微信小程序上傳圖片并等比列壓縮到指定大小的實例代碼

主函數(shù)：

微信小程序上傳圖片并等比列壓縮到指定大小的實例代碼

以上的三個函數(shù)可以寫在一個公共的js文件里面我是寫在 common.js中的:

html:

微信小程序上傳圖片并等比列壓縮到指定大小的實例代碼

在html中需要添加個canvas標(biāo)簽，一般這個標(biāo)簽不讓他出現(xiàn)在頁面中，因為它的作用僅僅是壓縮圖片的工具：

<canvas class="canvas" canvas-id="canvas" :></canvas>

在methods中增加chooseImg方法：

微信小程序上傳圖片并等比列壓縮到指定大小的實例代碼

代碼在實際項目中使用，能完成壓縮圖片到指定大小的需求。

總結(jié)

以上所述是小編給大家介紹的微信小程序上傳圖片并等比列壓縮到指定大小的實例代碼,希望對大家有所幫助，如果大家有任何疑問請給我留言，小編會及時回復(fù)大家的。在此也非常感謝大家對億速云網(wǎng)站的支持！
如果你覺得本文對你有幫助，歡迎轉(zhuǎn)載，煩請注明出處，謝謝！

向AI問一下細(xì)節(jié)

猜你喜歡