NestJS swagger生成的文档不显示参数信息

使用NestJS框架开发后端应用程序时，一项非常重要的任务是生成文档，以便其他开发人员可以了解接口的用法和参数信息。为此，我们可以使用Swagger来自动生成文档，并且可以通过访问生成的Swagger UI来查看这些文档。

然而，有时候我们可能会遇到Swagger生成的文档不显示参数信息的问题。这可能是由于一些配置问题或代码中的错误导致的。下面将介绍如何解决这个问题，并提供一些案例代码。

首先，我们需要确保在代码中正确地配置了Swagger。在NestJS中，我们可以使用一个名为@nestjs/swagger的包来实现这个目的。首先，我们需要在我们的应用程序中安装这个包：

$ npm install @nestjs/swagger

安装完成后，我们需要在主应用程序模块中导入这个包，并在SwaggerModule的setup方法中进行配置。下面是一个示例：

typescript
import { Module } from '@nestjs/common';
import { AppController } from './app.controller';
import { AppService } from './app.service';
import { SwaggerModule, DocumentBuilder } from '@nestjs/swagger';
@Module({
  imports: [],
  controllers: [AppController],
  providers: [AppService],
})
export class AppModule {
  constructor() {
    const options = new DocumentBuilder()
      .setTitle('My API')
      .setDescription('API description')
      .setVersion('1.0')
      .build();
    const document = SwaggerModule.createDocument(app, options);
    SwaggerModule.setup('api', app, document);
  }
}

在上面的代码中，我们首先导入了DocumentBuilder和SwaggerModule。然后，我们通过创建一个DocumentBuilder实例来配置Swagger的选项，包括标题、描述和版本等信息。最后，我们使用SwaggerModule.createDocument方法创建文档，并使用SwaggerModule.setup方法将文档绑定到特定的路由上。

接下来，我们需要确保我们的控制器和路由处理程序中的注解正确地使用了@ApiParam和@ApiOperation等Swagger提供的装饰器。这些装饰器用于指定参数的类型、描述和是否必需等信息。以下是一个示例：

typescript
import { Controller, Get, Param } from '@nestjs/common';
import { ApiParam, ApiOperation } from '@nestjs/swagger';
@Controller('users')
export class UsersController {
  @Get(':id')
  @ApiOperation({ summary: 'Get user by ID' })
  @ApiParam({ name: 'id', description: 'User ID' })
  getUserById(@Param('id') id: string) {
    return `User with ID ${id}`;
  }
}

在上面的代码中，我们使用了@ApiParam装饰器来指定参数的名称和描述，使用@ApiOperation装饰器来指定操作的摘要。这些装饰器将在Swagger生成的文档中显示参数信息。

完成以上步骤后，我们可以重新启动应用程序并访问生成的Swagger UI。在Swagger UI中，我们应该能够看到我们的控制器和操作，并且它们应该显示正确的参数信息。

解决方案

要解决Swagger生成的文档不显示参数信息的问题，我们需要确保正确地配置了Swagger，并且在控制器和路由处理程序中正确使用了Swagger提供的装饰器。通过这些步骤，我们应该能够生成包含正确参数信息的Swagger文档。

示例代码：

typescript
import { Module } from '@nestjs/common';
import { AppController } from './app.controller';
import { AppService } from './app.service';
import { SwaggerModule, DocumentBuilder } from '@nestjs/swagger';
@Module({
  imports: [],
  controllers: [AppController],
  providers: [AppService],
})
export class AppModule {
  constructor() {
    const options = new DocumentBuilder()
      .setTitle('My API')
      .setDescription('API description')
      .setVersion('1.0')
      .build();
    const document = SwaggerModule.createDocument(app, options);
    SwaggerModule.setup('api', app, document);
  }
}
import { Controller, Get, Param } from '@nestjs/common';
import { ApiParam, ApiOperation } from '@nestjs/swagger';
@Controller('users')
export class UsersController {
  @Get(':id')
  @ApiOperation({ summary: 'Get user by ID' })
  @ApiParam({ name: 'id', description: 'User ID' })
  getUserById(@Param('id') id: string) {
    return `User with ID ${id}`;
  }
}

参考链接：

- NestJS官方文档：https://docs.nestjs.com/

- NestJS Swagger模块文档：https://docs.nestjs.com/openapi/introduction

上一篇：NestJs Swagger 混合类型下一篇：NestJs 中所有装饰器的 Eslint 错误“已定义但从未使用”警告

=

TypeScript - AST - TypeScript: 　　　　TypeScript AST 是什么以及如何将其转换为 TypeScript 代码TypeScript 是一种被广泛使用的编程语言，它是 JavaScript 的一个超集，为 JavaScript 提供了静态类型检查和更强...... ...
TypeScript - 'Element' 不可分配给 HTMLInputElement: 　　　　使用 TypeScript 开发网页应用程序时，我们经常会遇到类型不匹配的问题。其中一个常见的错误是将一个类型为 "Element" 的对象赋值给一个类型为 "HTMLInputElement" 的变量。...... ...
Typescript + webpack（带热重载）+ NodeJS: 　　　　使用Typescript和Webpack搭配NodeJS开发，可以为我们提供更高效、可靠的开发环境。同时，通过添加热重载功能，我们可以在开发过程中实时预览和调试代码的变化，大大提高了开...... ...
Typescript + Webpack 项目中缺少源映射: 　　　　在开发Typescript + Webpack项目时，源映射是一个非常重要的工具，它能够帮助我们在调试代码时快速定位到源代码的位置。然而，有时候我们会发现在项目中缺少源映射，这给我...... ...
Typescript + Webpack 库生成“ReferenceError：self 未定义”: 　　　　在使用Typescript和Webpack库生成网页应用程序时，你可能会遇到一个常见的错误：“ReferenceError: self is not defined”。这个错误通常是因为在代码中引入了一些需要在浏...... ...
TypeScript + VSCode 中的自定义模块解析: 　　　　TypeScript 是一种静态类型的 JavaScript 超集语言，它扩展了 JavaScript 语法，并为开发者提供了强大的类型检查和面向对象编程的支持。在开发 TypeScript 项目时，我们通常...... ...
typescript + redux：排除父组件中的 redux 属性: 　　　　在使用 TypeScript 和 Redux 进行开发时，有时候我们希望在父组件中排除 Redux 属性的传递。这种情况通常发生在我们希望在某个子组件中使用 Redux，但又不希望将 Redux 相关...... ...
Typescript + React，从无状态功能组件渲染数组: 　　　　使用Typescript和React，我们可以轻松地渲染一个由无状态功能组件组成的数组。无状态功能组件是一种简单的组件类型，它们只接收属性并返回渲染的内容，没有内部状态或生命周...... ...
Typescript + ReactRedux：类型“IntrinsicAttributes”和“IntrinsicClassAttributes”上不存在属性: 　　　　使用TypeScript开发React应用时，我们经常会遇到一些类型错误。其中之一是类型“IntrinsicAttributes”和“IntrinsicClassAttributes”上不存在属性“XXX”的错误提示。那么...... ...
Typescript + Jquery Ajax + 这个: 　　　　标题：Typescript + Jquery Ajax 实现前后端数据交互在现代的Web开发中，前后端数据交互是非常常见的需求。而随着前端技术的不断发展，使用Typescript和Jquery Ajax来实现前...... ...
Typescript + gulp-sourcemaps 生成地图，但浏览器 DevTools 无法识别它: 　　　　使用 Typescript 和 gulp-sourcemaps 生成地图是一种常见的方法，可以帮助我们在开发过程中更好地调试和定位代码。然而，有时候我们会遇到一个问题，就是浏览器的 DevTools...... ...
Typescript + Express：类型“typeof e”没有兼容的调用签名: 　　　　使用Typescript和Express开发Web应用程序是一个常见的选择。Typescript提供了强类型的支持，可以在编译时捕获很多常见的错误。Express是一个流行的Node.js框架，用于构建灵...... ...
TypeScript + Express：类型“IncomingMessage”上不存在属性“rawBody”: 　　　　使用TypeScript和Express开发Web应用程序是一种非常流行的选择。这组合可以提供强类型检查和优雅的编程体验，使开发人员更加自信和高效。然而，在使用Express的过程中，有时...... ...
TypeScript + Express：req.params: 　　　　使用 TypeScript 和 Express 构建 Web 应用程序时，req.params 是一个非常有用的对象，它允许我们从 URL 中获取动态路由参数。在本文中，我将介绍 req.params 的用法，并提...... ...
TypeScript + ES6 Map + 对象类型的索引签名隐式具有“any”类型: 　　　　使用TypeScript和ES6 Map时，我们有时会遇到对象类型的索引签名隐式具有"any"类型的问题。在本文中，我们将探讨这个问题的原因以及如何解决它。当我们在TypeScript中定义一...... ...