网店系统H5版(四) 图片上传

2020-4-4 22:19:38 星期六

网店肯定是需要有图片上传的功能, 下边介绍一下实现图片上传功能

1. 由于图片会很多, 而现在手机拍照的图片又特别大, 所以图片上传到服务器前必须对手机端的图片进行压缩

2. 图片上传时要与某个商品进行关联, 所以上传时要同其他数据一起上传

3. iOS系统上传图片时, 明明是竖向排的, 传到后端后会变成横向的, lrz这个js压缩工具就可以解决这个问题

4. 由于图片压缩会耗费一些时间, 但是只显示loading动图难免让操作者焦急, 这里将 压缩/上传/结果 以文字的形式动态展示到上传按钮下方

用到的js库

界面预览:

 

其中能上传的最多图片数, 图片压缩后的最大值是有服务器返回的配置确定的