CODEWITHSUNDEEP
node.jstypescriptexpresspassport.js
gabe482
gabe482

Reputation: 53

Typescript no overload matches this call

I'm new to TypeScript and I'm currently stuck. I have a nodejs and express app.

I'm getting the following error: No overload matches this call.

The last overload gave the following error.
    Argument of type '{ isLoggedIn: (req: Request<ParamsDictionary, any, any, QueryString.ParsedQs, Record<string, any>>, res: Response<any, Record<string, any>>, next: NextFunction) => Response<...> | undefined; }' is not assignable to parameter of type 'RequestHandlerParams<ParamsDictionary, any, any, ParsedQs, Record<string, any>>'.
      Type '{ isLoggedIn: (req: Request<ParamsDictionary, any, any, ParsedQs, Record<string, any>>, res: Response<any, Record<string, any>>, next: NextFunction) => Response<...> | undefined; }' is missing the following properties from type '(ErrorRequestHandler<ParamsDictionary, any, any, ParsedQs, Record<string, any>> | RequestHandler<ParamsDictionary, any, any, ParsedQs, Record<...>>)[]': length, pop,

This is my route file

export {}

import express, { Router } from 'express';

import lessons from '@controllers/lessons';
import isLoggedIn from '@middleware/user';

const lessonRoutes: Router = express.Router();


lessonRoutes.route('/')
        .get(isLoggedIn, lessons.lessonForm)

This is my middleware file

import { Request, Response, NextFunction } from 'express';

const isLoggedIn = (req: Request, res: Response, next: NextFunction) => {
    if (!req.isAuthenticated()) {
        return res.status(401).json({
            error: "User must sign in"
          })
    }
    next();
}

export default {
    isLoggedIn
}

Upvotes: 5

Views: 28047

Answers (5)

Isaac Martinez
Isaac Martinez

Reputation: 1

What you need to do is to remove the explicit return of the res.status(401).json(...) in your case it would be as follows:

import { Request, Response, NextFunction } from "express";

const isLoggedIn = (req: Request, res: Response, next: NextFunction) => {
  if (!req.isAuthenticated()) {

    /* REMOVE return */ res.status(401).json({
      error: "User must sign in",
    });

    /* And place it right here */ return;
  }
  next();
};
export default {
  isLoggedIn,
};

This should solve your problem.

Explanation

Express middleware doesn't require you to return anything from the function. Once you send a response using res.status() or similar, Express handles it.

Upvotes: 0

Mohammadreza Azizi
Mohammadreza Azizi

Reputation: 1

instead of

return res.status(401).json({
        error: "User must sign in"
      })

write

    res.status(401).json({
            error: "User must sign in"
          });
return;

Upvotes: -2

Ujjwal Agrawal
Ujjwal Agrawal

Reputation: 111

Remember to use : Promise<any>

import { Request, Response, NextFunction } from 'express';

const isLoggedIn = (req: Request, res: Response, next: NextFunction): Promise<any> => {
    if (!req.isAuthenticated()) {
        return res.status(401).json({
            error: "User must sign in"
        })
    }
    next();
}

export default {
    isLoggedIn
}

This usage will solve the this problem of typescript after new update.

Upvotes: 11

Joe Mwangi
Joe Mwangi

Reputation: 61

You can use as any type assertion to turn off type checking for get parameters. https://bobbyhadz.com/blog/typescript-no-overload-matches-this-call

lessonRoutes.route('/')
    .get(isLoggedIn as any, lessons.lessonForm)

Upvotes: 3

Mack
Mack

Reputation: 771

Your exports from the middleware file have been set up incorrectly.

You are constructing an object with one property, isLoggedIn, which is the handler function, and then exporting that object as the default export.

So, when you import the default export from this file in the line:

import isLoggedIn from '@middleware/user';

Now isLoggedIn is equal to the value of the default export. i.e. isLoggedIn is an object with one property isLoggedIn that is equal to the handler function. So, instead of passing a function to route('/').get(...) like it expects, you are passing it an object.

You can use a named export from your middleware file instead:

export const isLoggedIn = (...) => ...;

Then import it by name:

import {isLoggedIn} from '@middleware/user';

Upvotes: 2

Related Questions