自定义 Swagger UI ASP.NET 核心 Web API

Question

我正在尝试在我的 ASP.NET 核心网站 API 上自定义 swagger UI。

我想要这样的UI：

我正在学习这些教程：

这是Startup.cs配置：

// 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");
});

我已经从 git 存储库下载了 swagger ui 文件并像这样放在我的项目中：

我不知道这样做是否正确，但我看不到 swagger 有任何变化 UI。

Answer 1

您正在关注的教程正在使用：Swashbuckle.AspNetCore 不幸的是，在该项目中他们仍在使用 Swagger-UI 版本 2.x，您的屏幕截图显示版本 3.x

有几个拉请求更新到最新的 Swagger-UI:

但不幸的是，在合并这些方面没有太大进展。

我看到您知道如何从 git 存储库下载文件...
我的推荐：
不要下载 swagger-ui 文件，而是从使用您需要的版本（例如：alexvaluyskiy/Swashbuckle.AspNetCore）的 fork 下载整个项目 Swashbuckle.AspNetCore，然后在您的项目中添加引用到该项目而不是 nuget 包。

另一种选择可能是创建您自己的分支 Swashbuckle.AspNetCore 合并您需要的修复程序，然后使用不同的名称发布您自己的 Nuget 包。

Answer 2

我运行遇到了类似的问题，我需要注入我的风格 sheet:

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

这已添加到 Startup.cs 文件中的 app.UseSwaggerUI。

以下文章有所帮助，但我必须合并两者的信息才能找到我的答案：

Answer 3

//I hope this will help you , you can get //https://localhost:44x22/docs/index.html

        app.UseSwagger(o =>
        {
            o.RouteTemplate = "docs/{documentName}/docs.json";
        });
        // Enable middleware to serve swagger-ui (HTML, JS, CSS, etc.), 
        // specifying the Swagger JSON endpoint.
        //This line enables Swagger UI, which provides us with a nice, simple UI with which we can view our API calls.
        app.UseSwaggerUI(c =>
        {

            c.IndexStream = () => GetType().Assembly
   .GetManifestResourceStream("CustomUIIndex.Swagger.index.html"); // requires file to be added as an embedded resource
            c.InjectStylesheet("/css/swagger-ui/custom.css");// css path
            c.InjectJavascript("../css/swagger-ui/custom.js"); javascript path
            c.RoutePrefix = "docs";
            c.SwaggerEndpoint("../docs/v1/docs.json", "API v1");
            c.SwaggerEndpoint("../docs/v2/docs.json", "API V2");
        });
        app.UseStaticFiles();

自定义 Swagger UI ASP.NET 核心 Web API

Cutomize Swagger UI ASP.NET Core Web API

c#

asp.net-web-api

swagger

swagger-ui

asp.net-core