Call REST API from ASP NET Core Blazor

How to call and consume a REST API from ASP.NET Core Blazor application.
Text Article and Slides
www.pragimtech.com/blog/blazo...
Healthy diet is very important for both body and mind. We want to inspire you to cook and eat healthy. If you like Aarvi Kitchen recipes, please support by sharing, subscribing and liking.
/ @aarvikitchen5572
Blazor tutorial for beginners
• Blazor tutorial for be...
Blazor Blog
www.pragimtech.com/courses/bl...
Angular, JavaScript, jQuery, Dot Net & SQL Playlists
kzbin.info...
Let's gift education together
/ kudvenkat

[@Alex-bc3tt]

I needed this so much, you saved me from a deadline. Thank you So Much

[@jayantlalguru6780]

Here is a small piece of code to call the API. This is generic so that we don't need to write the code again and again. //THE INTERFACE public interface IApiHandler { Task GetAsync(string url); } //THE IMPLEMENTATION TO CALL THE API public class ApiHandler : IApiHandler { private readonly HttpClient _httpClient; public ApiHandler(HttpClient httpClient) { _httpClient = httpClient; } public async Task GetAsync(string url) { return await _httpClient.GetJsonAsync(url); } //TODO //CODE FOR POST, PUT, DELETE CAN BE ADDED } //THE STARTUP CLASS services.AddHttpClient(client => { client.BaseAddress = new Uri("localhost:44336/"); //ADD YOUR BASE URL INSIDE THE BRACKET }); //CALLING THE SERVICE(ApiHandler) public class EmployeeListBase : ComponentBase { [Inject] private IApiHandler _apiHandler { get; set; } public IEnumerable Employees { get; set; } protected override async Task OnInitializedAsync() { Employees = await _apiHandler.GetAsync("api/Employees/GetEmployees"); } }

[@LetCode96666]

Love this playlist!

[@AniketRamekar]

Very good tutorial Venkat. Thank you.

[@eeveeadm8367]

Thank You Sir. God Bless You.

[@alihaydar3021]

I really like your work arrangements .. just wondering why you didn't use generic repository and unit of work .. it's more usable

[@Rajeshsingh-ws5th]

Great Venkat.

[@yyttommy2456]

Great, I do it. Thank you very much, please keeping up

[@CCPony]

I love the Venkat!

[@first8208]

a great video! thanks

[@cristians2976]

You are doing an excellent job

[@BCLBlazorCollectionsLibrary]

Exactly, I love his every blazor tutorial :)

[@zorigdavaag.8354]

Thank you so much. I have a question. what is the alternatives for Microsoft.AspNetCore.Components namespace since this is in preview

[@kameshp68]

Nice presentation

[@jamaissans2377]

Thank you Mr.

[@kalapalababurao1788]

Microsoft.AspNetCore.Blazor.HttpClient NuGet package is not available to download, however I searched in google and downloaded that package of version 3.2.0-preview3.20168.3 depricated. it is working to extract data from database using EFC and using API , but it is not working for Blazor app EmployeeListDetails :Shall you please provide that NuGet package.

[@keshavprasad]

I am getting the same problem. Did you find any alternate solution for this?

[@rainron2664]

Sir may i ask, why you are using Httpclientfactory instead of signalr to connect to the API? Like what the browser does to connect to blazor server? thank you in advance.😊😊

[@nichodemusomedo4]

Thank you. I would like to let you know that while testing on creating a new employee, I happened to find a false error of email address already exists for a new client and new email address, I ran the application in debug mode and postman for this very lesson. It would be nice to give an explanation as to why that happened as I was expecting to commit the new employee without any problem.

[@ernanmaisels]

Thanks a lot for all your great tutorials. about this video - in 3:20 you are talking about Startup.cs file. but in web assembly project, there is just Program.cs file.

[@Nynxxx]

I am not sure if you needed anything clarified, but he did mention that this video series is just going to cover Blazor Server and not Blazor WASM.

[@SupunNimantha]

same issue . have you resolved this ?

[@ernanmaisels]

@@SupunNimantha Yes. just use the program.cs file and insert all your services on Main method. Good luck!

[@SupunNimantha]

@@ernanmaisels yeah that worked. I had some services

[@EduardoSantos-tr4gb]

And what about the localhost url u do something?

[@sabrinadiaf3230]

please sir what do you think about using Refit and create an SDK to consume the API?

[@sathishkomakul]

Plz start tutorial of C# WPF

[@aikidoshi007]

Thanks Venkat, great job. I've been doing my head in trying to get this very thing working and here it all is in one tidy package. When the product is deployed the hard-coded base URL will not work, how would you set that up so it can be different and automatically set in each deployment environment please?

[@AniketRamekar]

It depends based on how secure you want things to be. You can use appsettings.{Environment}.json files (link1), or go all out with app secrets (link2) link1:docs.microsoft.com/en-us/aspnet/core/fundamentals/environments?view=aspnetcore-3.1 link2:docs.microsoft.com/en-us/aspnet/core/security/app-secrets?view=aspnetcore-3.1&tabs=windows

[@aikidoshi007]

@@AniketRamekar Thanks Aniket, sorry for the late response, I've been so busy, now getting back to Blazor.

[@EngDuraid]

Thank you but i tried to use a generic service instead (ApiService) which implement (IApiService) then i tried to register it the same way you did but that didn't work can you please tell me a hint how to achieve this please.

[@Beji-boy]

I get it "An unhandled exception occurred while processing the request. JsonReaderException: '

[@ronswanson9635]

I did a blunder while posting in postman, I posted it in different format and not in JSON. I cannot load the details on that page, but I am able to retrieve employees/1 or employees/2 except for the one that I wrongly posted. I do not know how to delete it as I tried to delete it, it showed some error. Anyone help me with this

[@HRJosef]

Is somewhere avaiable source code? I missed something and i would like to compare?

[@vinitmishra9337]

Sir can i get any help in vb.net chats formation with chart.js and sql

[@pylvr8021]

can someone please explain to me why he uses services to call rest api when he already have a class library , when should we use class library or services

[@rohhappyness7297]

I canot call api in employee service to consume any one can help?

[@EnriqueElcamel]

Hello, I'm having this weird error "System.Text.Json.JsonException: '

[@ManuelHernandez-vi1it]

I am getting this issue : SocketException: An existing connection was forcibly closed by the remote host. Unknown location IOException: Unable to read data from the transport connection: An existing connection was forcibly closed by the remote host.. System.Net.Sockets.Socket+AwaitableSocketAsyncEventArgs.ThrowException(SocketError error, CancellationToken cancellationToken) HttpRequestException: The SSL connection could not be established, see inner exception. System.Net.Http.ConnectHelper.EstablishSslConnectionAsyncCore(Stream stream, SslClientAuthenticationOptions sslOptions, CancellationToken cancellationToken)

[@Rajeshsingh-ws5th]

take care of your health due to covid-19

[@moawadabdelbasset9896]

thanks for you how can i call the REST API in xamarin forms

[@AniketRamekar]

use HttpClient, refer: docs.microsoft.com/en-us/xamarin/xamarin-forms/data-cloud/web-services/rest

[@stefanvettiger6308]

The method "OnInitializedAsync" in the class "EmployeeListBase" of the Web project is called automatically twice when i run the project! Why?

[@user-rk5rv9jq3i]

search on stackoverflow

[@mozaherhossain1036]

I got an Error while call rest api in blazor. The error is -> "AuthenticationException: The remote certificate is invalid according to the validation procedure. System.Net.Security.SslStream.StartSendAuthResetSignal(ProtocolToken message, AsyncProtocolRequest asyncRequest, ExceptionDispatchInfo exception) HttpRequestException: The SSL connection could not be established, see inner exception. System.Net.Http.ConnectHelper.EstablishSslConnectionAsyncCore(Stream stream, SslClientAuthenticationOptions sslOptions, CancellationToken cancellationToken)". What should I do, please suggest me. Thank you...

[@Desperate4Freedom.]

Reinstall windows .

[@gulshan803]

Hi, i am facing this "The remote certificate is invalid according to the validation procedure. " issue while consuming rest API on "return await httpclient.getjsonasync(Employee[])("api/employee")". plz help me for the same...

[@Desperate4Freedom.]

Reinstall windows .

[@siddharthsharma2791]

Sir can you Suggest me how can i use web Api in Razor pages in this way

[@renusai23]

hi, i am getting data not retrieved server error 500

[@mytrolls5866]

why again server? already if we have web app very confusing please clear

[@Rajeshsingh-ws5th]

Most of the time, my seniors (some of them worked with Microsoft as well) suggested me not to use EF in our project. If this is true, why so?

[@vladnik8115]

What do they offer to use instead of EF ? (write EF by yourself! :) )

[@chezchezchezchez]

vlad nik dapper and SimpleCRUD. Your welcome! 👊🏻

[@vladnik8115]

@@chezchezchezchez How will you work with multiple related tables with a dapper? Can you give a link to examples?

[@amer-ik7jj]

An unhandled exception occurred while processing the request. AuthenticationException: The remote certificate is invalid according to the validation procedure. System.Net.Security.SslStream.StartSendAuthResetSignal(ProtocolToken message, AsyncProtocolRequest asyncRequest, ExceptionDispatchInfo exception) HttpRequestException: The SSL connection could not be established, see inner exception. System.Net.Http.ConnectHelper.EstablishSslConnectionAsyncCore(Stream stream, SslClientAuthenticationOptions sslOptions, CancellationToken cancellationToken)

[@amer-ik7jj]

services.AddHttpClient(client => { client.BaseAddress = new Uri("localhost:44330/"); }) .ConfigurePrimaryHttpMessageHandler(sp => new HttpClientHandler { AllowAutoRedirect = false, ServerCertificateCustomValidationCallback = (message, certificate2, arg3, arg4) => true, SslProtocols = SslProtocols.Tls | SslProtocols.Tls11 | SslProtocols.Tls12 }); this solve problem

[@Desperate4Freedom.]

Reinstall windows .

[@njokuiyke01]

please who can help with this error: JsonException: '

[@stefanvettiger6308]

This is because you get an error response instead of the real answer. An error response is in XML format an always starts with a '

[@ranja6793]

I have the same error. Did you solved it?

[@ranja6793]

I found out the problem: services.AddHttpClient(client => { // BaseAddress where the uri is available ! client.BaseAddress = new Uri("localhost:44338/"); // Api baseadress. this is the corrent uri //client.BaseAddress = new Uri("localhost:44385/"); // server baseadress. this leads to the error });

[@tamasballai8703]

@@ranja6793 I've met with the same issue. Instead of the Api's port number I've given the Web's port number. Thank you so much for this comment, my problem has been solved.

[@EnriqueElcamel]

@@tamasballai8703 can you please elaborate this i dont understand. Thank you

[@mainframehardtutorials8441]

Can we directly call database information into the Blazor App without any Api

[@Nynxxx]

You can, but it makes your app not scalable assuming that at some point you may want to switch to Blazor WASM. EDIT: Also, creating an API to call from can make it easier to implement new apps that aren't able to talk directly to the database, such as a mobile app that also wants to use the database, I am using xamarin to make an app, and we must have an API since it is not able to directly access the database.

[@aussieraver7182]

6:59

[@rajushahi5089]

Authentication Exception: The remote certificate is invalid according to the validation procedure.

[@ajanyhc]

issue the following command: dotnet dev-certs https --trust

[@stancyvincent7550]

Where to use that command

[@maxsoftwaregraphics5714]

Dear sir null value is showing

[@maxsoftwaregraphics5714]

Please helps me

[@hughcoleman9400]

@@maxsoftwaregraphics5714 Do you have same issue as discussed by Vivek a month ago, if so I don't understand solution either.

[@hughcoleman9400]

In my case it was because in my live version I had not included the code explained in part 8, Loading indicator explained reason for error

[@wassollderscheiss33]

I run into CORS problems. Meh

[@wassollderscheiss33]

Had to do services.AddCors() in ConfigureServices(...) of WebApi project and app.UseCors(a => a.AllowAnyOrigin().AllowAnyMethod().AllowAnyHeader().SetIsOriginAllowed(b => true)) in Configure(...)

[@pankajcodesdot490]

Install-Package Microsoft.AspNetCore.Blazor.HttpClient -Version 3.2.0-preview3.20168.3 :- command

[@k.divyaswarnkar5975]

it is not available in nuget package manager can you please suggest how could i download ?