Pfthb

I read this blog and found out about the file Transfer plugin. They used it to send a file(image) to the server. I want to send multiple file to a server one by one in a sequential order.

public uploadImage() 
 // Destination URL
 var url = "http://yoururl/upload.php";
 
 // File for Upload
 var targetPath = this.pathForImage(this.lastImage);
 
 // File name only
 var filename = this.lastImage;
 
 var options = 
 fileKey: "file",
 fileName: filename,
 chunkedMode: false,
 mimeType: "multipart/form-data",
 params : 'fileName': filename
 ;
 
 const fileTransfer: TransferObject = this.transfer.create();
 
 this.loading = this.loadingCtrl.create(
 content: 'Uploading...',
 );
 this.loading.present();
 
 // Use the FileTransfer to upload the image
 fileTransfer.upload(targetPath, url, options).then(data => 
 this.loading.dismissAll()
 this.presentToast('Image succesful uploaded.');
 , err => 
 this.loading.dismissAll()
 this.presentToast('Error while uploading file.');
 );

How can I call this code in a sequential manner, so that when one transfer finishes, another starts?

You don't need cordova-plugin-file-transfer plugin to transfer files. You can achieve this using XMLHttpRequest Native Browser API.

Below URL explains the various ways, we are transfer files to backend using XMLHTTPRequest API.

https://cordova.apache.org/blog/2017/10/18/from-filetransfer-to-xhr2.html

I'm going to assume that you have an action like a button click that triggers the upload.

• Maintain a JSON array. Each individual item containing data that you need for
  the upload such as file name, file locations, destination url.


• On every click of the upload button, push another item into this array.


• Run a loop through the JSON array. For every item, call the upload
  function. All data that you need for the upload, already exists in
  the array item.


• Once the upload is successful, remove that item from
  the array.