1. 程式人生 > >如何使用Swagger-UI線上生成漂亮的介面文件

如何使用Swagger-UI線上生成漂亮的介面文件

一、簡單介紹

Swagger是一個實現了OpenAPI(OpenAPI Specification)規範的工具集。OpenAPI是Linux基金會的一個專案,試圖通過定義一種用來描述API格式或API定義的語言,來規範RESTful服務開發過程。

swagger大大方便了前後端開發人員,用過的人都說好。但是也有一些人並未體驗過swagger,還在苦苦的手寫介面文件,麻煩又不規範;還有一些人雖然用過,但是隻是朦朦朧朧,看別人怎麼用直接就CV過來用了,使用的很碎片,不繫統。我之前就是這個樣子,只知道添加個依賴,啟動專案後訪問:localhost:8080/swagger-ui.html,就能看到生成的文件了,很是簡單。

一次我看到生成的文件上總是多出來一個basic-error-controller,強迫症犯了,就想要把它弄掉,於是順便看了下swagger的配置,在這裡記錄一下。

官網:https://swagger.io/

看官方的說明:

Swagger包含的工具集:

  • Swagger編輯器: Swagger Editor允許您在瀏覽器中編輯YAML中的OpenAPI規範並實時預覽文件。
  • Swagger UI: Swagger UI是HTML,Javascript和CSS資產的集合,可以從符合OAS標準的API動態生成漂亮的文件。
  • Swagger Codegen:允許根據OpenAPI規範自動生成API客戶端庫(SDK生成),伺服器存根和文件。
  • Swagger Parser:用於解析來自Java的OpenAPI定義的獨立庫
  • Swagger Core:與Java相關的庫,用於建立,使用和使用OpenAPI定義
  • Swagger Inspector(免費): API測試工具,可讓您驗證您的API並從現有API生成OpenAPI定義
  • SwaggerHub(免費和商業): API設計和文件,為使用OpenAPI的團隊構建。

二、入門案例

SpringBoot已經集成了Swagger,使用簡單註解即可生成swagger的API文件。

1.引入依賴

<dependency>
 <groupId>io.springfox</groupId>
 <artifactId>springfox-swagger2</artifactId>
 <version>2.9.2</version>
</dependency>
<dependency>
 <groupId>io.springfox</groupId>
 <artifactId>springfox-swagger-ui</artifactId>
 <version>2.9.2</version>
</dependency>

2.編寫配置

@Configuration
@EnableSwagger2 // Swagger的開關,表示已經啟用Swagger
public class SwaggerConfig {
    @Bean
    public Docket api() {
        Docket docket = new Docket(DocumentationType.SWAGGER_2)
                .host("localhost:8081")// 不配的話,預設當前專案埠
                .apiInfo(apiInfo())
                .pathMapping("/")
                .select() // 選擇哪些路徑和api會生成document
                .apis(RequestHandlerSelectors.any())// 對所有api進行監控
//                .apis(RequestHandlerSelectors.basePackage("com.hanstrovsky.controller"))// 選擇監控的package
//                .apis(RequestHandlerSelectors.withMethodAnnotation(ApiOperation.class))// 只監控有ApiOperation註解的介面
                //不顯示錯誤的介面地址
                .paths(Predicates.not(PathSelectors.regex("/error.*")))//錯誤路徑不監控
                .paths(PathSelectors.regex("/.*"))// 對根下所有路徑進行監控
                .build();
        return docket;
    }

    private ApiInfo apiInfo() {
        return new ApiInfoBuilder().title("XXXX專案介面文件")
                .contact(new Contact("Hanstrovsky", "www.hanstrovsky.com", "[email protected]"))
                .description("這是用Swagger動態生成的介面文件")
                .termsOfServiceUrl("NO terms of service")
                .license("The Apache License, Version 2.0")
                .licenseUrl("http://www.apache.org/licenses/LICENSE-2.0.html")
                .version("1.0")
                .build();
    }
}

3.啟動測試

啟動服務,訪問:http://localhost:8081/swagger-ui.html

就能看到swagger-ui為我們提供的API頁面了:

可以看到我們編寫的介面,任意點選一個,即可看到介面的詳細資訊:

可以看到詳細的介面宣告,包括:

  • 請求方式:
  • 請求路徑
  • 請求引數
  • 響應等資訊

點選右上角的try it out!還可以測試介面。

三、常用註解

剛才的文件說明中,是swagge-ui根據介面自動生成,不夠詳細。如果有需要,可以通過註解自定義介面宣告。常用的註解包括:

/**
 @Api:修飾整個類,描述Controller的作用
 @ApiOperation:描述一個類的一個方法,或者說一個介面
 @ApiParam:單個引數描述
 @ApiModel:用物件來接收引數
 @ApiProperty:用物件接收引數時,描述物件的一個欄位
 @ApiResponse:HTTP響應其中1個描述
 @ApiResponses:HTTP響應整體描述
 @ApiIgnore:使用該註解忽略這個API
 @ApiError :發生錯誤返回的資訊
 @ApiImplicitParam:一個請求引數
 @ApiImplicitParams:多個請求引數
 */

示例:

@PostMapping("/people")
@ApiOperation(value = "儲存人員資訊")
@ApiResponses({
       @ApiResponse(code = 0, message = "儲存成功"),
       @ApiResponse(code = 1, message = "儲存失敗")
})
public FrontResult save(
         @ApiParam(value = "儲存引數", example = "")
         @RequestBody People people) {
     people.setBirthday(Timestamp.valueOf(LocalDateTime.now()));
     return new FrontResult(FrontResult.SUCCEED, "儲存成功", peopleDao.save(people));
}
@Data
@ApiModel(description = "人員資訊儲存請求物件")
public class People {
    @ApiModelProperty(value = "人員編號")
    private Long id;
    @ApiModelProperty(value = "姓名", required = true,position = 1)
    private String name;
    @ApiModelProperty(value = "性別", required = true,position = 2)
    private String sex;
    @ApiModelProperty(value = "生日", required = true,position = 3)
    @JsonFormat(pattern = "yyyy-MM-dd HH:mm:ss")
    private Timestamp birthday;
}

檢視文件:

四、美化一下

如果覺得用起來不太習慣,可以用Swagger-Bootstrap-UI 替換Swagger 預設的UI實現左右選單風格的Swagger-UI ,讓其看起來更清晰明瞭。

1.新增依賴

<!-- https://mvnrepository.com/artifact/com.github.xiaoymin/swagger-bootstrap-ui -->
        <dependency>
            <groupId>com.github.xiaoymin</groupId>
            <artifactId>swagger-bootstrap-ui</artifactId>
            <version>1.9.6</version>
        </dependency>

2.重啟專案

訪問 http://localhost:8080/doc.html :

相關推薦

如何使用Swagger-UI線上生成漂亮介面

一、簡單介紹 Swagger是一個實現了OpenAPI(OpenAPI Specification)規範的工具集。OpenAPI是Linux基金會的一個專案,試圖通過定義一種用來描述API格式或API定義的語言,來規範RESTful服務開發過程。 swagger大大方便了前後端開發人員,用過的人都說好。但是也

Swagger+Spring mvc生成Restful介面

簡介 Swagger 是一個規範和完整的框架,用於生成、描述、呼叫和視覺化 RESTful 風格的 Web 服務。總體目標是使客戶端和檔案系統作為伺服器以同樣的速度來更新。檔案的方法,引數和模型緊密整合到伺服器端的程式碼,允許API來始終保持同步。Swagger 讓部署管理和使用功能強大的API從未如此簡

[Swagger] 利用Gradle外掛解析 swagger.json 並生成靜態介面

[Swagger] 利用Gradle外掛解析 swagger.json 並生成靜態介面文件 利用Gradle外掛解析 swagger.json 並生成靜態介面文件 目錄結構 |- capsule-static-doc |- docs |- as

swagger-ui教程 構建api介面工具

1.在我第一次開發app後端的時候,使用的word文件,就是我先將所有資料格式定義好,會返回什麼樣的資料寫好。前端人員照這個來進行開發。貼一張圖吧: PS:存在的問題:①介面改動時,不易被識別。②維護困難,不便於查詢。③前端開發不能進行測試。(如果還要寫

springboot整合mybatis與swagger生成rest介面

專案結構 1.swagger配置 package com.example.szp1.config; import org.springframework.context.annotation.Bean; import org.springframework.cont

基於freemark、swagger自動生成confluence介面

<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Title</title> <st

Swagger2整合springBoot,自動生成API介面

Swagger2整合springBoot 首先匯入jar包 <dependency> <groupId>io.springfox</groupId> <artifactId>springfox-swa

Spring專案整合apidoc生成api介面

一、背景需求  JavaWeb/spring專案寫成的api介面,需要自動生成api文件,甚至需要線上測試介面。考慮實現的方案有swagger,apidoc,spring rest docs。在之後的專案都有一一嘗試,最終還是覺得apidoc的方式比較合適,雖然有一些問題(針對線上

jfinal+Swagger輕鬆配置前後端介面

         開發過程中介面文件是一個剛需,開始的時候,我是手寫word文件,寫著寫著發現越到後面越難以進行,於是接觸到了swagger這個神器,這裡簡單記錄一下,踩坑過程。使用的框架是Jfinal框架,jfinal社群已經有jfinal-swagger專案

Swagger2+SpringMVC 生成API介面

簡單記錄一下配置的過程 - 匯入包 - 寫個配置類 - 在Controller層用註解進行註釋 - 通過一個URL就可以看到api介面文件 jar包

初次嘗試swagger springmvc整合 生成restful api

1、maven 所需jar包 <dependency>         <groupId>com.mangofactory</groupId>         <artifactId>swagger-springmvc<

express+ejs+swagger-ui-dist 打造及時更新的rest api 線上介面

Swagger 是restFul Api介面文件編寫神器,這裡介紹一個在nodejs環境下,應用express框架實現一個多專案介面文件伺服器,並在雲伺服器上實現及時線上更新。一、建立express工程應用express 腳手架建立一個基於ejs模板引擎的工程,進入工程目錄安

spring boot整合swagger ui (RESTFUL接口的檔在線自動生成+功能測試功能軟,前後端分離快速開發)

oot images user builder img iop spi update and swagger ui可以通過來攔截controller層,生成請求API,並將其展示在瀏覽器當中。我們可以直接通過瀏覽器來查看和調試接口。 1 添加maven依賴

Swagger生成介面

Swagger簡介 在系統設計的時候,各個應用之間往往是通過介面進行互動的。因此介面的定義在整個團隊中就變得尤為重要。我們可以把介面的規範用介面描述語言進行描述,然後Swagger可以根據我們定義的介面規範生成對應的介面文件。它生成的介面文件提供了介面測試功能。我們只需要填上對應的引數,然後點選呼叫,

Swagger 生成 PHP API 介面

Swagger 生成 PHP API 介面文件 標籤(空格分隔): php 1、概況 有同學反饋寫幾十個介面文件需要兩天的工作量, 隨著多部門之間的協作越來越頻繁, 維護成本越來越高, 文件的可維護性越來越差, 需要一個工具來管理這些介面的文件, 並能夠充當mock server給呼叫方使用。 有

整合swagger2生成Restful Api介面 webapi描述-swagger

整合swagger2生成Restful Api介面文件 swagger Restful文件生成工具 2017-9-30 官方地址:https://swagger.io/docs/specification/about/ 官方Github:https://github.com/swagger-

精簡WebAPI專案模板,使用Swagger生成介面

開發工具:VS2017 版本15.7.1 新建專案,選擇ASP.NET Web模板,.NET版本選擇4.5.2,只選擇WebAPI 這是模板自動生成的專案,接下來要把用不到的東西刪掉 右鍵【管理 NuGet程式包】,刪除無用的依賴包 在【已安裝】目錄下,依次刪除以下依賴程式包 Mi

Asp.Net Core 輕鬆學-利用 Swagger 自動生成介面

前言     目前市場上主流的開發模式,幾乎清一色的前後端分離方式,作為服務端開發人員,我們有義務提供給各個客戶端良好的開發文件,以方便對接,減少溝通時間,提高開發效率;對於開發人員來說,編寫介面文件需要消耗大量的時間,並且,手動編寫的文件介面會由於需求的頻繁變動變得難以維護,這就需要一個在介面開發階段可以

SpringBoot整合Swagger生成介面

一、簡介 Swagger是一個功能強大的API框架,它支援線上文件的檢視以及線上文件的測試,方便我們前後端開發人員對接。Swagger使用起來也很簡單,只需要加入swagger對應的依賴以及在controller類以及方法中加入相應的註解說明,swagger就會幫我們自動生

swagger 生成 PHP restful API 介面

需求: 為客戶端同事寫介面文件的各位後端同學,已經在各種場合回憶了使用自動化文件工具前手寫文件的血淚史. 我的故事卻又不同,因為首先來說,我在公司是 Android 組負責人,屬於上述血淚史中催死人不償命的客戶端陣營. 但血淚史卻是相通的,沒有自動化文件的日子,對介面