CODEWITHSUNDEEP
javascriptjquery
Nikhil
Nikhil

Reputation: 21

How can I know the actual size of Image File in Javascript?

I have developed a rich text editor using contenteditable div using javascript. which allows users to drop and copy-paste images. I have kept a file limitation of 5mb. Scenario1: If a user drops an image into the editor using file properties I am displaying an error message.its working fine. Scenario2: If a user copy(ctrl+C) an image it is getting converted into base64Image in the clipboard. using file reader when I check the size its showing 29MB for 5Mb file. I know the file size is increased because of base64 encrypting I have tried atob() and btoa() but still not helpful how can I able to get the original file size ??

code

function PasteImage(event){           
var items=(event.clipboardData || event.originalEvent.clipboardData).items;         
var blob=items[0].getAsFile();         
console.log(blob.size)--gives 26mb which is formed by base64 encoded.      

}

I would like to know is there any possibility to get the actual size file.

Upvotes: 0

Views: 300

Answers (1)

Ranjeet
Ranjeet

Reputation: 579

on change of input type file you can get the file size:

Like

 <input type="file" id="fileInput" />

    $('#fileInput').on('change', function() {

       alert(this.files[0].size);

    });

Upvotes: 1

Related Questions