這篇文章主要介紹了vue的swagger-ui怎么使用的相關知識，內容詳細易懂，操作簡單快捷，具有一定借鑒價值，相信大家閱讀完這篇vue的swagger-ui怎么使用文章都會有所收獲，下面我們一起來看看吧。
swagger-ui有非常多的版本，覺得不太好用，用postman，每個接口都要自己進行錄入。所以在基于think-vuele進行了swagger格式json的解析，自己實現了一套swaggerui界面。
swagger分為后端數據提供方方和前端頁面展示請求方。從一定角度來看，swagger是一種標準的數據格式的定義，對于不同語言進行實現一些注解API式的東西，能快速生成這種描述restful格式的api信息的json串.
此項目模塊依賴于think-vuele
自行下載編譯
// 下載代碼 git clone https://github.com/chfree/think-swagger-ui-vuele // 安裝依賴 npm install // 直接運行 npm run dev // 打包 npm run build
java項目 maven直接依賴
<dependency> <groupId>com.tennetcn.free</groupId> <artifactId>think-swagger-ui-starter</artifactId> <version>0.0.4</version> </dependency>
此jar包的開源項目為think-free-base中的子項目模塊
登陸界面分為json模式和swagger請求地址訪問，沒多大區別，只有拿到標準的swagger的json數據即可。
支持兩種主題，一種是后端管理系統模式的主題。另外一種也是類似，中間1024px進行居中，兩邊留白。
對于我使用過的一個版本的swagger來說，當接口數量在1000+以上，會等的時間非常長，原因是他一次將所有接口數據進行解析渲染，這個就是慢的原因。
所以我將此進行優化，改為先解析出api摘要信息，然后在點擊摘要的時候進行請求頭、請求體的渲染；基本可以做到秒開
可以自動填充非json請求體的數據，采用的是mock.Random。
對于json請求體的數據，可以進行json格式化編輯，也是非常方便。json在線格式化編輯使用的是josdejong大神的jsoneditor
對于響應數據直接采用json格式化組件進行格式化展示，支持展開層級。再也不用將返回的數據在去找相關的json格式化工具進行格式化了。格式化控件采用的是chenfengjw163大神的vue-json-viewer
在后端api請求的時候，一般都會在請求頭中帶一些token的驗證，來進行用戶標識，所以在設置中，進行了自定義請求頭的設置，可以方便的設置相關的請求頭,在任何一個請求都會自動帶上設置的請求信息。
來源于后端swagger配置的相關信息在此處進行展示
關于“vue的swagger-ui怎么使用”這篇文章的內容就介紹到這里，感謝各位的閱讀！相信大家對“vue的swagger-ui怎么使用”知識都有一定的了解，大家如果還想學習更多知識，歡迎關注億速云行業資訊頻道。
免責聲明：本站發布的內容（圖片、視頻和文字）以原創、轉載和分享為主，文章觀點不代表本網站立場，如果涉及侵權請聯系站長郵箱：is@yisu.com進行舉報，并提供相關證據，一經查實，將立刻刪除涉嫌侵權內容。
