Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Cutomize Swagger UI ASP.NET Core Web API

I'm trying to customize swagger UI on my ASP.NET Core Web API.

I want the UI like this:

enter image description here

I'm following these tutorials:

  • https://docs.microsoft.com/en-us/aspnet/core/tutorials/web-api-help-pages-using-swagger?tabs=visual-studio
  • https://github.com/swagger-api/swagger-ui

This is the Startup.cs configuration:

// Add the detail information for the API.
services.ConfigureSwaggerGen(options =>
{
    // Determine base path for the application.
    var basePath = _env.WebRootPath;

    // Complete path
    var xmlPath = Path.Combine(basePath, "myapi.xml");

    // Set the comments path for the swagger json and ui.
    options.IncludeXmlComments(xmlPath);
});

app.UseStaticFiles();

// Enable middleware to serve generated Swagger as a JSON endpoint
app.UseSwagger();

// Enable middleware to serve swagger-ui assets (HTML, JS, CSS etc.)
app.UseSwaggerUI(c =>
{                
    c.SwaggerEndpoint("/swagger/v1/swagger.json", "MyAPI");
});  

I already downloaded swagger ui files from the git repository and put on my project like this:

enter image description here

I don't know if this is the right thing to do, but I'm not able to see any changes to the swagger UI.

like image 987
perozzo Avatar asked Dec 01 '17 11:12

perozzo


2 Answers

The tutorial you are following is using: Swashbuckle.AspNetCore unfortunately in that project they still using the Swagger-UI version 2.x, your Screenshot shows version 3.x


There are a few Pull Requests to update to latest Swagger-UI:

  • https://github.com/domaindrivendev/Swashbuckle.AspNetCore/pull/453
  • https://github.com/domaindrivendev/Swashbuckle.AspNetCore/pull/543

But unfortunately there is not much progress towards merging those.

I see that you know how to download files from a git repository...
My recommendation:
Instead of downloading the swagger-ui files, download the entire project Swashbuckle.AspNetCore from a fork that is using the version you need (such as: alexvaluyskiy/Swashbuckle.AspNetCore), then in your project add a reference to that project instead of the nuget package.


Another option could be creating your own fork of Swashbuckle.AspNetCore merge the fixes you need and then publish your own Nuget package with a different name.

like image 174
Helder Sepulveda Avatar answered Sep 29 '22 22:09

Helder Sepulveda


I ran into a similar issue, and I needed to inject my style sheet:

c.InjectStylesheet("/Swagger/Ui/custom.css")

This was added to app.UseSwaggerUI in the Startup.cs file.

The following articles helped, but I had to merge information from both to find my answer:

  • https://cpratt.co/customizing-swagger-ui-in-asp-net-core/
  • https://docs.microsoft.com/en-us/aspnet/core/tutorials/getting-started-with-swashbuckle?view=aspnetcore-2.1&tabs=visual-studio%2Cvisual-studio-xml
like image 39
Debro012 Avatar answered Sep 29 '22 20:09

Debro012