为规范前端用户上传照片的大小,减轻存储服务器压力,当用户选取的照片过大时,在前端自动进行压缩至指定大小(比如 1M )后再上传。
npm i mp-image-compress --save
依赖包安装后,需要在小程序开发者工具中:构建npm
index.js
// 引用 mp-image-compress import mpImageCompress from 'mp-image-compress' Page({ data: { img: '' },
onLoad() {
mpImageCompress.clearTempImg() // 页面载入时清除临时文件 },
onUnload() {
mpImageCompress.clearTempImg() // 页面卸载时清除临时文件 },
chooseImage() { const that = this wx.chooseMedia({ count: 1, mediaType: ['image'], sourceType: ['album', 'camera'], sizeType: ['original', 'compressed'], async success(res) { const info = res.tempFiles[0] // 选择文件后调用图片压缩接口进行压缩。如果选取的图片没有达到指定的大小,将返回原图 const imgRes = await mpImageCompress.set(info.tempFilePath, 1024) // 1024K console.info(imgRes) /////////////////////// that.setData({ img: imgRes.filePath
})
}
})
},
preview() {
wx.previewImage({ current: this.data.img, urls: [this.data.img]
})
},
DelImg() { this.setData({ img: '' })
},
})
联系我们
友情链接:
小程序开发 小程序定制开发 小程序商店 微信小程序开发文档 分销商城小程序 电商小程序开发 百家号 商城小程序 微信小程序开发API 小程序定制 生鲜小程序 全平台开发 网站建设 外包开发 自主研发产品 sitemap robots热门地区:
松江开发公司 青浦开发公司 崇明开发公司 杨浦开发公司 宝山开发公司 奉贤开发公司 虹口开发公司 闵行开发公司 长宁开发公司 静安开发公司 黄浦开发公司 嘉定开发公司 徐汇开发公司 金山开发公司 上海开发公司 南昌开发公司 杭州开发公司 上饶开发公司COPYRIGHT 2009-2016 www.guanzhiweb.com ALL RIGHTS RESERVED
版权所有 上海观智网络科技有限公司