localResizeIMG 介绍
简述
在客户端压缩好要 上传 的 图片 可以节省带宽更快的发送给后端,特别适合在移动设备上使用。
为什么需要
已踩过很多坑,经过几个版本迭代,以及很多很多网友的反馈帮助、机型测试
图片 扭曲、某些设备不 自动 旋转 图片 方向,没有jpeg 压缩算法 ..
不支持 new Blob,formData构造的 文件 size为0..
还有某些机型和浏览器(例如QQX5浏览器)莫名其妙的BUG..
按需加载(会根据对应设备 自动 异步载入js 文件 ,节省不必要带宽)
原生js编写,不依赖例如jquery等第三方库, 支持 AMD or CMD规范。
如何 获取
通过以下方式都可以下载:
执行npm i lrz(推荐)
执行bower install lrz
接着在 页面 中引入
<script src="./ dis t/lrz.bundle.js"></script>
如何使用
方式1:
如果您的 图片 来自 用户 拍摄或者 上传 的,您需要 一个 input file来 获取 图片 。<input id="file" type="file" accept="image/*" />接着通过change事件可以得到 用户 选择的 图片 document.querySelector('#file').addEventListener('change',function () {lrz(this.files[0]).then(function (rst) {// 处理成功会执行console.log(rst);}).catch(function (err) {// 处理失败会执行}).always(function () {// 不管是成功失败,都会执行});});方式2:
如果您的 图片 不是来自 用户 上传 的,那么也可以直接传入 图片 路径。
lrz('./xxx/xx/x.png')
.then(function (rst) {
// 处理成功会执行
})
.catch(function (err){
// 处理失败会执行
})
.always(function () {
// 不管是成功失败,都会执行
});
GitHub: https://github.com/think2011/localResizeIMG
网站描述: 前端本地客户端压缩 图片 ,兼容IOS,Android,PC、 自动 按需加载 文件
localResizeIMG官方网站
官方网站:
如果觉得 网站内容还不错,欢迎将 网站 推荐给程序员好友。
声明:本文来自网络,不代表【好得很程序员自学网】立场,转载请注明出处:http://haodehen.cn/did175030