CODEWITHSUNDEEP
javascript
Hassan Baig
Hassan Baig

Reputation: 15844

Retrieving size (in bytes) of image file in pure Javascript

Server-side dev here who's a JS newbie. This question is about retrieving the size of an image selected via the browse input element (in a form), via pure JS.

Currently, the easiest way I know of to get the size (in bytes) in such a case is e.target.files[0].size.

My question is: is this a reliable way to retrieve file size? Or can it be easily spoofed à la file extensions?

I need to impose a ceiling on image sizes allowed to be uploaded. I'm doing that on server-side too, and am adding it to the client for extra security (and to tinker around in JS to learn the ropes).

If this is an unreliable way to retrieve image size, I'd love to see an illustrative example of the alternative. I'm expecting PNGs, JPEGs and GIFs to be uploaded.

Note: Please stick to pure JS for the scope of this question. JQuery is on my radar too, but only after I've absorbed vanilla JS fundamentals.

Upvotes: 1

Views: 829

Answers (1)

Caleb Miller
Caleb Miller

Reputation: 1182

Yes, e.target.files[0].size is the recommended approach: https://developer.mozilla.org/en-US/docs/Web/API/File/Using_files_from_web_applications

Upvotes: 2

Related Questions