Search code examples
iosangularfileionic-frameworkfile-upload

convert from video uri to blob is not working on iOS using ionic framework


I am using the following code to convert the video file to blob for iOS.


    Takevideo()
      {
          const options: CameraOptions = {
            sourceType: this.camera.PictureSourceType.PHOTOLIBRARY, 
            destinationType: this.camera.DestinationType.DATA_URL,
            mediaType: this.camera.MediaType.VIDEO      
          }
            this.camera.getPicture(options).then(async (videoUrl) => {
              debugger;
              this.selectvideopath=null;
              var filename = videoUrl.substr(videoUrl.lastIndexOf('/') + 1);
              var dirpath = videoUrl.substr(0, videoUrl.lastIndexOf('/') + 1);
    
              dirpath = dirpath.includes("file://") ? dirpath : "file://" + dirpath;
              try {
                var dirUrl = await this.file.resolveDirectoryUrl(dirpath);
                var retrievedFile = await this.file.getFile(dirUrl, filename, {});
                this.makeFileIntoBlob(retrievedFile.nativeURL);
              } catch(err) {
                return this.ionLoader.showAlert("Something went wrong.");
              }
             
             }, (err) => {
              // Handle error
             });
      }
    
      makeFileIntoBlob(_imagePath) {
        return new Promise((resolve, reject) => {
          console.log("makefileintoblob", +_imagePath);
          let fileName = "";
          this.file
            .resolveLocalFilesystemUrl(_imagePath)
            .then(fileEntry => {
              let { name, nativeURL } = fileEntry;
    
              let path = nativeURL.substring(0, nativeURL.lastIndexOf("/"));
              console.log("path", path);
              console.log("fileName", name);
    
              fileName = name;
    
              var buffer=this.file.readAsArrayBuffer(path, name);
              console.log("makefileintoblob buffer: " +buffer);
              this.Videodatas.push({vdodata:buffer});
              return this.file.readAsArrayBuffer(path, name);
            })
            .then(buffer => {
              this.ionLoader.showAlert('2:'+buffer);
              console.log("makefileintoblob buffernew: " +buffer);
              let imgBlob = new Blob([buffer], {
                type: "video/MOV"
              });
              console.log(imgBlob.type, imgBlob.size);
              resolve({
                fileName,
                imgBlob
              });
            })
            .catch(e => reject(e));
        });
      }

  

But the following block is not executed.


    .then(buffer => {
              this.ionLoader.showAlert('2:'+buffer);
              console.log("makefileintoblob buffernew: " +buffer);
              let imgBlob = new Blob([buffer], {
                type: "video/MOV"
              });
              console.log(imgBlob.type, imgBlob.size);
              resolve({
                fileName,
                imgBlob
              });

I have already installed the packages: npm install --save @ionic-native/file-transfer npm install cordova-plugin-file-transfer npm install cordova-plugin-file

Can anyone please help me to resolve this issue.


Solution

  • I cannot convert the video to blob for iOS. So I send the video to server through API. Find the link below:

    upload file to server using ionic framework and web api