获取地址中的query参数，完美版

Posted 2023-03-14

参考技术A 注意点：

解码的原因：如果url中出现了特殊字符浏览器会自动给他们进行编码，可以理解成执行了一次encodeURI（），有时我们可能就是要通过url传递一些特殊参数比如get请求，我们会主动进行编码decodeURI、decodeURIComponent。所以当我们从url中取参数时还是得注意一下解码的情况。

它着眼于对整个URL进行编码，因此除了常见的符号以外，对其他一些在网址中有特殊含义的符号“; / ? : @ & = + $ , #”，也不进行编码。编码后，它输出符号的utf-8形式，并且在每个字节前加上%。

与encodeURI()的区别是，它用于对URL的组成部分进行个别编码，而不用于对整个URL进行编码。因此，“; / ? : @ & = + $ , #”，这些在encodeURI()中不被编码的符号，在encodeURIComponent()中统统会被编码。至于具体的编码方法，两者是一样。

如何从 NestJS 中的 Query 中获取参数

【中文标题】如何从 NestJS 中的 Query 中获取参数

【英文标题】：How to get parameters out of Query in NestJS

【发布时间】：2020-09-21 12:11:06

【问题描述】：

我希望能够从我的查询参数中获取车牌，但无论我以何种方式编写代码，它似乎都不起作用，所以我很困惑为什么它不起作用。

这是预期的行为：使用以下 GET 请求时：http://localhost:3978/licenseplate/getleasingcompany?licenseplate=1-WMW-478 我想提取车牌参数。

这是我当前的代码：

@Get('getleasingcompany')
async getLeasingCompany(@Query('licenseplate') licenseplate: string) 
    console.log(licenseplate);

在邮递员中尝试时，这会将licenseplate 记录为undefined。

我也试过这段代码的变种，比如：

@Get('getleasingcompany')
async getLeasingCompany(@Query() query) 
    console.log(query);

这将query 记录为[Function: getQuery]，我不知道如何处理（query.licenseplate 是undefined）

另一个选项可以在 *** 解释 here 中找到，其中 Kim 使用了路径参数。这确实对我有用，但不幸的是，这不是我的程序可以使用的行为。

谁能解释我做错了什么？谢谢！

编辑 1：在几个 cmets 之后，我将我的包更新到版本 7.1.2，但无济于事。将query 返回给邮递员会得到以下输出：

function getQuery() 
// always return a string, because this is the raw query string.
// if the queryParser plugin is used, req.query will provide an empty
// object fallback.
return this.getUrl().query || '';

编辑 2：尝试通过导入 Request 走 Express 路线，如下所示：import Request from "express";。代码现在看起来像这样：

@Get('getleasingcompany')
  async getLeasingCompany(@Req() request: Request) 
    console.log(request);

此日志的一部分确实显示查询保存了变量：

originalUrl: '/licenseplate/getleasingcompany?licenseplate=1-WMW-478',
  _parsedUrl:
   Url 
     protocol: null,
     slashes: null,
     auth: null,
     host: null,
     port: null,
     hostname: null,
     hash: null,
     search: '?licenseplate=1-WMW-478',
     query: 'licenseplate=1-WMW-478',
     pathname: '/licenseplate/getleasingcompany',
     path: '/licenseplate/getleasingcompany?licenseplate=1-WMW-478',
     href: '/licenseplate/getleasingcompany?licenseplate=1-WMW-478',
     _raw: '/licenseplate/getleasingcompany?licenseplate=1-WMW-478' ,

但是，在记录request.query 时，我仍然得到[Function: GetQuery] 作为结果。

【问题讨论】：

@Query() 是从哪里导入的？是来自@nestjs/graphql的偶然吗？你的 Nest 通用包、核心包和平台包在同一个版本上吗？

都是从Common导入的。 import Controller, Get, Body, HttpException, Post, Query from "@nestjs/common";。除了typeORM，都是6.7.2版本，typeORM是7.0.0

你有这个的复制品吗？

很遗憾，由于这些文件与我的工作相关，我无法共享这些文件。然而，我找到了一个“解决方案”，我将在下面的答案中分享。

【参考方案1】：

您的代码没有任何问题。在 Nest v7 上使用以下控制器和 curl 我得到了你所期望的

import  Controller, Get, Query  from '@nestjs/common';
import  AppService  from './app.service';

@Controller()
export class AppController 
  constructor(private readonly appService: AppService) 

  @Get()
  getHello(@Query() query: Record<string, any>): string 
    console.log(query);
    return this.appService.getHello();
  

curl http://localhost:3000/\?queryparam\=something

[Nest] 46471   - 06/02/2020, 2:55:11 PM   [NestFactory] Starting Nest application...
[Nest] 46471   - 06/02/2020, 2:55:11 PM   [InstanceLoader] AppModule dependencies initialized +12ms
[Nest] 46471   - 06/02/2020, 2:55:11 PM   [RoutesResolver] AppController : +15ms
[Nest] 46471   - 06/02/2020, 2:55:11 PM   [RouterExplorer] Mapped , GET route +9ms
[Nest] 46471   - 06/02/2020, 2:55:11 PM   [NestApplication] Nest application successfully started +9ms
 queryparam: 'something' 

我唯一的猜测是一些不匹配的 Nest 版本

【讨论】：

我将所有 Nest 包更新到最新版本（7.1.2 用于通用、核心和平台），但无济于事。使用您的 getHello 函数，查询日志显示 [Function: getQuery]，当我返回它时，邮递员给了我以下信息：function getQuery() // always return a string, because this is the raw query string. // if the queryParser plugin is used, req.query will provide an empty // object fallback. return this.getUrl().query || '';

你使用的是 Fastify 还是 Express？

@nestjs/platform-express:"7.1.2"

【参考方案2】：

我还没有找到程序没有按预期运行的原因，但是我已经通过启动一个新的 Nest 项目解决了这个问题。当我注意到这个项目确实按预期工作时，我复制了除 package.json 之外的所有文件，并一一重新安装了所有必要的依赖项。我只删除了 1 个依赖项 restify，我最终不需要它。不过它适用于包，所以这不是问题。

由于这些发现，我想这一定是版本控制问题，尽管我仍然不确定。

【讨论】：

看起来好像 resitfy 请求是正在使用的，这就是为什么查询变成了getQuery() 函数。如果没有看到 main.ts 中发生的事情，我不确定这是怎么发生的，但很高兴你解决了它。

感谢您帮助我调查问题！