Swagger UI 总是出现在 NestJS 中

Question

I am currently learning my way around in NestJS. Now I am experimenting with the Swagger feature. I followed the explanations on the NestJS site and I am getting a nice Swagger page displayed. However, now I am no longer able to use my controller pathes.

Example:
I have a path /api/users that will return a list of user records. After adding the Swagger feature I get the Swagger UI on /api . When I try to request /api/users I also get the swagger UI, this time empty.
When I click the "Try it out" button for the "user" API /users instead of /api/users will be executed, of course with a 404 response.

What am I doing wrong? Please help.

Answer 1

I'm assuming you have set the global prefix of your app to /api . Then you also have to set the base path for swagger accordingly. Also, you should mount your swagger docs to an unused path:

// Set the global prefix for all controllers to /api
app.setGlobalPrefix('api');

const document = SwaggerModule.createDocument(
  app,
  new DocumentBuilder()
    // Set the base path for swagger accordingly
    .setBasePath('api')
    .build(),
);

// Choose an unused path to mount your swagger module
SwaggerModule.setup('docs', app, document);
//                  ^^^^^^

Answer 2

I was able to achieve this by below code:

app.setGlobalPrefix("api");

setupSwagger(app);

app.setGlobalPrefix("");

setupSwagger definition:

export const setupSwagger = (app: INestApplication) => {
  const options = new DocumentBuilder()
    .setTitle(SWAGGER_API_NAME)
    .setDescription(SWAGGER_API_DESCRIPTION)
    .setVersion(SWAGGER_API_CURRENT_VERSION)
    .build();
  const document = SwaggerModule.createDocument(app, options);
  SwaggerModule.setup(SWAGGER_API_ROOT, app, document);
};