how to convert file input to base64 - react js

Question

I have a file input and I want to convert it to base64 and send to server side. this is my code:

var avatar = (this.refs.avatar) ? this.refs.avatar.files : "" ;

if(avatar.length > 0){
  avatar = avatar[0]
  let fileReader = new FileReader();
  let file = null;
  fileReader.onload = function(fileLoadedEvent) {
       file = fileLoadedEvent.target.result;

   };
   fileReader.readAsDataURL(avatar);
}else{
  avatar = ""
}

console.log(avatar); //File(2468670) {name: "wood.png", lastModified: 1524227213060, lastModifiedDate: Fri Apr 20 2018 16:56:53 GMT+0430 (+0430), webkitRelativePath: "", size: 2468670, …}

should I covert avatar to base64? I should convert to origin file on server side.

Why do you need to convert it? Uploading it will convert it to the proper MIME Type. The server can handle it from there. — Virmundi
– Virmundi, Commented May 10, 2018 at 13:46
your code does the job, what's the matter?, file is a base64 representation of avatar — AngelSalazar
– AngelSalazar, Commented May 10, 2018 at 13:53

victor.ja · Accepted Answer · 2018-05-10 14:30:50Z

1

The atob() function decodes a string of data which has been encoded using base-64 encoding. Conversely, the btoa() function creates a base-64 encoded ASCII string from a "string" of binary data.

answered May 10, 2018 at 14:30

victor.ja

9272 gold badges11 silver badges32 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

how to convert file input to base64 - react js

1 Answer 1

Comments

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Related