0

I'm wondering how you could approach the next scenario the best:

An user has no clue what the size of an image is and just tries to upload a file with a size of more than 10MB on a website.

We as developers know that this would be a very unwise in certain scopes because of page loading times, bandwith usage, storage space, etc.

Now i thought i could resize the image before uploading it to a server. Let's say i would resize the image to 600x600.

My question is:

Is there any method that allows the image to be resized before the file will be uploaded and will most likely not result in a 500 error? Good thing to notice it has to work on all browsers and even IE8+ if possible.

Any ideas,approaches or solutions are welcome. I thought about using jQuery-File-Upload but i think you also will have to send the image to the client first before the resizing can take place and will most likely crash the browser? I'm not sure how to approach this case.

Lars Mertens
  • 1,389
  • 2
  • 15
  • 37
  • Have you already seen [this question](http://stackoverflow.com/questions/2434458/image-resizing-client-side-with-javascript-before-upload-to-the-server)? – Huelfe Nov 04 '16 at 12:53
  • 1
    Client-side resizing boils down to putting the image in a canvas element first. How good browser support for that is, you can go look up. _“and even IE8+ if possible”_ – don’t encourage users to use hugely outdated security risks like that. – CBroe Nov 04 '16 at 12:53
  • I got -1 as my answer about using PHP GD library. Most probably because question is about resizing image before uploading to server and I suggested to resize it on server by PHP but my idea was to increase upload_max_size in PHP and resize the image right after receiving and then update the website with resized image and destroy the original received image. That way you can easily handle image uploading, – Abhay Maurya Nov 04 '16 at 12:54
  • Yes i've searched some around also read that article. Guess i just stick with the server side upload and resize after but thanks for the comments. Was just wondering what most people usually do in situations like this. – Lars Mertens Nov 04 '16 at 12:58
  • @AbhayMaurya and what about mobile users? Maybe they have limited bandwidth and do not want to upload like 10MB? – Huelfe Nov 04 '16 at 12:58
  • @Huelfe, I mean problem is with big size pics(highest 10MB), if you upload lesser than 10MB then same code will work anyway. – Abhay Maurya Nov 04 '16 at 13:01
  • Most people solve this with client side resizing + no support for over 8 year old browsers, like IE8 (or rather, if it works, it works but no one really do anything extra for them anymore). Or they simply have a 1-2 MB (or lower) limit on file sizes. – M. Eriksson Nov 04 '16 at 13:02
  • @AbhayMaurya The question is clear: *Is there any method that allows the image to be resized **before** the file will be uploaded* (emphasis mine). So no, uploading and resizing will not do in this case. – jeroen Nov 04 '16 at 13:02
  • @jeroen, I understood that. I didn't know that problem was resizing BEFORE uploading. I thought problem was slow loading of website and storage given these lines in question : "We as developers know that this would be a very unwise in certain scopes because of page loading times, bandwith usage, storage space, etc." That's why i provided alternative of resizing on server. Thanks for your update though for clearing the problem. – Abhay Maurya Nov 04 '16 at 13:13

0 Answers0