缘由

接口文档想必是许多开发小伙伴的噩梦,不仅要写详细,还要及时维护文档与后端代码保持一致,稍有没及时更新接口文档,前端同学肯定会抱怨后端同学给的文档与实际情况不一致。

于是,引入了Swagger组件,它实现了代码即文档,后端只管写代码,只需要通过几个注解,会自动生成接口文档,前端同学可在线访问。

但是,对界面审美有要求的前端同学,又吐槽Swagger原生界面太low了,而且功能还少。

有压迫就有反抗,后端肯定不服,既然你嫌弃原生Swagger太low,那就给你开通超级VIP - knife4j。

原生Swagger

Springboot集成Swagger,其实很简单,主要是使用常用的几个注解而已。因为在面试他人的过程中,还是有不少人没使用过Swagger,所以这里简单介绍下。

首先在Spingboot工程中引入Swagger依赖,主要是2个,如下:

<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>

编写Swagger配置类,配置项名都简单易懂,可根据自己情况修改配置,注意一点是apis方法是指定要扫描的包路径,一定要写自己项目的。

package com.nobody.config;

import java.util.ArrayList;
import java.util.List;

import org.springframework.beans.factory.annotation.Value;
import org.springframework.context.annotation.Bean;
import org.springframework.context.annotation.Configuration;

import springfox.documentation.builders.ApiInfoBuilder;
import springfox.documentation.builders.PathSelectors;
import springfox.documentation.builders.RequestHandlerSelectors;
import springfox.documentation.service.ApiInfo;
import springfox.documentation.service.Contact;
import springfox.documentation.service.Parameter;
import springfox.documentation.spi.DocumentationType;
import springfox.documentation.spring.web.plugins.Docket;
import springfox.documentation.swagger2.annotations.EnableSwagger2;

@Configuration
@EnableSwagger2
public class Swagger2Config {

@Value("${swagger.enable:true}")
private boolean swaggerEnable;

@Bean
public Docket createApi() {
// 全局参数
List<Parameter> pars = new ArrayList<>();
return new Docket(DocumentationType.SWAGGER_2).enable(swaggerEnable).apiInfo(apiInfo())
.select().apis(RequestHandlerSelectors.basePackage("com.nobody"))
.paths(PathSelectors.any()).build().globalOperationParameters(pars);
}

private ApiInfo apiInfo() {
return new ApiInfoBuilder().title("XX服务后端API").description("XX服务专用API,其他系统请勿调用!")
.version("1.0").termsOfServiceUrl("https://nobody.com")
.contact(new Contact("陈皮", "https://nobody.com", "chenpi@qq.com")).build();
}
}

下面讲解几个常用的注解,以及如何使用,更多注解以及详细使用可以参考官方文档

  1. @Api:作用于类上,标识此类是Swagger的资源。
  2. @ApiOperation:主要作用于方法上,用于对一个接口进行说明。
  3. @ApiParam:用于方法,参数,字段上,用于对参数进行说明。
  4. @ApiModel:作用于类上,主要用于实体类当接口参数时使用,对实体类进行说明。
  5. @ApiModelProperty:作用于方法和字段上,一般用于实体类的属性说明。
package com.nobody.dto;

import io.swagger.annotations.ApiModel;
import io.swagger.annotations.ApiModelProperty;
import lombok.Data;

/**
* @Description
* @Author Mr.nobody
* @Date 2021/3/28
* @Version 1.0
*/
@ApiModel(value = "管理员实体")
@Data
public class AdminDTO {
@ApiModelProperty(value = "用户ID", required = true, example = "1548w4dwf7as1a21cv4")
private String personId;
@ApiModelProperty(value = "用户名", example = "陈皮")
private String name;
@ApiModelProperty(value = "用户年龄", required = true, example = "18")
private Integer age;
}
package com.nobody.controller;

import com.nobody.dto.AdminDTO;
import io.swagger.annotations.Api;
import io.swagger.annotations.ApiOperation;
import io.swagger.annotations.ApiParam;
import org.springframework.web.bind.annotation.*;

import java.util.ArrayList;
import java.util.List;
/**
* @Description
* @Author Mr.nobody
* @Date 2021/3/27
* @Version 1.0
*/
@Api(tags = {"管理员相关"})
@RestController
@RequestMapping("admin")
public class AdminController {

@ApiOperation(value = "添加管理员", notes = "注意:只有管理员权限才能添加管理员", produces = "application/json",
consumes = "application/json")
@PostMapping("add")
public AdminDTO add(@ApiParam(value = "参数体", required = true) @RequestBody AdminDTO adminDTO) {
return adminDTO;
}

@ApiOperation(value = "管理员列表", notes = "注意:只有管理员权限才能获取管理员列表", produces = "application/json")
@GetMapping("list")
public List<AdminDTO> list(
@ApiParam(value = "页码,从1开始,1,2,3...", required = true,
example = "1") @RequestParam Integer pageIndex,
@ApiParam(value = "页量", required = true,
example = "10") @RequestParam Integer pageSize) {
return new ArrayList<>();
}
}

Knife4J

Knife4j的前身是swagger-bootstrap-ui,前身swagger-bootstrap-ui是一个纯swagger-ui的ui皮肤项目。

目前已经发行的Knife4j版本,其本身已经引入了springfox,所以我们不需要再单独引入Springfox的具体版本,否则会导致版本冲突。

注意,使用Knife4j2.0.6及以上的版本,SpringBoot的版本必须大于等于2.2.x。

Knife4J的使用极其简单,因为Knife4J将其封装成一个启动器starter,一个可拔插式的组件,只需要引入starter依赖,即可使用。

<dependency>
<groupId>com.github.xiaoymin</groupId>
<artifactId>knife4j-spring-boot-starter</artifactId>
<version>3.0.2</version>
</dependency>

然后Swagger配置类还是和原生的一模一样,即上面介绍过的Swagger2Config类,注解的使用也是和原生的完全一样。只是项目启动后,接口文档界面的访问地址不一样:

是不是界面比原生的好看多了,还是保持着简洁美观,但是功能更多了。

当我们打开一个接口,显示的界面信息更全了,而且分为3个页面,文档,调试和Open,​如下所示:

支持全局搜索,不用在众多接口中一个一个查找,节省时间。

Knife4j 提供全局参数Debug功能,目前默认提供header(请求头)、query(form)两种方式的入参。添加全局参数后,默认Debug调试tab页会带上该参数。

Knife4j提供导出4种格式的离线文档(Html/Markdown/Word/OpenAPI)

启用个性化配置后,接口Tab标签需关闭后重新打开或者刷新当前页面。

更多Knife4J的详细介绍,可以查看官方介绍文档,很详细​。​https://xiaoym.gitee.io/knife4j/documentation/description.html

前端嫌弃原生Swagger界面太low,于是我给她开通了超级VIP的更多相关文章

  1. 女朋友看了我的博客,说太LOW了,于是我搞了一天~

    持续原创输出,点击上方蓝字关注我 原创博客+1,点击左下角阅读原文进入 目录 前言 如何下载? 配置文件的分类 基本信息配置 修改主题 Next主题样式设置 添加动态背景 修改链接的样式 添加文章搜索 ...

  2. 【转】NGUI研究院之为什么打开界面太慢(十三)

    NGUI打开界面太慢了,起初一直以为是unity的问题,最近经过我的全面测试我发现这和unity没有关系.一般一个比较复杂的界面大概需要150个GameObject  或者 UISprite .我用N ...

  3. 关于 pyspider Web预览界面太小的解决方法

    本人最近在学习pyspider时,遇到Web预览界面太小而无法很好的进行开发,于是在网上搜索解决方法. 准备: css代码: body{margin:;padding:;height:%;overfl ...

  4. java太low,又舍不得jvm平台的丰富资源?试试kotlin吧(一)

    尝试kotlin的起因 因为各种原因(版权,人员招聘),公司的技术体系从c#转到了java,我花了大概两周的时间来上手java,发现java的语法还是非常简单的,基本看着代码就知道什么意思.学习jav ...

  5. 前端 JS 原生 javascript 和 location.hash 实现一个单页应用的路由 router

    开篇日常立个flag-- 前言 最近在做一些应用,类似于单页应用,想实现类似于 Vue 路由的效果. 但是个人 Vue 基础四舍五入约等于无,而且看着 Vue-router 吃力+用不起来(因为我的项 ...

  6. 前端常见原生方法的实现(bind,promise,new,extends,深拷贝,函数防抖,函数节流)

    前端原生方法的实现,这里写一下常见的一些实现: 1.bind Function.prototype.bind2 = function (context) { var self = this; retu ...

  7. 你别告诉我你还在用Excel做数据透视分析吧,太low了!

    来到大数据分析的时代,大量的大数据分析软件涌现,尽管如此,如果今天有人问起最常用的数据透视分析工具是什么的时候,我猜想Excel应该是大家的不二之选. 但是其实我想说,用现在的手机来打比方,Excel ...

  8. 前端面试(原生js篇) - DOM

    根据我的面试经历,一般小公司的面试环节,比较关心框架的熟练程度,以及独立开发组件的能力 但大厂通常有五轮以上的面试,而且对 js 基础语法很是看重 于是我总结了一些关于 js 基础的面试对话,有的当时 ...

  9. 前端 ajax 改写登录界面

    SSM 整合项目开发到一个阶段,想慢慢地把前台框架等技术引入进来 突然碰到一个困惑好久的问题: ajax 替换原本 form 表单 post 提交登录: 一直 404 错误,心塞.... 最后发现原来 ...

随机推荐

  1. 动态规划算法 All In One

    动态规划算法 All In One dynamic programming leetcode https://leetcode.com/tag/dynamic-programming/ https:/ ...

  2. Gatsby Themes

    Gatsby Themes React & SSR gatsby-config.js refs https://www.gatsbyjs.com/docs/themes/ https://ww ...

  3. nasm astrncmp函数 x86

    xxx.asm: %define p1 ebp+8 %define p2 ebp+12 %define p3 ebp+16 section .text global dllmain export as ...

  4. JDK环境解析,安装和目的

    目录 1. JDK环境解析 1.1 JVM 1.2 JRE 1.3 JDK 2. JDK安装 2.1 为什么使用JDK8 2.1.1 更新 2.1.2 稳定 2.1.3 需求 2.2 安装JDK 2. ...

  5. Redis 日志篇:系统高可用的杀手锏

    特立独行是对的,融入圈子也是对的,重点是要想清楚自己向往怎样的生活,为此愿意付出怎样的代价. 我们通常将 Redis 作为缓存使用,提高读取响应性能,一旦 Redis 宕机,内存中的数据全部丢失,假如 ...

  6. 正月十五吃汤圆CountDownLatch

    CountDownLatch实际应用 今天是正月十五,给大家拜个晚年啦! 元宵节是中国传统节日,吃汤圆不能少啊,今天我们统计下"叫练"吃汤圆时间,并用代码模拟下叫练吃汤圆!其中用到 ...

  7. InnoDB存储引擎——页和记录(行)

    一.InnoDB页 InnoDB是一个将表中的数据存储到磁盘上的存储引擎,所以即使关机后重启我们的数据还是存在的.而真正处理数据的过程是发生在内存中的,所以需要把磁盘中的数据加载到内存中,如果是处理写 ...

  8. 剑指 Offer 44. 数字序列中某一位的数字 + 找规律 + 数位

    剑指 Offer 44. 数字序列中某一位的数字 Offer_44 题目描述 题解分析 java代码 package com.walegarrett.offer; /** * @Author Wale ...

  9. 使用SQLSERVER 2008 R2 配置邮件客户端发送DB数据流程要领

    设置邮件 QQ邮箱貌似不太行,建议用企业邮箱或者其他邮箱作为发件箱 新建一个邮件发件箱账号,具体邮件服务器按照各自邮件配置,是否使用ssl,自便 下一步,下一步,配置成功 use msdb Go DE ...

  10. 优秀的vue服务端渲染框架

    目前国内优秀的基于vue的ssr框架有minissr,可以在服务端生成html代码,有利于搜索引擎爬取. https://www.wechatmini.com/vue/minissr 使用方法可以参考 ...