Skip to main content

Dotnet Core GraphQL API Authorization

Introduction:

GraphQL API Authorization can be done by implementing GraphQL.Validation.IValidationRule. By implementing IValidationRule we have to implement our own custom rules for validating queries. So we can implement our own custom logic for authorization. IValidationRule is the perfect way of implementing authorization because these rules always get executed prior to the query execution.

Here we are going to implement a sample of GraphQL API protecting it by creating claims-based authorization. To know more about GrapQL API Integration In Asp.Net Core Application Click Here.

Identity Server4 Token Based Authentication:

In this sample, we are going to use token-based authentication by IdentityServer 4. If you want you can use any other authentication type like cookie authentication or OAuth2.0 or Microsoft Login Identity. Click here for Identity Server4 Sample Source Code.

Dotnet Core Web API Verify IdentityServer4 Authentication Token:

Let's create a Dotnet Core Web API project, where we are going to configure and protect GraphQL API.
       

Note:- Following steps are related verifying the IdentityServer4 authentication token, you can skip the following configurations if you are using another login types.

Add the following NuGet for Bearer Token verification
   Install-Package Microsoft.AspNetCore.Authentication.JwtBearer -Version 3.1.0

Now configure JwtBearer token services

Startup.cs:(ConfigureServices method)

services.AddAuthentication("Bearer")
.AddJwtBearer("Bearer", options =>
{
 options.Authority = "https://localhost:5001";
 options.Audience = "graphQLApi";
});
Add Authentication middleware service just above Authorization middleware service

Startup.cs:(Configure method)

app.UseAuthentication();

Configure DbContext And Repositories To Access Data:

Let's quickly add DbContext and Repository entities to access the data from the database.

Models/Cake.cs:

public class Cake
{
public int Id { get; set; }
public string Name { get; set; }
public decimal Cost { get; set; }
}
Install EntityFrameworkCore NuGet as below
   Install-Package Microsoft.EntityFrameworkCore -Version 3.1.0

Data/BakeryContext.cs:

using Microsoft.EntityFrameworkCore;
using Test.GraphQL.MyCoreAPI.Models;
namespace Test.GraphQL.MyCoreAPI.Data
{
    public class BakeryContext:DbContext
    {
        public BakeryContext(DbContextOptions<BakeryContext> options) : base(options)
        {
        }
        public DbSet<Cake> Cake { get; set; }
    }
}

Now install EntityFrameworkCore SqlServer
     Install-Package Microsoft.EntityFrameworkCore.SqlServer -Version 3.1.0

Register DbContext in Startup services as below

Startup.cs(ConfigureServices method):

services.AddDbContext>BakeryContext>(options =>
options.UseSqlServer(Configuration.GetConnectionString("BakeryContext")));

Add repositories as below

Repos/CakeRepository.cs:

public class CakeRepository : ICakeRepository
{
 private readonly BakeryContext _bakeryContext;
 public CakeRepository(BakeryContext bakeryContext)
 {
  _bakeryContext = bakeryContext;
 }

 public List>Cake< GetCakes()
 {
  return _bakeryContext.Cake.ToList();
 }
}

Repos/ICakeRepository.cs:

public interface ICakeRepository
{
 List<Cake> GetCakes();
}

Now register  repositories in startup file as below

Startup.cs(ConfigureServices method):

services.AddScoped<ICakeRepository, CakeRepository>();

GraphQL NuGet:

Install following NuGet to configure GraphQL API
    Install-Package GraphQL -Version 2.4.0

ObjectGraphType OR ObjectGraphType<T>:

ObjectGraphType is one of the main building blocks in GraphQL API. In dotnet, every table will be represented by a class. These POCO classes can't be understood by GraphQL API, so for each and every class in c#, we need to create classes that inherit ObjectGraphType(these will be understood by GraphQL API). The class inherits ObjectGraphType need to register all the fields in its constructor because only registered fields will be served by the GraphQL API.

GraphQLModels/CakeType:

using GraphQL.Types;
using Test.GraphQL.MyCoreAPI.Models;
namespace Test.GraphQL.MyCoreAPI.GraphQLModel
{
    public class CakeType : ObjectGraphType<Cake>
    {
        public CakeType()
        {
            Field(_ => _.Id);
            Field(_ => _.Name);
            Field(_ => _.Cost);
        }
    }
}
Here CakeType inheriting ObjectGraphType<Cake>. CakeType is a GrpahQL API Type of Cake Class. In Constructor, we register all the fields of Cake class into the CakeType class(GraphQL API Type).

GraphQLModels/RootQueryType.cs:

using GraphQL.Types;
using Test.GraphQL.MyCoreAPI.Repos;

namespace Test.GraphQL.MyCoreAPI.GraphQLModel
{
    public class RootQueryType : ObjectGraphType
    {
        public RootQueryType(ICakeRepository cakeRepository)
        {
            Field<ListGraphType<CakeType>>("allCakes", resolve: context =>
             {
                 return cakeRepository.GetCakes();
             });
        }
    }
}
RootQueryType is a parent of all other classes which inherits ObjectGraphType. In this class, we need to register all our select API queries. Every field in this class represents an API select query.

GraphQL API is fully supported with dependency injection, so every class which inherits ObjectGraphType needs to be registered in startup services.

Startup.cs(ConfigureServices method):

services.AddScoped<RootQueryType>();
services.AddScoped<CakeType>();

GraphQL Schema:

GraphQL Schema is an execution point for any select query or mutation query(query to update the data in database)

GraphQLModel/RootSchema:

using GraphQL;
using GraphQL.Types;

namespace Test.GraphQL.MyCoreAPI.GraphQLModel
{
    public class RootSchema : Schema, ISchema
    {
        public RootSchema(IDependencyResolver resolver) : base(resolver)
        {
            Query = resolver.Resolve<RootQueryType>();
        }
    }
}
Now register IDependencyResolver and RootSchema in startup services

Startup.cs(ConfigureServices method):

services.AddScoped<IDependencyResolver>(_ => new FuncDependencyResolver(_.GetRequiredService));
services.AddScoped<ISchema, RootSchema>();

Create An GraphQL EndPoint:

Models/GraphQLQueryDto.cs:

public class GraphQLQueryDto
{
 public string Query { get; set; }
}

Controller/GraphQLController:

using System.Linq;
using System.Threading.Tasks;
using GraphQL;
using GraphQL.Types;
using Microsoft.AspNetCore.Mvc;
using Test.GraphQL.MyCoreAPI.Models;

namespace Test.GraphQL.MyCoreAPI.Controllers
{
    [Route("graphql")]
    public class GraphQLController : Controller
    {
        private readonly ISchema _schema;
        private readonly IDocumentExecuter _executer;
        public GraphQLController(ISchema schema, IDocumentExecuter executer)
        {
            _schema = schema;
            _executer = executer;
        }

        [HttpPost]
        public async Task Post([FromBody] GraphQLQueryDto query)
        {
            var result = await _executer.ExecuteAsync(_ =>
            {
                _.Schema = _schema;
                _.Query = query.Query;
               
            }).ConfigureAwait(false);

            if (result.Errors?.Count > 0)
            {
                return Problem(detail: result.Errors.Select(_ => _.Message).FirstOrDefault(), statusCode: 500);
            }
            return Ok(result.Data);
        }
    }
}

Startup.cs(ConfigureServices):

services.AddSingleton<IDocumentExecuter, DocumentExecuter>();

GraphL Test Query:

query 
{ 
  allCakes
  {
 id 
 name
  } 
}
Now test the API as below
       

Implement IValidationRule To Allow Authenticated User:

Now to write validation rules we need to implement IValidationRule interface as below

Helper/AuthValidationRule:

using System.Security.Claims;
using GraphQL.Validation;

namespace Test.GraphQL.MyCoreAPI.Helper
{
    public class AuthValidationRule : IValidationRule
    {
        public INodeVisitor Validate(ValidationContext context)
        {
            var userContext = context.UserContext as ClaimsPrincipal;
            var authenticated = userContext?.Identity?.IsAuthenticated ?? false;


            return new EnterLeaveListener(_ =>
            {
                if (!authenticated)
                {
                    context.ReportError(new ValidationError(
                        context.OriginalQuery,
                        "authentication-required",
                        "Api can accessed by only autherized user"
                        ));
                }
            });
        }
    }
}
On implementing the IValidationRule interface we need to implement Validate method as above. From ValidationContext we can get ClaimsPrincipal to check user authenticated. If the user not authenticated we can return custom error using the ValidationError entity.

Now register our AuthValidationRule in startup services

Startup.cs(ConfigureServices):

services.AddSingleton<IValidationRule, AuthValidationRule>();
Now we need to pass the validation rules to IDocumentExecuter so that validation rules get executed before any query execution.

Controller/GraphQLController.cs:(Inject IValidationRule)

private readonly IValidationRule _validationRule;

public GraphQLController(
 IValidationRule validationRule)
{
 _validationRule = validationRule;
}

Controller/GraphQLController.cs:(assign IvalidationRule to IDocumentExecuter):

var result = await _executer.ExecuteAsync(_ =>
{
 _.ValidationRules = new List<IValidationRule> { _validationRule };
   
}).ConfigureAwait(false);
Now try to access the endpoint we can see an error like need authentication to access API as below
     
Now request API endpoint by adding Authorization header with IdentityServer4 token as below
   
Now try to access the endpoint, we can see the same error as not authenticated, this because if you recall IValidationRule above we discussed, there we are using 'ValidationContext.UserContex'  which is empty. We need to pass user data to the GraphQL context, we can achieve it bypassing the user data to IDocumentExecuter.

Controller/GraphQLController.cs:(inject httpContext where user context can access):

private readonly IHttpContextAccessor _httpContextAccessor;
public GraphQLController(
 IHttpContextAccessor httpContextAccessor)
{
 _httpContextAccessor = httpContextAccessor;
}

[HttpPost]
public async Task<IActionResult> Post([FromBody] GraphQLQueryDto query)
{
// display purpose existing code hidden
 var result = await _executer.ExecuteAsync(_ =>
 {
  
  _.UserContext = _httpContextAccessor.HttpContext.User;
    
 }).ConfigureAwait(false);

}

Startup.cs:

services.AddSingleton<IHttpContextAccessor, HttpContextAccessor>();
Now if we test API with the access token in authorization header we can see we are able to access GraphQL API endpoint successfully.

Operation Level Authentication:

In GraphQL API using IValidationRule able to setup authentication rules based on "GraphQL.Language.AST.Operation". The two main GraphQL operations like 'Query Operation' represent API data fetching and 'Mutation Operation' represents API posting data.

Now to enable user authentication mandatory while fetching data update validation rule as below

Helper/AuthValidationRule:(authentication while fetching data)

return new EnterLeaveListener(_ =>
{
_.Match<Operation>(op =>
{
 if (op.OperationType == OperationType.Query && !authenticated)
 {
  context.ReportError(new ValidationError(
   context.OriginalQuery,
   "auth-required",
   $"Authorization is required to fetch data",
   op));
 }
});
});
Similarly to enable user authentication while saving data to API change the operation types as 'OperationType.Mutation'.

Claim-based Authorization At Field:

Claim-based authorization at fields in root Query or root Mutation is the best approach in GraphQL.
Now we need to register fields with their respective claims if needed. Let's recall our RootQuery field which is looks as below.
Field<ListGraphType<CakeType>>("allCakes", resolve: context =>
{
return cakeRepository.GetCakes();
});
A field variable is of type 'GraphQL.Types.FieldTypes'. GraphQL.Types.FieldTypes implements IProviderMetaData which looks as below.

IProviderMetaData(GraphQL Library Interface):

namespace GraphQL.Types
{
    public interface IProvideMetadata
    {
        IDictionary<string, object> Metadata { get; }

        TType GetMetadata<TType>(string key, TType defaultValue = default);
        bool HasMetadata(string key);
    }
}
From the above interface MetaData property of the dictionary, will be used to add permission to the fields.

Let's implement an extension method to add claims to the fields in Root Query or Root Mutation.

Extens/PermissionExtention.cs:

public static class PermissionExtenstion
{
 public static readonly string PermissionKey = "permission";
 
 public static void AddPermissions(this IProvideMetadata type, string claim)
 {
  var permissions = type.GetMetadata<List<string>>(PermissionKey);
  if (permissions == null)
  {
   permissions = new List<string>();
  }
  permissions.Add(claim);
  type.Metadata[PermissionKey] = permissions;
 }
}
Here we can see claims string added to Metadata Property of IProvideMetadata. This stored claims will be checked in validation rules in later steps.

Now we need to update the field with its claim so that it will be accessed to the users having that claim.

GraphQLModel/RootQueryType(Update field with claim):

Field<ListGraphType<CakeType>>("allCakes", resolve: context =>
{
 return cakeRepository.GetCakes();
}).AddPermissions("super admin");
Only "super admin" have permission to access this query field.

We have a method to add claims, now we need to write an extension to match the claim as below

Extens/PermissionExtentsion.cs:(add below method)

public static bool HasClaimsMatched(this IProvideMetadata type, IEnumerable<string> claimes)
{
 var permissions = type.GetMetadata<IEnumerable<string>>(PermissionKey, new List<string> { });
 return permissions.Any(x => claimes.Contains(x));
}

Now we need to update validation rules to check matching claim existed as below:

Helper/AuthValidationRule.cs:

public class AuthValidationRule : IValidationRule
{
 public INodeVisitor Validate(ValidationContext context)
 {
  var userContext = context.UserContext as ClaimsPrincipal;
  var authenticated = userContext?.Identity?.IsAuthenticated ?? false;


  return new EnterLeaveListener(_ =>
  {
   _.Match<Field>(fieldAst =>
   {
    var fieldDef = context.TypeInfo.GetFieldDef();
    var claims = userContext.Claims.Select(_ => _.Value).ToList();
    if (
     (!authenticated || !fieldDef.HasClaimsMatched(claims)))
    {
     context.ReportError(new ValidationError(
      context.OriginalQuery,
      "auth-required",
      $"You are not authorized to run this query.",
      fieldAst));
    }
   });
  });
 }
}
Here context.TypeInfo gets the information about the query field type. Here we are checking our login claims with the field registered claims using the extension method HasClaimsMatched.

Now test the API with the access token in the authorization header with appropriate user claims. we are able to access the data from GraphQL endpoint.

If we observe the validation rules has been implemented like only authenticated user with appropriate claims can access the data from GrpahQL endpoint. But in some applications have a combination of accessing data with and without authentication. In those scenarios, our rules will be failed.

So we need to identify our fields have been registered with claims or not. If any field doesn't have claims registered then we can allow the user to access those fields without checking for authentication

Let's implement a new extension method to check whether the field in RootQuery has been registered with any claim as below

Extens/PermissionExtension.cs:

public static bool AnyPermissions(this IProvideMetadata type)
{
 var permissions = type.GetMetadata<IEnumerable<string>>(PermissionKey, new List<string> { });
 return permissions.Any();
}
Now update the validation rules as below:

 Helper/AuthValidationRule.cs:

_.Match<Field>(fieldAst =>
{
 var fieldDef = context.TypeInfo.GetFieldDef();
 var claims = userContext.Claims.Select(_ => _.Value).ToList();
 if (fieldDef.AnyPermissions() &&
  (!authenticated || !fieldDef.HasClaimsMatched(claims)))
 {
  context.ReportError(new ValidationError(
   context.OriginalQuery,
   "auth-required",
   $"You are not authorized to run this query.",
   fieldAst));
 }
});
Here 'fieldDef.AnyPermissions()' check whether the GraphQL field registered with claims or not. Now we can access both query fields with and without user claims.

Support Me!
Buy Me A Coffee PayPal Me 

Wrapping Up:

Hopefully, this article will help to implement GraphQL API authorization in the Dotnet core. I will love to have your feedback, suggestions and better techniques in the comments section.

Refer:

Follow Me:

Comments

  1. This is exactly what i was looking for. Thank you for posting!

    ReplyDelete
  2. var permissions = type.GetMetadata>(PermissionKey, new List { }); throws "Unable to cast string to IEnumerable" exception if there is only one permission set for the field type.

    ReplyDelete
    Replies
    1. sorry, pls ignore my error above. I wrongly set string, not IEnumerable to metadata.

      Delete
  3. 2.4.0 version of GraphQL is used. When I tried with latest version i.e 4.5.0 it has breaking changes.

    ReplyDelete

Post a Comment

Popular posts from this blog

Angular 14 Reactive Forms Example

In this article, we will explore the Angular(14) reactive forms with an example. Reactive Forms: Angular reactive forms support model-driven techniques to handle the form's input values. The reactive forms state is immutable, any form filed change creates a new state for the form. Reactive forms are built around observable streams, where form inputs and values are provided as streams of input values, which can be accessed synchronously. Some key notations that involve in reactive forms are like: FormControl - each input element in the form is 'FormControl'. The 'FormControl' tracks the value and validation status of form fields. FormGroup - Track the value and validate the state of the group of 'FormControl'. FormBuilder - Angular service which can be used to create the 'FormGroup' or FormControl instance quickly. Form Array - That can hold infinite form control, this helps to create dynamic forms. Create An Angular(14) Application: Let'

.NET 7 Web API CRUD Using Entity Framework Core

In this article, we are going to implement a sample .NET 7 Web API CRUD using the Entity Framework Core. Web API: Web API is a framework for building HTTP services that can be accessed from any client like browser, mobile devices, and desktop apps. In simple terminology API(Application Programming Interface) means an interface module that contains programming functions that can be requested via HTTP calls either to fetch or update data for their respective clients. Some of the Key Characteristics of API: Supports HTTP verbs like 'GET', 'POST', 'PUT', 'DELETE', etc. Supports default responses like 'XML' and 'JSON'. Also can define custom responses. Supports self-hosting or individual hosting, so that all different kinds of apps can consume it. Authentication and Authorization are easy to implement. The ideal platform to build the REST full services. Install The SQL Server And SQL Management Studio: Let's install the SQL server on our l

ReactJS(v18) JWT Authentication Using HTTP Only Cookie

In this article, we will implement the ReactJS application authentication using the HTTP-only cookie. HTTP Only Cookie: In a SPA(Single Page Application) Authentication JWT token either can be stored in browser 'LocalStorage' or in 'Cookie'. Storing the JWT token inside of the cookie then the cookie should be HTTP Only. The HTTP-ONly cookie nature is that it will be only accessible by the server application. Client apps like javascript-based apps can't access the HTTP-Only cookie. So if we use the authentication with HTTP-only JWT cookie then we no need to implement the custom logic like adding authorization header or storing token data, etc at our client application. Because once the user authenticated cookie will be automatically sent to the server by the browser on every API call. Authentication API: To authenticate our client application with JWT HTTP-only cookie, I developed a NetJS(which is a node) Mock API. Check the GitHub link and read the document on G

.NET6 Web API CRUD Operation With Entity Framework Core

In this article, we are going to do a small demo on AspNetCore 6 Web API CRUD operations. What Is Web API: Web API is a framework for building HTTP services that can be accessed from any client like browser, mobile devices, desktop apps. In simple terminology API(Application Programming Interface) means an interface module that contains a programming function that can be requested via HTTP calls to save or fetch the data for their respective clients. Some of the key characteristics of API: Supports HTTP verbs like 'GET', 'POST', 'PUT', 'DELETE', etc. Supports default responses like 'XML' and 'JSON'. Also can define custom responses. Supports self-hosting or individual hosting, so that all different kinds of apps can consume it. Authentication and Authorization are easy to implement. The ideal platform to build REST full services. Create A .NET6 Web API Application: Let's create a .Net6 Web API sample application to accomplish our

Angular 14 State Management CRUD Example With NgRx(14)

In this article, we are going to implement the Angular(14) state management CRUD example with NgRx(14) NgRx Store For State Management: In an angular application to share consistent data between multiple components, we use NgRx state management. Using NgRx state helps to avoid unwanted API calls, easy to maintain consistent data, etc. The main building blocks for the NgRx store are: Actions - NgRx actions represents event to trigger the reducers to save the data into the stores. Reducer - Reducer's pure function, which is used to create a new state on data change. Store - The store is the model or entity that holds the data. Selector - Selector to fetch the slices of data from the store to angular components. Effects - Effects deals with external network calls like API. The effect gets executed based the action performed Ngrx State Management flow: The angular component needs data for binding.  So angular component calls an action that is responsible for invoking the API call.  Aft

Angular 14 Crud Example

In this article, we will implement CRUD operation in the Angular 14 application. Angular: Angular is a framework that can be used to build a single-page application. Angular applications are built with components that make our code simple and clean. Angular components compose of 3 files like TypeScript File(*.ts), Html File(*.html), CSS File(*.cs) Components typescript file and HTML file support 2-way binding which means data flow is bi-directional Component typescript file listens for all HTML events from the HTML file. Create Angular(14) Application: Let's create an Angular(14) application to begin our sample. Make sure to install the Angular CLI tool into our local machine because it provides easy CLI commands to play with the angular application. Command To Install Angular CLI npm install -g @angular/cli Run the below command to create the angular application. Command To Create Angular Application ng new name_of_your_app Note: While creating the app, you will see a noti

Unit Testing Asp.NetCore Web API Using xUnit[.NET6]

In this article, we are going to write test cases to an Asp.NetCore Web API(.NET6) application using the xUnit. xUnit For .NET: The xUnit for .Net is a free, open-source, community-focused unit testing tool for .NET applications. By default .Net also provides a xUnit project template to implement test cases. Unit test cases build upon the 'AAA' formula that means 'Arrange', 'Act' and 'Assert' Arrange - Declaring variables, objects, instantiating mocks, etc. Act - Calling or invoking the method that needs to be tested. Assert - The assert ensures that code behaves as expected means yielding expected output. Create An API And Unit Test Projects: Let's create a .Net6 Web API and xUnit sample applications to accomplish our demo. We can use either Visual Studio 2022 or Visual Studio Code(using .NET CLI commands) to create any.Net6 application. For this demo, I'm using the 'Visual Studio Code'(using the .NET CLI command) editor. Create a fo

Part-1 Angular JWT Authentication Using HTTP Only Cookie[Angular V13]

In this article, we are going to implement a sample angular application authentication using HTTP only cookie that contains a JWT token. HTTP Only JWT Cookie: In a SPA(Single Page Application) Authentication JWT token either can be stored in browser 'LocalStorage' or in 'Cookie'. Storing JWT token inside of the cookie then the cookie should be HTTP Only. The HTTP-Only cookie nature is that it will be only accessible by the server application. Client apps like javascript-based apps can't access the HTTP-Only cookie. So if we use authentication with HTTP only JWT cookie then we no need to implement custom logic like adding authorization header or storing token data, etc at our client application. Because once the user authenticated cookie will be automatically sent to the server by the browser on every API call. Authentication API: To implement JWT cookie authentication we need to set up an API. For that, I had created a mock authentication API(Using the NestJS Se

ReactJS(v18) Authentication With JWT AccessToken And Refresh Token

In this article, we are going to do ReactJS(v18) application authentication using the JWT Access Token and Refresh Token. JSON Web Token(JWT): JSON Web Token is a digitally signed and secured token for user validation. The JWT is constructed with 3 important parts: Header Payload Signature Create ReactJS Application: Let's create a ReactJS application to accomplish our demo. npx create-react-app name-of-your-app Configure React Bootstrap Library: Let's install the React Bootstrap library npm install react-bootstrap bootstrap Now add the bootstrap CSS reference in 'index.js'. src/index.js: import 'bootstrap/dist/css/bootstrap.min.css' Create A React Component 'Layout': Let's add a React component like 'Layout' in 'components/shared' folders(new folders). src/components/shared/Layout.js: import Navbar from "react-bootstrap/Navbar"; import { Container } from "react-bootstrap"; import Nav from "react-boot

A Small Guide On NestJS Queues

NestJS Application Queues helps to deal with application scaling and performance challenges. When To Use Queues?: API request that mostly involves in time taking operations like CPU bound operation, doing them synchronously which will result in thread blocking. So to avoid these issues, it is an appropriate way to make the CPU-bound operation separate background job.  In nestjs one of the best solutions for these kinds of tasks is to implement the Queues. For queueing mechanism in the nestjs application most recommended library is '@nestjs/bull'(Bull is nodejs queue library). The 'Bull' depends on Redis cache for data storage like a job. So in this queueing technique, we will create services like 'Producer' and 'Consumer'. The 'Producer' is used to push our jobs into the Redis stores. The consumer will read those jobs(eg: CPU Bound Operations) and process them. So by using this queues technique user requests processed very fastly because actually