paint-brush
How to Add GraphQL Wrapper Over REST API by@ssukhpinder
1,054 reads
1,054 reads

How to Add GraphQL Wrapper Over REST API

by Sukhpinder SinghNovember 16th, 2022
Read on Terminal Reader
Read this story w/o Javascript
tldt arrow

Too Long; Didn't Read

The problem of generating helpful documentation and help pages for Web APIs is solved with swagger. Now.Net project is by default enabled with Swagger, as shown on the localhost URL. The problem is to generate helpful documentation for Web.Net Web API pages. Swagger.Net allows you to ask for what you want in a single query, save bandwidth, and reduce requests. The following steps are followed by the NSwag tool and a GraphQL wrapper for GraphQL. The guide is based on the current version of this article.

Companies Mentioned

Mention Thumbnail
Mention Thumbnail
featured image - How to Add GraphQL Wrapper Over REST API
Sukhpinder Singh HackerNoon profile picture


Learning Objectives

  • How to add GraphQL wrapper
  • How to use the NSwag tool to generate code

Prerequisites

  • Require “HotChocolate.AspNetCore” from the NuGet package.
  • Require .Net 5 Framework.
  • Visual Studio IDE.
  • Understanding of .Net Web API project.
  • Basic knowledge of Swagger UI.

Getting Started

GraphQL allows you to ask for what you want in a single query, save bandwidth, and reduce requests.

Step 1: Create a new project

Create a new project in Core Web API template for this article demonstration, as shown below.

The problem of generating helpful documentation and help pages for Web APIs. Now .Net project is by default enabled with swagger, as shown on the localhost URL


Step 2: Add GraphQL packages

Install the “HotChocolate.AspNetCore” package from the NuGet gallery into the newly created solution in Visual Studio.

Step 3: Generate Manifest file

Go to file explorer > project folder and run the following command using the Dotnet Global tool.
dotnet new tool-manifest


and Install the NSwag tool
dotnet tool install NSwag.ConsoleCore

Step 4: Create swagger.json

Create a swagger JSON file in the project directory using the below command
curl <SwaggerJsonFilePath> > swagger.json


Click as highlighted below know the swagger JSON file path

Example
curl //localhost:44323/swagger/v1/swagger.json > swagger.json

Step 5: Generate service files

Generate REST service file using the below command with respective namespace and class name.
dotnet nswag swagger2csclient 
/input:swagger.json 
/classname:<Clasname> 
/namespace:<Namespace>
/output:<OutputFile>


Example
dotnet nswag swagger2csclient 
/input:swagger.json 
/classname:RestClass
/namespace:RestNamespace 
/output:ToDoService.cs

Step 6: Update the base URL

Update the base URL in generated “ToDoService” file.

Step 7: Configure GraphQL Playground

Attach playground inside the ConfigureServices method in the “Startup.cs” file
public void ConfigureServices(IServiceCollection services){

services.AddHttpClient<RestClass>();
  services
   .AddRouting()
   .AddGraphQLServer()
   .AddQueryType<Query>();
}


Create GraphQL Query class as follows
public class Query
{
	public async Task<ICollection<TodoReader.WeatherForecast>> GetTodosAsync(
		[Service] TodoService service,
		CancellationToken cancellationToken)
	{
		return await service.WeatherForecastAsync(cancellationToken);
	}

}


Map GraphQL in Configure method
app.UseEndpoints(endpoints =>
{
  endpoints.MapControllers();
  endpoints.MapGraphQL();
});

Step 8: Run the playground

Browse the localhost URL at route “/graphql,” and the following GraphQL playground will be displayed.

That’s it, successfully integrated GraphQL playground to the .Net REST API along with swagger.

GitHub Sample

Live Demo


Thank you for reading, and I hope you liked the article. Please provide your feedback in the comment section.

Follow me on , , , , , , ,


Also published .


바카라사이트 바카라사이트 온라인바카라