Creating An API (Part 2)

 




Adding The API Controller

Execute the following steps to create the API:

  • In the MyBlogWebAssembly.Server project, right-click on the Controllers folder and select Add | Class. Name the file MyBlogApiController.cs.

  •  Add a using statement at the top of the file.

  • Inherit from ControllerBase and add attributes.

  • Now we need to access the data through the server-side API. Add code inside the class we just created.

  • Next, we will add the code to get blog posts. Now, we have created a method that returns the data directly from the database.

  • Let's add the function to get the blog post count. We can use the Get verb but with another route.

  • We also need to be able to get one blog post.

  • Let's add an API that saves a blog post.

  • Next up, we add a method for deleting blog posts. In this case, we use the Delete verb, and also add the Authorize attribute.

  • Next, we need to do this for Categories and Tags as well.

We have an API! Now it's time to write the client that will access that API.

Creating The Client

In order to use the API, we must first create a client. The client will adhere to the same IMyBlogApi interface. This ensures that we maintain identical code regardless of which implementation we utilize, whether it's direct database access with MyBlogApiServerSide or the MyBlogApiClientSide that we will develop next:

  • Right-click on the Dependencies node under MyBlog.Data and select Manage NuGet Packages.

  • Search for Microsoft.AspNetCore.Components.WebAssembly.Authentication and click Install.

  • Also, search for Newtonsoft.Json and Microsoft.Extensions.Http and click Install.

  • We need some helper methods, so add a folder by right-clicking on MyBlog.Data, then Add | Folder, and name the folder Extensions.

  • Right-click on the new folder and select Add | Class. Name the class HttpClientExtensions.cs.

  • Add the following namespaces-

using Newtonsoft.Json;

using System.Net.Http;

using System.Threading;

  • Replace the class with the code.

  • Right-click on the MyBlog.Data project and select Add | Class. Name the class MyBlogApiClientSide.cs.

  • Open the newly created file.

  • Add IMyBlogApi to the class and make it public-

public class MyBlogApiClientSide:IMyBlogApi{}

  • Some of the API calls are going to be public (do not require authentication), but HttpClient will be configured to always require a token. So, we are going to need one authenticated HttpClient and one not authenticated HttpClient, depending on what API we are calling.

  • To be able to call the API, we need to inject HttpClient. Add the required code to the class.

  • We also need to add namespaces.

  • Now it's time to implement calls to the API.

  • Next, we add the API calls that need authentication, such as saving or deleting a blog post.

  • Now we need to do the same for Categories and Tags.

Our API client is now done!

Conclusion

We successfully learnt how to build an API along with an API client, which is a crucial component of many applications. By doing this, we are able to retrieve blog posts from our database and display them in our Blazor WebAssembly application.
































Comments

Popular posts from this blog

How AMI Store & Restore Works?

Information Protection Scanner: Resolve Issues with Information Protection Scanner Deployment

Create A Store Image Task