类型“NextApiRequest”缺少类型“Request<ParamsDictionary,any,any,ParsedQs,Record<string,any>>”中的以下属性

Question

以下代码显示 Next.js 项目中的错误。

“NextApiRequest”类型的参数不可分配给“Request<ParamsDictionary,any,any,ParsedQs,Record<string,any>>”类型的参数。类型“NextApiRequest”缺少类型“Request<ParamsDictionary,any,any,ParsedQs,Record<string,any>>”的以下属性：get、header、accepts、acceptsCharsets 和 29 more.ts(2345)

import session from 'express-session'
import connectMongo from 'connect-mongo'

import type { NextApiRequest, NextApiResponse } from 'next'

const MongoStore = connectMongo(session)


export default function sessionMiddleware(req: NextApiRequest, res: NextApiResponse, next: any) {
  const mongoStore = new MongoStore({
    client: req.dbClient,
    stringify: false,
  })

  return session({
    secret: process.env.SESSION_SECRET ?? '',
    resave: false,
    saveUninitialized: false,
    store: mongoStore,
  })(req, res, next)
}

对于上述问题有任何解决方案。

Answer 1

块引用

我解决问题的方法是使用类型联合https://www.typescriptlang.org/docs/handbook/unions-and-intersections.html

import { RequestHandler, Request, Response } from 'express';
import { NextApiRequest, NextApiResponse } from 'next';

type NextApiRequestWithFormData = NextApiRequest &
  Request & {
    files: any[];
  };

type NextApiResponseCustom = NextApiResponse & Response;

export default function initMiddleware(middleware: RequestHandler) {
  return (
    req: NextApiRequestWithFormData,
    res: NextApiResponseCustom
  ): Promise<any> =>
    new Promise((resolve, reject) => {
      middleware(req, res, (result: any) => {
        if (result instanceof Error) {
          return reject(result);
        }
        return resolve(result);
      });
    });
}

下面的代码应该适合你

import { RequestHandler, Request, Response } from 'express';
import { NextApiRequest, NextApiResponse } from 'next';

type NextApiRequestWithFormData = NextApiRequest &
  Request & {
    files: any[];
  };

type NextApiResponseCustom = NextApiResponse & Response;

export default function initMiddleware(middleware: RequestHandler) {
  return (
    req: NextApiRequestWithFormData,
    res: NextApiResponseCustom
  ): Promise<any> =>
    new Promise((resolve, reject) => {
      middleware(req, res, (result: any) => {
        if (result instanceof Error) {
          return reject(result);
        }
        return resolve(result);
      });
    });
}