How to add summary and body manually in swagger nestjs
Asked Answered
E

4

29

I am trying to add summary in my swagger documentation routes but I am not able to find the appropriate decorator for defining the summary.

There are some routes in which I have not specified any DTO's. So, I would like to manually add request body for that endpoint.

user.controller.ts

@Controller('users')
@ApiTags('User')
@ApiBearerAuth()
export class UsersController {

  constructor(private readonly service: UsersService) {}

  @Get()
  async findAll() {
    const data = await this.service.findAll();

    return {
      statusCode: 200,
      message: 'Users retrieved successfully',
      data,
    };
  }
}

Swagger

auth.controller.ts

  @UseGuards(AuthGuard('local'))
  @Post('login')
  @ApiParam({
    name: 'email',
    type: 'string'
  })
  @ApiParam({
    name: 'password',
    type: 'string'
  })

  async login(@Request() req) {
    return this.authService.login(req.user);
  }
Enceladus answered 7/2, 2020 at 12:58 Comment(0)
B
47

For Endpoint Summary, you can use @ApiOperation(). For schema, you can use @ApiResponse()

@Get()
@ApiOperation({ summary: 'summary goes here' })
@ApiResponse({ status: 200, description: 'description goes here', schema: { ...define schema here... } })
async findAll() {}

Read more about Raw Definitions from the documentations here: https://docs.nestjs.com/recipes/swagger#raw-definitions

Braun answered 10/2, 2020 at 2:30 Comment(0)
Q
27

I guess this can be seen more as a reference as this post comes up when looking for instructions for Swagger/OpenAPI.

I have set up an example repo which shows the basic usage. You can find it here: https://gitlab.com/WaldemarLehner/nestjs-swagger-example

Missing Summary

Use the @ApiOperation-Decorator to define a Endpoint-Description.

@ApiOperation({description: "This is the main Description of an Endpoint."})

Want to manually add request schema

First of all, note that you have a GET-Endpoint. As a result any request towards that endpoint cannot have a request body.

So.. assuming you use a HTTP Method that allows for a Request-Body (like POST), you can use the @ApiBody-Decorator.

Here you can define the Body-Summary, a Schema (using an OpenAPI-Schema Object), or a Type (Schema is inferred from the Class and its Decorators).

@ApiBody({
    type: PostHelloBodyDTO,
    description: "The Description for the Post Body. Please look into the DTO. You will see the @ApiOptionalProperty used to define the Schema.",
    examples: {
        a: {
            summary: "Empty Body",
            description: "Description for when an empty body is used",
            value: {} as PostHelloBodyDTO
        },
        b: {
            summary: "Hello Body",
            description: "Hello is used as the greeting",
            value: {greeting: "Hello"} as PostHelloBodyDTO
        }
    }
})

Further Reference

Using the following Decorations will result in a Swagger-Document as shown below.

@ApiOperation({description: "This is the main Description of an Endpoint."})
/// Request Documentation
@ApiParam({
    name: "name",
    description: "This Decorator specifies the documentation for a specific Parameter, in this case the <b>name</b> Param.",
    allowEmptyValue: false,
    examples: {
        a: {
            summary: "Name is Pete",
            description: "Pete can be provided as a name. See how it becomes a selectable option in the dropdown",
            value: "Pete"
        },
        b: {
            summary: "Name is Joe",
            value: "Joe"
        }
    }
})
@ApiQuery({
    name: "useExclamation",
    description: "This is the description of a query argument. In this instance, we have a boolean value.",
    type: Boolean,
    required: false // This value is optional
})
@ApiBody({
    type: PostHelloBodyDTO,
    description: "The Description for the Post Body. Please look into the DTO. You will see the @ApiOptionalProperty used to define the Schema.",
    examples: {
        a: {
            summary: "Empty Body",
            description: "Description for when an empty body is used",
            value: {} as PostHelloBodyDTO
        },
        b: {
            summary: "Hello Body",
            description: "Hello is used as the greeting",
            value: {greeting: "Hello"} as PostHelloBodyDTO
        }
    }

})
/// Response Documentation
@ApiOkResponse({
    description: "This description defines when a 200 (OK) is returned. For @Get-Annotated Endpoints this is always present. When, for example, using a @Post-Endpoint, a 201 Created is always present",
    schema: {
        type: "string",
        example: "Hello, Pete!"
        // For instructions on how to set a Schema, please refer to https://github.com/OAI/OpenAPI-Specification/blob/main/versions/3.0.3.md#schema-object-examples
    }
})
@ApiBadRequestResponse({
    description: "This description is for a 400 response. It is returned when additional query params are passed, or when the <b>useExclamation</b>-Argument could not be parsed as a boolean."
})
@ApiResponse({
    status: 417,
    description: "One can also provided a Status-Code directly, as seen here"
})
@Post(":name")
public postHello(...){...}

Result

The Resulting OpenAPI/Swagger Document

Quintie answered 3/12, 2021 at 13:45 Comment(0)
T
6

I'd suggest creating a DTO for all your endpoints (resp and req).

Here's how you would add a summary to the schema (in your screenshot, click 'schema' in the area you circled red) using DTOs + @ApiProperty decorator

    import { ApiProperty } from '@nestjs/swagger';

    export class ExampleRedditDTO {
        @ApiProperty({
            type: String,
            description: "The target subreddit"
        })
        targetSub!: string;

        @ApiProperty({
            type: Number,
            description: "The number of top posts you want back"
        })
        postCount!: number;
    }
Tutuila answered 17/6, 2020 at 15:31 Comment(0)
C
1

If someone is looking for a solution in Quarkus/OpenAPI new version then here is the solution:

  1. Adding request body:
 @RequestBody(content = @Content(
            examples = {@ExampleObject(name = "Testing Name", value = "{'name':'Abc', 'age':23}", description = "Testing Description")}))
  1. Adding summary:
@Operation(summary = "Testing GitHub File Reader")

Together:

import org.eclipse.microprofile.openapi.annotations.Operation;
import org.eclipse.microprofile.openapi.annotations.media.Content;
import org.eclipse.microprofile.openapi.annotations.media.ExampleObject;
import org.eclipse.microprofile.openapi.annotations.parameters.RequestBody;

import javax.ws.rs.Consumes;
import javax.ws.rs.POST;
import javax.ws.rs.Path;
import javax.ws.rs.Produces;
import javax.ws.rs.core.MediaType;
import java.util.Map;

@Path("/api")
public class RestControllerResponse {

    @Path("/generate")
    @POST
    @Operation(summary = "Testing GitHub File Reader")
    @Consumes({MediaType.APPLICATION_JSON, MediaType.APPLICATION_XML})
    @Produces({MediaType.APPLICATION_JSON, MediaType.APPLICATION_XML})
    @RequestBody(content = @Content(
            examples = {@ExampleObject(name = "Testing Name", value = "{'name':'Abc', 'age':23}", description = "Testing Description")}))
    public String generator(final Map<String, Object> input) throws Exception {
        return "Hello From Generator Method";
    }
}
Charinile answered 25/4, 2022 at 14:45 Comment(0)

© 2022 - 2024 — McMap. All rights reserved.