ASP.NET Web API #Swagger Customized

ASP.NET Web API #Swagger Customized

前言

透過 Swashbuckle 可以快速幫我們產生 Swagger 文件，但有時候真正的 API 通常會需要帶一些 Header，本篇將說明如何針對 Swagger 的 Page 進行客製化。

InjectJavaScript

Create javascript file

Step 1. 新增 javascript 檔案(範例名稱為 GlobalHeaders.js)

Step 2. 設定為 Embedded Resource

InjectFiles

Step 1. 開啟 SwaggerConfig.cs 並找到 InjectJavaScript 後取消註解

Step 2. 設定要注入的 js 名稱

Test

Step 1. 在 GlobalHeaders.js 加入 Alert 來確認檔案注入成功

Step 2. 開啟 Swagger Page 可以看到有 Alert

Customized

本次範例客製化目標如下：

• 將最上方的 api_key 欄位隱藏
• 增加二個 header 的設定欄位
• 點選 Try it out! 時，會將 header 一併送出

Remove api_key

Step 1. js Code

Step 2. Result

Add Headers

Step 1. js Code

Step 2. Result

Add Headers When try it out!

Step 1. js Code

Step 2. Result

結論

Swagger 可以產生 API 線上測試網頁，並可以進行客製化，若團隊可以熟悉運用，不論是對開發人員，或是對外服務，都可以有良好的效果。

參考資料

文章內容的敘述如有錯誤及觀念不正確，請不吝嗇指教，如有侵權內容也請您與我反應。感謝您~