如何使用 Typescript 在 Express 中转换 req.query 参数

Question

我正在使用 TypeScript 运行 express.js 应用程序。每次我尝试处理

request.query.foo

时，我都会收到以下错误：

Argument of type 'string | ParsedQs | string[] | ParsedQs[] | undefined' is not assignable to parameter of type 'string'.

设置：

import { Request, Response } from 'express';

function bar(request: Request, response: Response) {
  const foo: string = request.query.foo; //marked as error
}

我在 Express 的文档中读到，您可以设置一个名为“查询解析器”的配置，当设置为“简单”时，它将始终将查询参数解析为字符串

问题是Typescript仍然认为可能会出现除字符串或未定义之外的其他内容，而我似乎找不到覆盖Request接口的方法，我只能扩展它。

有没有办法重写Request接口？我的方法有问题吗？

Answer 1

您可以在

ReqBody

、

ReqQuery

和请求类型的其他泛型上定义您期望的类型。对于

Response

，您还应该能够定义其他类型并将其作为泛型传递。不要忘记通过运行

@types/express

 安装 

npm install -D @types/express

然后您可以为每个特定案例创建其他

SomeHandlerRequest

和其他

ReqDictionary

、

ReqBody

、

ReqQuery

和

ResBody

。

import { Request } from 'express'

// if you need define other response generics
// import { Request, Response } from 'express'


// This types could be exported from other file. Then you should import them
type ReqDictionary = {}
type ReqBody = { foo1 ?: string }
type ReqQuery = { foo2 ?: string }
type ResBody = { foo3 ?: string }

type SomeHandlerRequest = Request<ReqDictionary, ResBody, ReqBody, ReqQuery>

const myCustomHandler = (req: SomeHandlerRequest, res) : void => {
   const { foo1 } = req.body
   const { foo2  } = req.query

   // Your custom logic ..... for example...
   if (foo1) {
      console.log("foo1 value = ", foo1)
   }
   if (foo2) {
      console.log("foo2 value = ", foo2)
   }

   res.status(200).json({ foo3 : "it works" })
}

Answer 2

聚会迟到了，不是最好的，但你可以尝试

const name: string = req.query.name as string;

只是通过空检查保存代码失败

Answer 3

我最终根据情况使用的解决方法：

1：扩展请求类型的示例。

import { Request } from 'express';
import { IncomingHttpHeaders } from 'http';

interface iExtendedRequest extends Request {
  headers: IncomingHttpHeaders & { authorization: string };
}

// Use the extended request interface as entry param
const getAuth = (req: iExtendedRequest): string => req.headers?.authorization;

2：使用双重铸造的示例：

type Users = {
  id: number;
  name: string;
};

const getUsers = (req: Request) => {
  // Cast req.query as unknown
  const query = req.query as unknown;
  // if allows us to cast it as our type
  const user = query as Users;
  // and then apply destructuring
  const { id, name } = user;

  id // number
  name // string
};

Answer 4

1. app.set('query parser', 'simple');

2. const {a,b} = req.query as Record<string, string>

   ；

Answer 5

如果您像我一样，并且由于升级依赖项，突然出现很多错误，您可能需要快速修复（直到您完成并输入所有请求）

所以，只需将

req

的类型指定为

any

即可完成。回到旧的无类型方法。

例如，

router.get('/',(req : any, res, next) => { 
    const { foo } = req.query;
    console.log('foo is a string',foo);
 });

将非类型化应用程序转换为类型化应用程序并不是一件简单或快速的事情。有时，您需要升级依赖项并让某些东西再次工作，并且必须将添加严格类型的练习留到另一天。