Heic to jpg conversion using libheif

Question

I am trying to convert .HEIC image to .JPG using libheif.

libheif converts image on client side browser window only. So in order to save the image i converted image to base64 and then performed ajax to save the image using file_put_contents.

 this.canvas.toBlob(function(blob) {

        var extension = FILE_EXTENSIONS[blob.type] || ".bin";
        var basename = this.filename.replace(/\.[^/.]+$/, "");
        if (navigator.msSaveOrOpenBlob) {
            navigator.msSaveOrOpenBlob(blob, basename + extension);
            return;
        }


        var readers = new FileReader();
        var base64image;
        readers.readAsDataURL(blob);
        readers.onload = function () {

          var base64image = readers.result;  // data <-- in this var you have the file data in Base64 format
         // console.log(base64image);

          // call ajax
            var formData = new FormData();
            formData.append('filename', basename);
            formData.append('avatar', readers.result);

              $.ajax('upload.php', {
                method: "POST",
                data: formData,
                processData: false,
                contentType: false,
                success: function (response) {
                    console.log(response);
                },
                error: function () {
                }
              });

        };

        return;

       // this.downloads.appendChild(dlink);
       // dlink.click();
       // URL.revokeObjectURL(url);
    }.bind(this), format);

When i convert a single image then it works fine. But if i try to convert in loop it does not works.

Before completing js conversion, my php loop runs (I think this is the issue) So i tried php function sleep() and js set timeout(), But unfortunately none worked.

(function() {
    var demo = new HeifDemo(libheif);
    <?php $img_array = array('demo/1.heic', 'demo/2.heic', 'demo/3.heic');

    foreach ($img_array as $img) : ?>
    function saveImage(subject, callback) {
      demo.loadUrl(subject);
            callback();
    }

    saveImage('<?php echo $img; ?>', function() {
        // demo.saveImage();
          setTimeout( function(){
                demo.saveImage();  
          }, 2500 );
    });


    //});
    <?php sleep(4);  endforeach; ?>  }).call();