phoenix
phoenix
  • 发布:2014-12-31 10:38
  • 更新:2015-07-29 04:51
  • 阅读:9887

选择图片并上传,上传前能先将图片压缩吗?

分类:HTML5+

用plus.uploader选择图片并上传,上传前能先将图片压缩吗?因为是网络应用,直接传图片基本都超过2M了,这样等待时间太长。
有现成的方法或者例子吗?
因为手机APP更适合(长=宽)这样的图片格式,如果能在本地处理成长宽相等,而不是1:1.333直接上传就更好了,比如直接用html5的canvas处理后上传保存。

2014-12-31 10:38 分享
已邀请:

最佳回复

DCloud_heavensoft

DCloud_heavensoft

wangda_cn

wangda_cn

参考代码:

<canvas id="finalCanvas" ></canvas>  
<img id="imgResult" alt="最终结果"/>

Js代码段:

var img = new Image();  
img.src = "sago.jpg"; // 要压缩的图片  
var finalCanvas = document.getElementById("finalCanvas");  
var ctx = finalCanvas.getContext("2d");  
//  将图片画到canvas上面  
ctx.drawImage(img, x, y, w, h, 0, 0, 150, 150 );  
// 使用Canvas压缩  
var preImg = finalCanvas.toDataURL("image/jpeg", 0.7);  
$("#imgResult").attr("src", preImg);  

差不多就是这样

  • 小闹

    求源码!另外,压缩后图片的清晰度如何?

    2014-12-31 15:05

  • 西洲

    部分安卓手机不支持压缩比例设置,怎么处理

    2016-12-06 11:57

wangda_cn

wangda_cn

最近刚弄出来一个使用JS对图片剪切+压缩的东西。

  • cindyya

    亲,您好!对于图片的剪切的实现能否指导一下呢?谢谢

    2015-05-22 12:40

wangda_cn

wangda_cn

使用JPG压缩后大小仅是PNG不压缩的1/10

小闹

小闹

求源码!另外,压缩后图片的清晰度如何?

  • wangda_cn

    源码上面给出来了呀。压缩后很清

    2015-01-01 22:50

  • 小闹

    嗯,谢谢!

    2015-01-02 09:22

  • stock2

    HTML5+已经在plus.zip里提供了compressImage的原生图像压缩。这个测试下来 非常完美的压缩. 不要用js压缩 反而变大或超级不清晰.

    2015-07-29 10:21

要回复问题请先登录注册