Typescript enhances the functionality of the Express Request body

Question

Typescript enhances the functionality of the Express Request body

I need help with the following code snippet:

const fff = async (req: express.Request, res: express.Response): Promise<void> => {...}

How can I specify that req.body.xxx exists? I want it to be recognized when I reference req.body.xxx as a property of the req.body object.

typescript express

Answer 1

Answer №1

To define a custom Request type in TypeScript, you can extend the express.Request interface and specify the body type:

interface ILoginBody {
  username: string;
  password: number;
}

interface ILoginRequest extends Request {
  body: ILoginBody;
}

// Replace express.Request with ILoginRequest
const handleLogin = async (req: ILoginRequest, res: Response): Promise<void> => {
  const { username, password } = req.body; 
}

Answer 2

To define a custom Request type in TypeScript, you can extend the express.Request interface and specify the body type:

interface ILoginBody {
  username: string;
  password: number;
}

interface ILoginRequest extends Request {
  body: ILoginBody;
}

// Replace express.Request with ILoginRequest
const handleLogin = async (req: ILoginRequest, res: Response): Promise<void> => {
  const { username, password } = req.body; 
}

Answer 3

Answer №2

To correctly format this, referring to the TypeScript definition from here:

interface Request<
        P = core.ParamsDictionary,
        ResBody = any,
        ReqBody = any,
        ReqQuery = core.Query,
        Locals extends Record<string, any> = Record<string, any>
    > extends core.Request<P, ResBody, ReqBody, ReqQuery, Locals> {}

The correct way to define the Request types is by specifying them inside the brackets like so:

interface ILoginInfo {
  username: string;
  password: number;
}

const loginUser = async (req: Request<any, Response, ILoginInfo>, res: Response): Promise<void> => {
  const { username, password } = req.body;
}

Answer 4

To correctly format this, referring to the TypeScript definition from here:

interface Request<
        P = core.ParamsDictionary,
        ResBody = any,
        ReqBody = any,
        ReqQuery = core.Query,
        Locals extends Record<string, any> = Record<string, any>
    > extends core.Request<P, ResBody, ReqBody, ReqQuery, Locals> {}

The correct way to define the Request types is by specifying them inside the brackets like so:

interface ILoginInfo {
  username: string;
  password: number;
}

const loginUser = async (req: Request<any, Response, ILoginInfo>, res: Response): Promise<void> => {
  const { username, password } = req.body;
}

Typescript enhances the functionality of the Express Request body

Answer №1

Answer №2

Similar questions

Encountered an error while defining a Vue component using TypeScript with the @Prop decorator

Top method for dynamically loading a specific component by using its selector as a variable

Creating middleware to intercept responses for all AJAX requests

Adjust the global node variable during execution

Strategies for enhancing performance in an Angular 4 project

Using getter functions and Visual Studio for TypeScript

Data is not appearing when using Node.js with mongoose and the populate() method

React Routing: Unleashing the Power of Multi-Level Routing

Terminate the current node-simplecrawler instance before initializing a new one to ensure exclusive operation (enforce singleton behavior)

Executing jasmine tests in Visual Studio Code - a step by step guide

The TypeScript error reads: "An element is implicitly assigned the 'any' type because an expression of type 'any' cannot be used to index a specific type."

An issue occurred: The module failed to self-register at the specified path: '/node_modules/onnxruntime-node/bin/napi-v3/linux/x64/onnxruntime_binding.node'

In Angular and Typescript, adjusting the index in one dropdown will automatically update the selected option in another dropdown

typescript code may not display a preview image

Learn how to effectively utilize templateURL in an express and angular project

Tips for utilizing MongoDB aggregation to extract records with index numbers that are multiples of 5

Material-UI Slide component is encountering an issue where it is unable to access the style property of an undefined variable

MERN Stack deployment to Heroku: Remote rejected - unable to push changes to master branch (pre-receive hook declined)

An error has occurred in Angular: No routes were found that match the URL segment 'null'

Common problems encountered post Typescript compilation