Asp.net-Web-Api

對 Swagger UI 標頭的修改

  • August 22, 2020

我使用 Swashbuckle 和 Swagger API 創建了個人 WEB API。

雖然我能夠成功集成它,但我想修改 Swagger 的預設 UI。更改標題的顏色並替換招搖的圖像。

附上我想改變的想像部分。

這可以通過修改現有文件來實現嗎?

這些是我採取的步驟:

  1. 創建一個新文件 SwaggerHeader.css
  2. 右鍵點擊SwaggerHeader.css,選擇屬性。將Build action 設置為Embedded Resource
  3. SwaggerConfig.cs中,添加以下程式碼行:
     EnableSwaggerUi("Document/{*assetPath}", c =>
     {
         c.InjectStylesheet(typeof(SwaggerConfig).Assembly,
         "ProjectName.FolderName.SwaggerHeader.css");
     }
  1. SwaggerHeader.css如下所示:
/* swagger ui customization */
body.swagger-section #header {
   background-color: white;
   background: url(your-new-logo.png) no-repeat;
   background-position-x: 250px;
   height: 50px;
}

body.swagger-section #header .swagger-ui-wrap #logo {
       display: none;
}

引用自:https://stackoverflow.com/questions/36291146