上传前调整图像大小,但同步上传(不是ajax)。可能吗?

时间:2012-07-31 15:02:43

标签: javascript image forms resize

我有一个包含某些字段的表单,包括用于上传图像的输入类型='文件' 我正在寻找一种方法来调整此字段选择的图像大小,但不能立即上传。

我已经阅读了一些教授以下过程的教程:
1 - 使用文件字段上的'onchange'事件捕获图像;
2 - 创建具有所需图像大小的画布元素;
3 - 在canvas元素中绘制图像并读取其内容;
4 - 使用FormData异步发送图像数据(ajax)。

我想在第3步之前做同样的事情,然后在用户点击表单的提交按钮时将调整后的图像与其他字段一起发送。

有人有任何想法吗?
谢谢!

Ps:有些帖子几乎按照我的意愿行事:
http://coding.pressbin.com/84/File-API-Resize-photo-before-upload/
Resizing an image in an HTML5 canvas

1 个答案:

答案 0 :(得分:1)

如果您想调整图片大小以节省空间,请尝试: http://www.researchandtechnology.net/bcif/

这是一种JavaScript图像压缩算法。

这也可能有所帮助:Javascript lossless image compression

并将其与其他表单项包括在一起64对图像进行编码 How to convert image into base64 string using javascript

并将其作为字符串发送

如果您不想这样做,请提供更多信息?