Difficulty encountered when trying to apply a decorator within a permission guard

I'm a newcomer to Nestjs

and I am currently working on implementing Authorization using Casl.

To achieve this, I have created a custom decorator as shown below:

import { SetMetadata } from '@nestjs/common';

export const Permission = (action:string,subject: string) => SetMetadata(action, subject);

In addition, I have also developed a Permission guard:

import { Injectable, CanActivate, ExecutionContext } from '@nestjs/common';
import { Reflector } from '@nestjs/core';
import { Observable } from 'rxjs';
import { CaslAbilityFactory } from './ability.factory';
import { Action } from './action.enum';
import { User } from 'src/persistent/entity/user.entity';

@Injectable()
export class PermissionGuard implements CanActivate {
  constructor(
    private reflector: Reflector,
    private caslAbilityFactory: CaslAbilityFactory
  ) { }
  canActivate(
    context: ExecutionContext,
  ): boolean | Promise<boolean> | Observable<boolean> {
    const action = this.reflector.get<Action>('action', context.getHandler());
    const subject = this.reflector.get<string>('subject', context.getHandler());

    const request = context.switchToHttp().getRequest();
    const user = request.user
    console.log('**',action,subject) // undefined undefined

    return this.matchPermission(user, action, subject)
  }

}

Lastly, here is how I am utilizing the decorator and guard in my user controller:

@Controller('user')
export class UserController {
  constructor( private readonly userUsecase: UserUsecase) { }
  
  @UseGuards(JwtAuthGuard,PermissionGuard)
  @Permission(Action.Create,'User')
  @Post()
  create(@Body() createUserDto: CreateUserDto,@Request() req) {
    return this.userUsecase.create(createUserDto,req.user)
  }
}

While implementing these, I encountered an issue with the permission guard where I am unable to retrieve the value from the decorator.

Instead, it prints undefined.

Can anyone help me understand what the problem might be and how I can resolve it?

Answer №1

After some investigation

I realized my mistake in retrieving metadata set by the @Permission decorator using an incorrect key within the PermissionGuard

To address this issue

I made adjustments to the decorator as shown below

import { SetMetadata } from '@nestjs/common';

export const Permission = (action:string,subject: string) => SetMetadata('permission', {subject,action});

I also updated the guard implementation

    const permission:any = this.reflector.get<Action>('permission', context.getHandler());
    const {subject,action} = permission

As a result, everything is now functioning as expected

Similar questions

If you have not found the answer to your question or you are interested in this topic, then look at other similar questions below or use the search

Is it possible to efficiently share sessionStorage among multiple tabs in Angular 2 and access it right away?

My Current Knowledge: I have discovered a way to share sessionStorage between browser tabs by using the solution provided here: browser sessionStorage. share between tabs? Tools I Am Using: Angular 2 (v2.4.4) with TypeScript on Angular CLI base The ...

How to ensure Angular mat-button-toggle elements are perfectly aligned within their respective groups

https://i.stack.imgur.com/Wjtn5.png Hello there, I'm trying to make the numbers in the first group match the style of the second group (noche, mañana...). I've set both the group and individual element width to 100%, but the numbers beyond 22 ...

Dealing with nullable objects in Typescript: Best practices

Looking for a solution to have a function return an object or null. This is how I am currently addressing it: export interface MyObject { id: string } function test(id) : MyObject | null { if (!id) { return null; } return { ...

Struggling to locate a declaration file for the 'cloudinary-react' module? Consider running `npm i --save-dev @types/cloudinary-react` or exploring other options to resolve this issue

Currently, I am working with Typescript in React. Strangely, when I try to import the following: import { Image } from 'cloudinary-react'; I encounter this error: Could not find a declaration file for module 'cloudinary-react'. ' ...

Facing an issue with displaying a component error in a mat-form-field in Angular 9

I am looking to develop a shared component for displaying errors in Angular Material. Here is my shared component pfa-share-error: <mat-error *ngIf="fieldErrors(fieldName).required && fieldErrors(fieldName)"> Required </mat-err ...

Isolating a type as a constant in Typescript within a .js file?

Within my .js configuration files, I have a tsconfig containing the property checkJs: true. A library called Terser includes the following type options: ecma: 5 | 2015 | 2016 | 2017 | 2018 | 2019 | 2020 Despite setting ecma: 2017 in my configuration file ...

Model Mongoose TypeScript Interface Type

I am working with 2 models in my project import {model, Schema, Types} from 'mongoose' interface IResource { user : Types.ObjectId | IUsers, type : Types.ObjectId | IResourceData, value : number, lastUpdate : number | Date, ...

Is there a way to ensure my custom tslint rule is compatible with the exact version of the TypeScript module being used by tslint?

I seem to be missing something crucial, but I can't pinpoint the issue. Within my custom rule, I am utilizing the SyntaxKind of a Node for controlling my flow, as shown below: import * as ts from "typescript" function processPropertyName(pn: ts.Pro ...

React onClick event image attribute is unique because it allows for interactive

Is there a way to dynamically add the onClick attribute to an image, but have the click event not working? //Code const parser = new DOMParser(); const doc = parser.parseFromString(htmlContent, "text/html" ); const imageDa ...

Creating a custom Angular pipe to convert milliseconds to a formatted hh:mm:ss in Angular

Struggling to develop an Angular pipe that accurately converts milliseconds to hh:mm:ss format. Despite researching several articles, none of the solutions seem to work. Here is a snippet of the current pipe.ts implementation: transform(value) { le ...

What is the best way to outline the specifications for a component?

I am currently working on a TypeScript component. component @customElement("my-component") export class MyComponent extends LitElement { @property({type: String}) myProperty = "" render() { return html`<p>my-component& ...

Different tsconfigs assigned to various directories

In my project, I am using Next.js with TypeScript and Cypress for E2E tests. The challenge I am facing is configuring tsc to handle multiple configs for different folders. The tsconfig.json file in the project root for Next.js looks like this: { "c ...

The type of props injected by WithStyles

When working on my class component, I utilize material UI withStyles to inject classes as a property. export default withStyles(styles)(myComponent) In this process, const styles = ( (theme:Theme) => createStyles({className:CSS_PROPERTIES}) I am att ...

Tips for effortlessly incorporating a new chip while maintaining a neat arrangement and ensuring button alignment

I am looking to enhance my website by adding chips with new tags in a neatly organized manner. Specifically, I want each new chip to be positioned next to the previous one and have the add-button shift to the right side, always staying in front of the last ...

Can a substring within a string be customized by changing its color or converting it into a different HTML tag when it is defined as a string property?

Let's discuss a scenario where we have a React component that takes a string as a prop: interface MyProps { myInput: string; } export function MyComponent({ myInput }: MyProps) { ... return ( <div> {myInput} </div> ...

Is it possible to pass additional arguments to setState other than prevState and props?

I'm currently facing an issue with my component that involves calling a function called addOption, which is defined on its parent component. This function takes a parameter 'option' from a form field and concatenates it with an array of opti ...

PostgreSQL reverse relationship

I have a table in my database called "textDate" class TextData extends BaseEntity{ id(primaryGeneratedColumn) ar:string en:string } This entity is used to store all text in my project, such as titles, descriptions, and other fields that have foreign ...

The upcoming development does not involve creating an entire HTML webpage using on-demand static site generation (SS

I’m encountering a problem when utilizing getStaticPaths and getStaticProps to create an on-demand SSG for a sharing page. My setup involves Next v12.1.0 and React 17.0.2. After building a specific /[id] page, I can retrieve the data but the HTML output ...

Error message displaying 'class-transformer returning undefined'

I'm new to working with the class-transformer library. I have a simple Product class and JSON string set up to load a Product object. However, I'm encountering an issue where even though I can see the output indicating that the transformation was ...

What are the steps to integrate a database into my Next.js application?

While I was experimenting with integrating postgresql into a nextjs project, I encountered an error 405 when trying to create an account. Below is the error message in the browser console: page.tsx:14 POST http://localhost:3000/api/auth/ ...