为了账号安全,请及时绑定邮箱和手机立即绑定

h5在安卓手机上获取图片宽高缩小了16倍

h5在安卓手机上获取图片宽高缩小了16倍

慕慕森 2019-05-24 18:45:07
做了一个移动端预览、上传图片的功能,但是在安卓手机发现上传的图片压缩厉害,查了下发现是获取的图片宽高异常(是原图的1/16),导致drawImage时图片被压缩,代码中并没有对宽高修改,百思不解,贴上代码,各位大大看下是什么原因,多谢!!更新1:已验证ios下正常,android下拍照上传也是正常,只有选择图片上传会被压缩严重。检查上传代码感觉应该没有问题,会不会是android容器有什么异常,实在想不出其他原因,还望各位大大不吝赐教。更新2:引入localResizeIMG解决了这个问题,但是没有找到bug的根源,希望有遇到相同问题的朋友可以一起探讨//预览并上传图片previewImg:function(file,imgArr){varself=this;varURL=window.URL||window.webkitURL;varrFilter=/^(?:image\/gif|image\/jpeg|image\/png)$/i;//判断上传文件类型if(!rFilter.test(file.type)){showTipMsg('请上传图片!');return;}varfileUrl=URL.createObjectURL(file);varcanvas=document.createElement("canvas");varctx=canvas.getContext("2d");varimage=newImage();image.onload=function(){varw=image.width;varh=image.height;//按@wolfx提示,限制宽高,不进行压缩if(w>1000&&w>h){h=h*1000/w;w=1000;}if(h>1000&&h>w){w=w*1000/h;h=1000;}canvas.width=w;canvas.height=h;ctx.drawImage(image,0,0,w,h);vardataUrl=canvas.toDataURL("image/jpeg");//上传base64图片self.uploadDataBase64(dataUrl,imgArr);};image.src=fileUrl;}
查看完整描述

2 回答

?
拉丁的传说

TA贡献1789条经验 获得超8个赞

scale的倍数,和文件大小不是线性关系啊,怎么可以用文件大小比例去作为缩放比呢。。。
我觉得设置一个最大宽,凡是大于这个宽的,强制压缩到最大宽就行了。
                            
查看完整回答
反对 回复 2019-05-24
?
元芳怎么了

TA贡献1798条经验 获得超7个赞

问题已经解决,自问自答下使用了localResizeIMG插件解决了以上问题,阅读了localResizeIMG的源码,但是还是没找到bug的根源在哪
                            
查看完整回答
反对 回复 2019-05-24
  • 2 回答
  • 0 关注
  • 603 浏览
慕课专栏
更多

添加回答

举报

0/150
提交
取消
微信客服

购课补贴
联系客服咨询优惠详情

帮助反馈 APP下载

慕课网APP
您的移动学习伙伴

公众号

扫描二维码
关注慕课网微信公众号