Blazor, Httpclient, sync and async WebApi calls

Question

I'am new to Blazor wasm. Actually I have HttpClient added as singleton to the services in program.cs. Then I use a generic utility class (HttpService) where HttpClient is injected to do http calls (GetAsync, PostAsync,...). Everywhere I use async await pattern. First case: in some page I should do simultaneous get webapi calls and then when all are done do some calculations on results. Second case: in other page I have the opposed need, do a call, wait for result and then use it for a second call.

I try and I notice that my code with calls like:

HttpService:

    public async Task<dataDTO> GetData(int id)
    {
        var httpResponse = await httpService.Get<DataDTO>($"{baseURL}/{id}");

        if (!httpResponse.Success)
        {
            var msg = await httpResponse.GetBody();
            throw new ApplicationException(msg);
        }
        return httpResponse.Response;
    }

And calls in page component:

var result1 = await GetData(5000);
var result2 = await GetData(2000);
var result3 = await GetData(500);

Suppose that the parameter are milliseconds that server use to delay the response. These calls are always syncronous. The next wait the end of previous to be executed. (second case).

How to implement the first case (simultaneous calls)?

Thank you very much.

That can work for small number of paralleled requests but Blazor WASM is not really multithread, with a big number of request you gonna loose some. So don't try to send requests in parallels with Blazor WASM. Wait for .Net 6. — agua from mars
– agua from mars, Commented Nov 23, 2020 at 12:54
Ok thank you. I tried and in this case with 3 request it works fine. — andreat
– andreat, Commented Nov 23, 2020 at 14:07
Sequentialy it works, but if you use Task.WhenAll or Task.WaitAll some request can be lost. — agua from mars
– agua from mars, Commented Nov 23, 2020 at 14:20

Johnathan Barclay · Accepted Answer · 2020-11-23 12:01:59Z

3

You could use Task.WhenAll to allow them to run simultaneously:

dataDTO[] results = await Task.WhenAll(GetData(5000), GetData(2000), GetData(500));

This creates a new Task that completes when all the provided tasks have completed, and amalgamates the results into an array.

answered Nov 23, 2020 at 12:01

Johnathan Barclay

20.5k2 gold badges27 silver badges40 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

Massoud Asadi Over a year ago

how can i observe task results in blazor like we do in angular ? i mean instead of task.whenall we subscribe http calls and when the response is ready it run subscribed code or callbsck.

Brian Parker · Accepted Answer · 2020-11-23 12:02:38Z

3

var task1 =  GetData(5000);
var task2 =  GetData(2000);
var task3 =  GetData(500);

await Task.WhenAll(task1, task2, task3);

var result1 = task1.Result;
var result2 = task2.Result;
var result3 = task3.Result;

answered Nov 23, 2020 at 12:02

Brian Parker

15.1k3 gold badges41 silver badges46 bronze badges

2 Comments

Donald Duck is with Ukraine Over a year ago

While this code may answer the question, providing additional context regarding why and/or how this code answers the question improves its long-term value.

Massoud Asadi Over a year ago

how can i observe task results in blazor like we do in angular ? i mean instead of task.whenall we subscribe http calls and when the response is ready it run subscribed code or callbsck.

HMZ · Accepted Answer · 2021-07-05 10:38:56Z

3

You can fire them all at once then wait for them to complete using Task.WhenAll.

So your code would be something like this:

//Notice that we don't use await here.
var task1 = GetData(5000);
var task2 = GetData(2000);
var task3 = GetData(500);

Task ResultTask = await Task.WhenAll(new List<Task<dataDTO>> { task1 ,task2, task3 });

 if (ResultTask.Status == TaskStatus.RanToCompletion)
         Console.WriteLine("All tasks completed successfully!");
      else if (ResultTask.Status == TaskStatus.Faulted)
         Console.WriteLine("Operation failed!");

Also, you can access their result via ResultTask.Result:

foreach (var result in ResultTask.Result) 
{
  //Do stuff
}

edited Jul 5, 2021 at 10:38

answered Nov 23, 2020 at 12:01

HMZ

3,1671 gold badge23 silver badges34 bronze badges

4 Comments

Massoud Asadi Over a year ago

how can i observe task results in blazor like we do in angular ? i mean instead of task.whenall we subscribe http calls and when the response is ready it run subscribed code or callbsck.

HMZ Over a year ago

@MaasoudAsadi You don't need callbacks when you have async await، just await your http call or in this case await the WhenAll task. and your next code will be executed when the task finishes.

Massoud Asadi Over a year ago

but in subscribe the code executes and not awaited. i think ContinueWith() is the nearest answer. maybe i misunderstood subscribe. do they run concurrent ?

HMZ Over a year ago

@MaasoudAsadi I don't work with angular, but await can completely replace ContinueWith as they're similar, and await is much simpler as the latter adds more complexity, especially with error handling.

Collectives™ on Stack Overflow

Blazor, Httpclient, sync and async WebApi calls

3 Answers 3

1 Comment

2 Comments

4 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

1 Comment

2 Comments

4 Comments

Your Answer

Sign up or log in

Post as a guest

Related