1. 程式人生 > >給Swagger換一套面板 Knife4j整合記錄

給Swagger換一套面板 Knife4j整合記錄

Swagger有一套經典的UI,但是並不是很好用,之前有看到Knife4j,介面美觀、功能完善,因此嘗試整合。 demo參考示例地址:[knife4j-spring-boot-demo](https://gitee.com/xiaoym/swagger-bootstrap-ui-demo/tree/master/knife4j-spring-boot-demo) Knife4j前身是swagger-bootstrap-ui,是一個為Swagger介面文件賦能的工具 根據官方文件,整合非常方便。 ## maven引用 第一步,是在專案的`pom.xml`檔案中引入`knife4j`的依賴,如下: ``` com.github.xiaoymin knife4j-spring-boot-starter 2.0.6 ``` 當前最新版是2.0.6 如果你想使用bom的方式引入,請參考[Maven Bom方式引用](https://doc.xiaominfo.com/knife4j/mavenbom.html) ## 建立Swagger配置檔案 新建Swagger的配置檔案`SwaggerConfiguration.java`檔案,建立springfox提供的Docket分組物件,程式碼如下: ``` @Configuration @EnableSwagger2 @EnableKnife4j @Import(BeanValidatorPluginsConfiguration.class) public class SwaggerConfiguration { @Bean(value = "defaultApi2") public Docket defaultApi2() { Docket docket=new Docket(DocumentationType.SWAGGER_2) .apiInfo(apiInfo()) //分組名稱 .groupName("2.X版本") .select() //這裡指定Controller掃描包路徑 .apis(RequestHandlerSelectors.basePackage("com.swagger.bootstrap.ui.demo.new2")) .paths(PathSelectors.any()) .build(); return docket; } } ``` 以上有兩個註解需要特別說明,如下表: | 註解 | 說明 | | --- | --- | | `@EnableSwagger2` | 該註解是Springfox-swagger框架提供的使用Swagger註解,該註解必須加 | | `@EnableKnife4j` | 該註解是`knife4j`提供的增強註解,Ui提供了例如動態引數、引數過濾、介面排序等增強功能,如果你想使用這些增強功能就必須加該註解,否則可以不用加 | ## spring-security 免認證 將`/**/doc.html/**` 加入: ``` javascript private String[] getSwaggerUrl() { List urls = new ArrayList(); urls.add("/**/swagger-resources/**"); urls.add("/**/webjars/**"); urls.add("/**/doc.html/**"); urls.add("/**/v2/**"); urls.add("/**/swagger-ui.html/**"); return urls.toArray(new String[urls.size()]); } http.authorizeRequests() .antMatchers(getSwaggerUrl()).permitAll() ``` ## 測試訪問 在瀏覽器輸入地址:`http://host:port/doc.html` 可以設定全域性引數: ![全域性引數](https://gitee.com/jadepeng/pic/raw/master/pic/2020/11/2/1604286718931.png) 支援線上除錯 ![線上除錯](https://gitee.com/jadepeng/pic/raw/master/pic/2020/11/2/1604286643402.png) 離線文件支援匯出md、pdf等 ![匯出文件](https://gitee.com/jadepeng/pic/raw/master/pic/2020/11/2/1604286760474.png) ## 最後 前端如何更優雅的呼叫api呢?參考: [Vue 使用typescript, 優雅的呼叫swagger API](https://www.cnblogs.com/xiaoqi/p/generator-swagger-2-ts-2.html) 後面有空,可以將這個整合到knife4j --- >作者:Jadepeng 出處:jqpeng的技術記事本--[http://www.cnblogs.com/xiaoqi](http://www.cnblogs.com/xiaoqi) 您的支援是對博主最大的鼓勵,感謝您的認真閱讀。 本文版權歸作者所有,歡迎轉載,但未經作者同意必須保留此段宣告,且在文章頁面明顯位置給出原文連線,否則保留追究法律責任的權利。