84669 personnes étudient
152542 personnes étudient
20005 personnes étudient
5487 personnes étudient
7821 personnes étudient
359900 personnes étudient
3350 personnes étudient
180660 personnes étudient
48569 personnes étudient
18603 personnes étudient
40936 personnes étudient
1549 personnes étudient
1183 personnes étudient
32909 personnes étudient
当用户通过浏览器上传图片时,不管用户用了多大的图片,都使其能够上传,现在想用JS先在浏览器上对图片进行压缩处理,然后上传,而不是将整个图片上传到后台服务器然后在压缩后存储。请问这种方案是否可行?新浪微博在上传图片的时候是怎样一种解决方案?请各路大牛不吝赐教!谢谢。
欢迎选择我的课程,让我们一起见证您的进步~~
如果要所有运算都在客户端通过js完成,目前只有html5的canvas和file api才能满足你的需要。但是对国内用户来说,支持html5的浏览器普及率还不够高。
新浪微博的图片上传使用的是图片上传后然后,再在服务器端压缩的方法,实际上这种方式的消耗也很少。目前普遍上使用的都是这种方式,因为只需要在上传的时候压缩一次。
<script language="JavaScript" type="text/javascript"> function DrawImage(ImgD,FitWidth,FitHeight) { var image=new Image(); image.src=ImgD.src; if(image.width>0 && image.height>0) { if(image.width>FitWidth) { ImgD.width=FitWidth; ImgD.height=(image.height*FitWidth)/image.width; if(ImgD.height>FitHeight) { ImgD.height=FitHeight; ImgD.width=(image.width*FitHeight)/image.height; } } else if(image.height>FitHeight) { ImgD.height=FitHeight; ImgD.width=(image.width*FitHeight)/image.height; if(image.width>FitWidth) { ImgD.width=FitWidth; ImgD.height=(image.height*FitWidth)/image.width; } } else { ImgD.width=image.width; ImgD.height=image.height; } } } </script>
最近做一个页面时用到的,不知道符不符合你的需求!
也可以考虑用flash去实现压缩上传的功能
python的话,直接用PIL在服务器端处理就可以了,没必要做在客户端用js做
客户端的js改变图片的宽度和高度 是很难做到效果漂亮的,大部分情况都是服务器端语言压缩的
https://github.com/think2011/LocalResizeIMG
我是基于这位大神的代码,完成了客户端头像截取,压缩,旋转
跟你说说主要会遇到的问题
手机拍的图片会在 图片 exif 里面保存图片方向,所以要在客户端先将图片进行相应的旋转
压缩过的图片只能通过 base64 上传
请问家有萌虎,关于exif 那里如何实现的
关于JS前端图片压缩 这里有详细的方案http://www.imwinlion.com/archives/158摘录一段如下,应该是你想要的
这个场景的难点在于图片压缩,为什么是图片前端压缩?首先,因为当前用户基本上是大屏手机,一个图1-4M,是很正常的,但是用户参与活动的时候,未必愿意花这个流量,这样这个活动关上传图片这一步,就会降低很多用户参与的欲望了。其次,用户的网络状态未必很好,虽然用户3G很普遍,4G成规模,WIFI热点也很多,但是上传这么大的一张图,以2M估算,每秒上传速度100KB,也要20秒,难保这20秒时间网络不出任何差错。再次,用户未必愿意等待这么长的时间。解决方案在哪里?,答案是前端压缩,这里笔者常用的插件是lrz下载地址如下,也给个demo
如果要所有运算都在客户端通过js完成,目前只有html5的canvas和file api才能满足你的需要。但是对国内用户来说,支持html5的浏览器普及率还不够高。
新浪微博的图片上传使用的是图片上传后然后,再在服务器端压缩的方法,实际上这种方式的消耗也很少。目前普遍上使用的都是这种方式,因为只需要在上传的时候压缩一次。
最近做一个页面时用到的,不知道符不符合你的需求!
也可以考虑用flash去实现压缩上传的功能
python的话,直接用PIL在服务器端处理就可以了,没必要做在客户端用js做
客户端的js改变图片的宽度和高度 是很难做到效果漂亮的,大部分情况都是服务器端语言压缩的
https://github.com/think2011/LocalResizeIMG
我是基于这位大神的代码,完成了客户端头像截取,压缩,旋转
跟你说说主要会遇到的问题
手机拍的图片会在 图片 exif 里面保存图片方向,所以要在客户端先将图片进行相应的旋转
压缩过的图片只能通过 base64 上传
请问家有萌虎,关于exif 那里如何实现的
关于JS前端图片压缩 这里有详细的方案
http://www.imwinlion.com/archives/158
摘录一段如下,应该是你想要的