微信小程序上传图片并等比列压缩到指定大小的实例代码

网络编程 2024/12/25 佚名

2 0 1

极乐门资源网 Design By www.ioogu.com

微信小程序官方API中 wx.chooseImage() 是可以进行图片压缩的，可惜的是不能压缩到指定大小。

实际开发中需求可能是压缩到指定大小：

原生js可以使用canvas来压缩，但由于微信小程序对canvas有封装，使得利用canvas来压缩图片有了一些区别：

代码放在了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

直接上代码：

主函数：

以上的三个函数可以写在一个公共的js文件里面我是写在 common.js中的:

html:

在html中需要添加个canvas标签，一般这个标签不让他出现在页面中，因为它的作用仅仅是压缩图片的工具：

<canvas class="canvas" canvas-id="canvas" :style="{width:cWidth+'px',height:cHeight+'px', visibility: 'hidden', 'position':'absolute', 'z-index': '-1', left: '-10000rpx',top:'-10000rpx'}"></canvas>

在methods中增加chooseImg方法：

代码在实际项目中使用，能完成压缩图片到指定大小的需求。

总结

以上所述是小编给大家介绍的微信小程序上传图片并等比列压缩到指定大小的实例代码,希望对大家有所帮助，如果大家有任何疑问请给我留言，小编会及时回复大家的。在此也非常感谢大家对网站的支持！
如果你觉得本文对你有帮助，欢迎转载，烦请注明出处，谢谢！

小程序,上传图片,微信小程序压缩上传

标签：

小程序,上传图片,微信小程序压缩上传

极乐门资源网 Design By www.ioogu.com

极乐门资源网 免责声明：本站文章均来自网站采集或用户投稿，网站不提供任何软件下载或自行开发的软件！如有用户或公司发现本站内容信息存在侵权行为，请邮件告知！ 858582#qq.com

极乐门资源网 Design By www.ioogu.com

评论“微信小程序上传图片并等比列压缩到指定大小的实例代码”

暂无微信小程序上传图片并等比列压缩到指定大小的实例代码的评论...

更新日志

2024年12月25日

微信小程序上传图片并等比列压缩到指定大小的实例代码

小程序,上传图片,微信小程序压缩上传

vue项目使用.env文件配置全局环境变量的方法

nest.js 使用express需要提供多个静态目录的操作方法

评论“微信小程序上传图片并等比列压缩到指定大小的实例代码”

更新日志

友情链接