php – ¿Cómo pasar un Blob por ajax?

pues he estado intentando pasar un objeto blob por ajax, pero no he podido. Lo que estoy haciendo es un trazo hecha por una persona que pasa el mouse o el dedo en el celular.
Cuando miro en la consola el blob, me aparece así: Blob {size: 17062, type: “image/png”} y al parecer está todo perfecto, pero no se envía.

miren el código:

$(document).ready(function () {
       
    $('#formu').submit(function(e){

        var canvas = document.getElementById("canvas");
        var UrlCanvas = canvas.toDataURL("image/octet-stream");
       
        
         var blob=convertirUrl_a_Blob(UrlCanvas);

         var objectData = new FormData(); 
         objectData.append('file', blob); 
    
        $.ajax({
            type: 'POST',
            url: 'procesar.php',  
            contentType: false,
            processData: false,
            data: objectData,
            success: function(response){
               
            console.log(response);  
            
           }
            
        })

        e.preventDefault();
    })


});
<form action="procesar.php" method='POST' id='formu' enctype="multipart/form-data">
    


    
      <canvas id='canvas' style=" border: 1px solid red;"></canvas>
    



    <button>guardar</button>

</form>

Si hay una forma de resolver esto o hacerlo diferente, se los agradecería.