Swashbuckle.AspNet.Core: Swagger UI shows empty page - How to fix?

Question

I added Swashbuckle.AspNet.Core to my repository and initialized everything using the default values.

Although I can see JSON output from /swagger/v1/swagger.json opening /swagger/index.html just yields an empty page.

Why?

Here's my code

public void ConfigureServices(IServiceCollection services)
{
  services
    .AddSwaggerGen()
    .AddControllers()
    ;
}

// This method gets called by the runtime once. Use this method to configure the HTTP request pipeline.
public void Configure(IApplicationBuilder app, IWebHostEnvironment env, Options options)
{
  if (env.IsDevelopment()) app.UseDeveloperExceptionPage();

  app
    .UseHttpsRedirection()
    .UseRouting()
    .UseAuthorization()
    .UseEndpoints(endpoints => endpoints.MapControllers())
    .UseSwagger()
    ;

  if (env.IsDevelopment()) app.UseSwaggerUI();
}

user_431111 · Answer

You haven't configured your Swashbuckle service correctly.

In your configureServices method, the call to AddSwaggerGen has "optional parameters", so the way you've specified it will work, but it's more common to do the following:

  services.AddSwaggerGen(config =>
  {
    config.SwaggerDoc("v1", new OpenApiInfo() { Title = "Payment Card Info API", Version = "v1" });
  });

Title is the title your Swagger Doc will show, and version is the advertised version of your API as displayed on your document, the FIRST "v1" parameter, is the version parameter that will be used in the actual swagger URL used to server the json file.

The code you place in your "Configure" method however, is NOT optional and must be done in a specific way.

app.UseSwagger();
app.UseSwaggerUI(config =>
{
  config.SwaggerEndpoint("/swagger/v1/swagger.json", "Payment Card Info API");
});

The "UseSwaggerUI call MUST be configured manually, as it appears the defaults in the code simply don't work automatically.

By default your swagger json doc will always be at "/swagger/" + first version parameter in swaggerDoc call + "/swagger.json" (This can be changed, but I wouldn't recommend it)

Your swagger endpoint call, must be the actual URL the json is served at and a name of your choice to label it.

I would also strongly suggest wrapping your UseSwaggerUI call in an "env.IsDevelopment" call so that it's automatically turned off when you do a production build of your app, and thus will not make it available once your service is deployed.

Here's how I've done mine.

Swashbuckle.AspNet.Core: Swagger UI shows empty page - How to fix?

Here's my code

1 Answers