Adewuyi Oyawoye

Adewuyi Oyawoye

  • 1.3k
  • 408
  • 1.2k

Blazor Server-Side Progress Bar Not Updating in UI on Azure Deployment

Jan 27 2024 12:49 PM
//this code here is within my razor page

 private void HandleProgressChanged(RecordingViewModel recording)
 {
     InvokeAsync(StateHasChanged); 
   
     if (recording.PercentageProgress >= 100)
     {
         TelemetryClient.TrackEvent($"Progress reached 100% for recording {recording.RecordingId}");
     }
     else
     {
         TelemetryClient.TrackEvent($"ProgressValue changed to {recording.PercentageProgress} for recording: {recording.RecordingId}");
     }
 }

 public void Dispose()
 {
     MeetingRecordingService.OnProgressChanged -= HandleProgressChanged;
     TelemetryClient.TrackEvent("OnProgressChanged unsubscribed.");
 }

 protected override async Task OnInitializedAsync()
 {
MeetingRecordingService.OnProgressChanged += HandleProgressChanged;
}

  <AlertDialog @ref="_dialog">

      <HeadingWithIconCentered>
     Uploading Recording
     <span class="sub-heading">@_selectedMeeting?.Subject</span>
 </HeadingWithIconCentered>
 <ms-uploader>
     <label>Uploading</label>
     <progress max="100"
               value="@_currentRecordingUploading.PercentageProgress">@_currentRecordingUploading.PercentageProgress %</progress>
 </ms-uploader>
  </AlertDialog>

I'm facing a peculiar issue with a Blazor Server-Side application where a progress bar does not update on the UI during a file upload process after being deployed to Azure, although backend state changes are correctly reflected in the logs. The progress bar is bound to a RecordingViewModel that tracks the upload progress.

The application is a Microsoft Teams tab used for uploading recordings. The upload progress should be displayed on a progress bar component which binds to the PercentageProgress property of the RecordingViewModel.

When running the application locally, the progress bar updates as expected. However, after deploying to Azure and running it this is not the case. Attached is the relevant code


Answers (1)