Image upload by REST api results in empty image (confirmed)

To upload an image or a file to SharePoint with Full rest you have to pass an array buffer not a base64 string.

var getFile = getFileBuffer(v);
getFile.done(function (arrayBuffer) {
    getFile.done(function (arrayBuffer) {
    var doUpload = uploadDocument(arrayBuffer, fileName);
    doUpload.done(function (file, status, xhr) {
        //the rest of the magic
    });
});

function uploadDocument(buffer, fileName) {
    var url = _spPageContextInfo.webAbsoluteUrl + '/_api/web/Lists/GetbyTitle('your_library')/RootFolder/Files/add(url=@TargetFileName,overwrite='true')?' +
        '&@TargetFileName='' + encodeURI(fileName) + ''';
    var call = $.ajax({
        url: url,
        type: 'POST',
        data: buffer, //<-- This is the file
        processData: false,
        headers: {
            Accept: 'application/json;odata=verbose',
            'X-RequestDigest': $('#__REQUESTDIGEST').val()
        }
    });
    return call;
}

function getFileBuffer(v) {
    var deferred = jQuery.Deferred();
    var reader = new FileReader();
    reader.onloadend = function (e) {
        deferred.resolve(e.target.result);
    }
    reader.onerror = function (e) {
        deferred.reject(e.target.error);
    }
    reader.readAsArrayBuffer(v);
    return deferred.promise();
}

The code above is what I use to upload heavy documents to SharePoint. I hope it helps you :)