Compress image file from AsyncFileUpload

Question

Is it possible to compress images upon upload directly from AsyncFileUpload? If yes, can you guide me how?

For example: I have a user that uploads an image .jpeg with size 1200x1600 (5MB) and I want to compress it into a 600x800 (1MP~2MB) file. As much as possible I have to do this on client side just before I upload it to server.

Thank you.

_Is it possible to.._ Did you tried it? – Soner Gönül Apr 11 '13 at 05:42 — Soner Gönül, Apr 11 '13 at 05:42

score 1 · Answer 1 · answered Apr 11 '13 at 05:43

1

You can take a look at DotNetZip library. I think you will find your solution there.

answered Apr 11 '13 at 05:43

Xelom

1,615
1
13
23

I want to compress the image before upload. Thanks for trying though. – Mark Apr 11 '13 at 05:45
Did you look at the examples? What are you trying? Why this approach can't do what you want? – Xelom Apr 11 '13 at 06:07
Can I compress it on client side? – Mark Apr 11 '13 at 06:22
@UlfricStormcloak : Are you sure you want to use ZIP? From your question it seems you want to *resize* your image instead. And ZIP won't do anything to JPG – Martheen Apr 11 '13 at 07:17

score 1 · Answer 2 · edited May 23 '17 at 12:25

1

On HTML5 browser, you can use the solution in this answer, otherwise you're stuck with requiring your client to use a plugin (Java, Flash, Silverlight) etc.

edited May 23 '17 at 12:25

Community

1
1

answered Apr 11 '13 at 07:32

Martheen

5,198
4
32
55

I think this is the one I am looking for but how can I integrate this on `AsyncFileUpload` of asp.net? – Mark Apr 11 '13 at 07:34
Either subclass or extend the selecting method so instead of selecting the original file it would select the resized image. – Martheen Apr 11 '13 at 07:38
Ok.. How can I do that? Do the user have to upload the image to server before compression? – Mark Apr 11 '13 at 09:31
No no, the point is to resize (not compressing, JPG is already compressed) before uploading. In the answer for HTML5, notice the end of the sample code is : var dataurl = canvas.toDataURL("image/png"); So just point that dataurl to the AsyncFileUpload – Martheen Apr 11 '13 at 09:35
I just want to maximize the space of my servers. I want to compress/resize the file. If that is how you call it then thats it. – Mark Apr 11 '13 at 09:40
Now the actual purpose of resizing on client isn't as much as saving space in the server, but in reducing the bandwidth requirement of both the server and client. If you don't care about the bandwidth, just use the regular upload and tell your server to resize the incoming images. On the other hand, if you want to also save the bandwidth, the you just have to pick one of the method I give (HTML5 works best unless you somehow need to support IE6) – Martheen Apr 11 '13 at 09:46
Though it is a local system, I also consider the bandwidth since we multiple user. The traffic of transactions are distinctively heavy. – Mark Apr 12 '13 at 01:37
Ok, so use one of the method I propose. All those method create a local copy of the image, which you'll pass to AsynFileUpload – Martheen Apr 12 '13 at 01:50
Ok let me try this. Thanks. I'll marked this as answered if it work. – Mark Apr 12 '13 at 01:51

Compress image file from AsyncFileUpload

2 Answers2