Incorporate New Element into the Express Request Object

Question

Incorporate New Element into the Express Request Object

I am attempting to enhance the Express request object by adding a property called "forwardingUrl".

To achieve this, I utilized declaration merging in a file named ./typing.d.ts:

declare namespace Express {
  export interface Request {
    forwardingUrl: string;
  }
}

Although I can access and use the property in the editor, I encounter an error during compilation:

Property 'forwardingUrl' does not exist on type 'Request<ParamsDictionary>'.

What could be causing this issue?

UPDATE

The section of code where the error arises:

import { Middleware, Request } from '@tsed/common';
import { Request as ExpressRequest } from 'express';
@Middleware()
export class Wso2ForwardingUrlParser {
    async use(@Request() request: ExpressRequest) {
        if (request.header('X_FORWARDED_HOST') && request.header('X_FORWARDED_PREFIX')) {
            request.forwardingUrl = `https://${request.header('X_FORWARDED_HOST')}${request.header('X_FORWARDED_PREFIX')}`;
        }   else {
            request.forwardingUrl = '';
        }
    }
}

javascript typescript express nestjs

Answer 1

Answer №1

Implement a new model that extends Request class

import {Request} from "@tsed/common";

export interface CustomRequest extends Request {
    forwardingUrl: string
}

Next, utilize this model in a method

import { Middleware, Request } from '@tsed/common';
import { Request as ExpressRequest } from 'express';
@Middleware()
export class ForwardingUrlParser {
    async use(@Request() request: CustomRequest) {
        if (request.header('X_FORWARDED_HOST') && request.header('X_FORWARDED_PREFIX')) {
            request.forwardingUrl = `https://${request.header('X_FORWARDED_HOST')}${request.header('X_FORWARDED_PREFIX')}`;
        }   else {
            request.forwardingUrl = '';
        }
    }
}

Answer 2

Implement a new model that extends Request class

import {Request} from "@tsed/common";

export interface CustomRequest extends Request {
    forwardingUrl: string
}

Next, utilize this model in a method

import { Middleware, Request } from '@tsed/common';
import { Request as ExpressRequest } from 'express';
@Middleware()
export class ForwardingUrlParser {
    async use(@Request() request: CustomRequest) {
        if (request.header('X_FORWARDED_HOST') && request.header('X_FORWARDED_PREFIX')) {
            request.forwardingUrl = `https://${request.header('X_FORWARDED_HOST')}${request.header('X_FORWARDED_PREFIX')}`;
        }   else {
            request.forwardingUrl = '';
        }
    }
}

Answer 3

Answer №2

Encountered the same problem and found a solution by including //@ts-ignore right above the lines where the error occurs:

import { Middleware, Request } from '@tsed/common';
import { Request as ExpressRequest } from 'express';

@Middleware()
export class Wso2ForwardingUrlParser {
    async use(@Request() request: ExpressRequest) {
        if (request.header('X_FORWARDED_HOST') && request.header('X_FORWARDED_PREFIX')) {

            //@ts-ignore
            request.forwardingUrl = `https://${request.header('X_FORWARDED_HOST')}${request.header('X_FORWARDED_PREFIX')}`;

        }   else {

            //@ts-ignore
            request.forwardingUrl = '';
        }
    }
}

Suggest utilizing a param decorator for accessing this value later in the code. With the addition of the "forwardingUrl" property to the request instance through middleware, create a param decorator like this:

// ./ForwardingUrlDecorator.ts

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

export const ForwardingUrl = createParamDecorator((_data: any, req: any) => {
    return req.forwardingUrl;
});

In your controller, you can then retrieve that value without needing to reference the entire express instance as a parameter in your methods:

import { Controller } from '@nestjs/common';
import { ForwardingUrl } from './ForwardingUrlDecorator';

@Controller()
export class YourController {

    @Get()
    public async getTheThing(@ForwardingUrl() forwardingUrl: string) {
        //...
    }
}

Answer 4

Encountered the same problem and found a solution by including //@ts-ignore right above the lines where the error occurs:

import { Middleware, Request } from '@tsed/common';
import { Request as ExpressRequest } from 'express';

@Middleware()
export class Wso2ForwardingUrlParser {
    async use(@Request() request: ExpressRequest) {
        if (request.header('X_FORWARDED_HOST') && request.header('X_FORWARDED_PREFIX')) {

            //@ts-ignore
            request.forwardingUrl = `https://${request.header('X_FORWARDED_HOST')}${request.header('X_FORWARDED_PREFIX')}`;

        }   else {

            //@ts-ignore
            request.forwardingUrl = '';
        }
    }
}

Suggest utilizing a param decorator for accessing this value later in the code. With the addition of the "forwardingUrl" property to the request instance through middleware, create a param decorator like this:

// ./ForwardingUrlDecorator.ts

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

export const ForwardingUrl = createParamDecorator((_data: any, req: any) => {
    return req.forwardingUrl;
});

In your controller, you can then retrieve that value without needing to reference the entire express instance as a parameter in your methods:

import { Controller } from '@nestjs/common';
import { ForwardingUrl } from './ForwardingUrlDecorator';

@Controller()
export class YourController {

    @Get()
    public async getTheThing(@ForwardingUrl() forwardingUrl: string) {
        //...
    }
}

Answer 5

Answer №3

If you want to include custom properties in the Express Request Object within nestjs,

You can achieve this by creating a new directory named express and adding a file named index.d.ts, Here's an example:

export {};

export type _CustomProperty = CustomProperty;

declare global {
  namespace Express {
    interface Request {
      customProp: _CustomProperty;
    }
  }
}

Answer 6

If you want to include custom properties in the Express Request Object within nestjs,

You can achieve this by creating a new directory named express and adding a file named index.d.ts, Here's an example:

export {};

export type _CustomProperty = CustomProperty;

declare global {
  namespace Express {
    interface Request {
      customProp: _CustomProperty;
    }
  }
}

Incorporate New Element into the Express Request Object

Answer №1

Answer №2

Answer №3

Similar questions

The specified resource cannot be found in the CDK Stack Export

Creating a Countdown in Javascript Using a Variable

npm will only update when modifications are made to index.js

The error message "Mongo is not defined" appeared in Meteor version 1.0.3.1

Creating a water vessel design using CSS

Incorporating Angular 2: Fetching information from a server data source and integrating it with my ng

Instructions on how to refresh a FullCalendar component in Vue.js

Utilize Javascript to interact with specific Objects

What is the best way to retrieve an element from a JavaScript object?

Can you provide guidance on displaying flash messages in my template using Express.js?

evt.target consistently returns the initial input within the list of inputs

Leverage all the documents obtained from a collection to reference in a Vue component

Storing Tags with jQuery Tag-it: A guide to saving user inputted tags in an object

Unique Menu: Challenge when adjusting the width of 5 divs upon hovering while maintaining full site width at 100%

Modify a particular attribute in an array of objects

Retrieve data from an HTML form within an Angular 2 ag-grid component

Employing jQuery with dynamic content within this context

Utilize the for loop with a specific variable

Collect information from forms and save it to a mobile phone number

Clicking on an absolute HTML element will instantly scroll back to the top of the page