Send an image by ajax to controller java

I'm rescuing an image from an input

<input name="fotoPerfil" type="file" id="upload" value="Choose a file" accept="image/*" />

and I'm trying to convert it to base64 to send it to a controller via ajax

AJAX

    function guardarFotoPerfil() {
        archivo64 = getBase64(document.getElementById('upload'));

        var url = '../saveFoto.htm';
        $.ajax({
            type : 'POST',
            url : url,
            data : {
                datos : archivo64
            },
            dataType : 'text',
            //processData: false,
            success : function(respuesta) {
                alert('Foto enviada');
                console.log(respuesta);
            },
            error : function(xhr, status, error) {
                alert('Error al enviar la foto');
                console.log(error);
            }
        });
    }

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

I have not been able to generate the base64 of the image, although if I send the error that the function getBase64(file); gives me, I receive it correctly in the controller.