FileReader Image to Base64 Corrupted Conversion

Question

I am trying to convert an Image from my local files to Base64 by JavaSctipt.
For example please look at THIS website.

When I browse a picture on the input beneath Local File* heading (input having id #form-base64-converter-encode-image-file) and then run this code in the console of the browser -

function getBase64(file) {
   var reader = new window.FileReader();
   reader.readAsDataURL(file);
   reader.onload = function () {
    alert(reader.result);
   };
   reader.onerror = function (error) {
     alert('Error: ', error);
   };
}

var file = window.document.querySelector('#form-base64-converter-encode-image-file').files[0];
getBase64(file);

The script give me a long string which is supposed to be conversion of image in Base64. But when I assign the string in the source of an Image the image won't show up. The string is corrupted or not a proper conversion of Base64. Please somebody explain what I need to do for a proper Base64 string which I can then assign in src attribute of an < image >

Thank you.