Azure storage javascript client: how to track upload progress using Ionic/Angular?

Question

Following this guideline sample-blob.html I want to track upload progress by getting the progress value to the DOM. I also want to print, say, 'done' in the DOM when the upload is finished. Is there a way to "subscribe" to SpeedSummary so I can get its progress value? Any other more recommended approach?

My code:

var finishedOrError = false;  
        
      var speedSummary = blobService.createBlockBlobFromBrowserFile('input-data', filename, file, {blockSize : customBlockSize}, function(error, result, response) {  
        finishedOrError = true;  
        if (error) {  
            // Upload blob failed  
            alert('Problema: Volver a intentar o contactar al administrador');  
        } else {  
            // Upload successfully  
            alert('Subida Exitosa');  
            finish_upload();  
            return result;  
        }  
      });  
        
      speedSummary.on('progress', function () {  
        var process = speedSummary.getCompletePercent();  
        displayProcess(process);  
      })  
  
      var finish_upload = function(){  
        //TODO set upload finish process  
        //this.isUploading = false; DOESN'T WORK SINCE this is speedSummary in this context  
      }  
      var displayProcess = function(process){  
        //TODO set progress indicator  
      }  

Note: I am aware of this implementation upload-to-azure-blob-storage-with-angular-7977e979496a but it gives me an error when implementing the uploadFile function. But more importantly I am looking for something more straigthforward to implement.

Answer 1

@javier-8889 Firstly, apologies for the delay in responding here and any inconvenience this issue may have caused.

I see you have posted similar question in SO forum, please refer to the suggestion. If you still facing any issue. I would recommend to kindly just re-post the question in the Developer Community and GitHub repro to receive a focused and immediate assistance from the right set of experts.. These forum community members could provide their expert guidance on your scenario based on their experience. Thanks.

Hope this helps!
Kindly let us know if the above helps or you need further assistance on this issue.

---

Please don’t forget to "Accept the answer” and “up-vote” wherever the information provided helps you, this can be beneficial to other community members.