PHP

Converting hiec to jpg using javascript before uploading in PHP

function convertHeicToJpg(input)
    {
        var fileName = $(input).val();
        var fileNameExt = fileName.substr(fileName.lastIndexOf('.') + 1);
        if(fileNameExt == "heic") {
            var blob = $(input)[0].files[0]; //ev.target.files[0];
            heic2any({
                blob: blob,
                toType: "image/jpg",
            })
                .then(function (resultBlob) {

                    var url = URL.createObjectURL(resultBlob);
                    $(input).parent().find(".upload-file").css("background-image", "url("+url+")"); //previewing the uploaded picture
                    //adding converted picture to the original <input type="file">
                    let fileInputElement = $(input)[0];
                    let container = new DataTransfer();
                    let file = new File([resultBlob], "heic"+".jpg",{type:"image/jpeg", lastModified:new Date().getTime()});
                    container.items.add(file);

                    fileInputElement.files = container.files;
                    console.log("added");
                })
                .catch(function (x) {
                    console.log(x.code);
                    console.log(x.message);
                });
        }
    }

    $("#input").change(function() {
            convertHeicToJpg(this);

     });

Converting hiec to jpg using javascript before uploading in PHP

$('#files').on('change' , function(){
          var total_file=document.getElementById("files").files.length;
 
        for(var i=0;i<total_file;i++)
        {
          files = event.target.files[i];
          var fileName = files.name;
          var fileNameExt = fileName.substr(fileName.lastIndexOf('.') + 1);
          objURL = URL.createObjectURL(event.target.files[i]);
          if(fileNameExt == "heic") {
            objURL = await convertHeicToJpg(input , i);
       
         }
        })
        
        async function convertHeicToJpg(input , i)
                {
                        var blobfile = $(input)[0].files[i]; //ev.target.files[0];
            
                        let blobURL = URL.createObjectURL(blobfile);
                    
                        // convert "fetch" the new blob url
                        let blobRes = await fetch(blobURL)
            
                        // convert response to blob
                        let blob = await blobRes.blob()
            
                        // convert to PNG - response is blob
                        let resultBlob = await heic2any({ blob })
            
                        console.log(resultBlob)
                        var url = URL.createObjectURL(resultBlob);
                               
                        let fileInputElement = $(input)[0];
                        let container = new DataTransfer();
                        let file = new File([resultBlob], "heic"+".png",{type:"image/png", lastModified:new Date().getTime()});
                        container.items.add(file);
            
                        fileInputElement.files[0] = container.files;
                        uploadFile(container.files);
                        console.log("added");
                        console.log(url);
                        
                        return url ;
               
                }
            
            function uploadFile(files)
            {
              
              console.log(files);
              var error = '';
              var form_data = new FormData();
              for(var count = 0; count<files.length; count++)
              {
               var name = files[count].name;
               var extension = name.split('.').pop().toLowerCase();
               form_data.append("files[]", files[count]);
              }
               $.ajax({
                url:"<?php echo base_url(); ?>Property/upload", 
                method:"POST",
                data:form_data,
                contentType:false,
                cache:false,
                processData:false,
                dataType:'JSON',
                beforeSend:function(){
                    //..processing  
                },
                success:function(data)
                {
                  
                  alert('image uploade')
                }
               })
             
            }