前往小程序,Get更优阅读体验!
立即前往
首页
学习
活动
专区
工具
TVP
发布
社区首页 >专栏 >[springboot 开发单体web shop] 4. Swagger生成Javadoc

[springboot 开发单体web shop] 4. Swagger生成Javadoc

作者头像
Isaac Zhang
发布2019-11-10 15:30:06
7630
发布2019-11-10 15:30:06
举报
文章被收录于专栏:奔跑的人生奔跑的人生

目录

  • Swagger生成JavaDoc
    • 什么是Swagger
    • 集成Swagger
      • 添加依赖
      • 启用功能
      • 配置基础信息
      • 阶段效果一
      • 完善说明信息
    • 集成更好用的UI界面
      • 集成依赖
      • 预览效果
    • 生成离线文档
      • 开源项目swagger2markup
      • 使用MAVEN插件生成AsciiDoc文档
      • 使用MAVEN插件生成HTML
    • 下节预告

Swagger生成JavaDoc


在日常的工作中,特别是现在前后端分离模式之下,接口的提供造成了我们前后端开发人员的沟通 成本大量提升,因为沟通不到位,不及时而造成的[撕币]事件都成了日常工作。特别是很多的开发人员 不擅长沟通,造成的结果就会让自己特别的痛苦,也让合作人员的牙根痒痒。 为了结束战火蔓延,同时为了提升开发人员的满意度,Swagger应运而生。

什么是Swagger


Swagger for Everyone Simplify API development for users, teams, and enterprises with the Swagger open source and professional toolset. Swagger open source and pro tools have helped millions of API developers, teams, and organizations deliver great APIs.

简言之就是指使用工具集简化用户、团队和企业的API开发。

  • 官方传送门
  • 源码传送门
  • Swagger-UI传送门
  • 扩展组件swagger-spring-boot-starter传送门
  • 扩展UI组件swagger-bootstrap-ui传送门

集成Swagger


系统中我选择使用的是swagger-spring-boot-starter

该项目主要利用Spring Boot的自动化配置特性来实现快速的将swagger2引入spring boot应用来生成API文档,简化原生使用swagger2的整合代码。 看得出来,我在教大家使用的都是在偷懒哦,这可不是什么好现象。。。

添加依赖

代码语言:javascript
复制
        <!--整合Swagger2-->
        <dependency>
            <groupId>com.spring4all</groupId>
            <artifactId>swagger-spring-boot-starter</artifactId>
            <version>1.9.0.RELEASE</version>
        </dependency>

点击版本号进入swagger-spring-boot-starter/1.9.0.RELEASE/swagger-spring-boot-starter-1.9.0.RELEASE.pom,可以看到它依赖的版本信息。

代码语言:javascript
复制
    <properties>
        <project.build.sourceEncoding>UTF-8</project.build.sourceEncoding>
        <version.java>1.8</version.java>
        <version.swagger>2.9.2</version.swagger>
        <version.spring-boot>1.5.10.RELEASE</version.spring-boot>
        <version.lombok>1.18.6</version.lombok>
    </properties>

启用功能

在我们的启动类ApiApplication上增加@EnableSwagger2Doc注解

代码语言:javascript
复制
@SpringBootApplication
@MapperScan(basePackages = "com.liferunner.mapper")
@ComponentScan(basePackages = {"com.liferunner", "org.n3r.idworker"})
@EnableSwagger2Doc //启动Swagger
public class ApiApplication {

    public static void main(String[] args) {
        new SpringApplicationBuilder()
                .sources(ApiApplication.class)
                .run(args);
    }

    @Autowired
    private CORSConfig corsConfig;

    /**
     * 注册跨域配置信息
     *
     * @return {@link CorsFilter}
     */
    @Bean
    public CorsFilter corsFilter() {
        val corsConfiguration = new CorsConfiguration();
        corsConfiguration.addAllowedOrigin(this.corsConfig.getAllowOrigin());
        corsConfiguration.addAllowedMethod(this.corsConfig.getAllowedMethod());
        corsConfiguration.addAllowedHeader(this.corsConfig.getAllowedHeader());
        corsConfiguration.setAllowCredentials(this.corsConfig.getAllowCredentials());

        val urlBasedCorsConfigurationSource = new UrlBasedCorsConfigurationSource();
        urlBasedCorsConfigurationSource.registerCorsConfiguration("/**", corsConfiguration);

        return new CorsFilter(urlBasedCorsConfigurationSource);
    }
}

配置基础信息

可以通过properties文件和yml/yaml文件配置。

代码语言:javascript
复制
# 配置swagger2
swagger:
  enabled: true #是否启用swagger,默认:true
  title: 实战电商api平台
  description: provide 电商 API
  version: 1.0.0.RC
  license: Apache License, Version 2.0
  license-url: https://www.apache.org/licenses/LICENSE-2.0.html
  terms-of-service-url: http://www.life-runner.com
  contact:
    email: magicianisaac@gmail.com
    name: Isaac-Zhang
    url: http://www.life-runner.com
  base-package: com.liferunner
  base-path: /**

阶段效果一

运行我们的api项目,在浏览器输入:http://localhost:8088/swagger-ui.html,可以看到如下:

阶段效果1
阶段效果1

可以看到,我们在yml文件中配置的信息,展示在了页面的顶部,点击用户管理:

用户管理
用户管理

从上图可以看出,我们的/users/create接口展出出来,并且要传入的参数,请求类型等等信息都已经展示在上图中。 但是,要传递的参数是什么意思,都是我们的字段信息,我们要如何让它更友好的展示给调用方呢?让我们继续 完善我们的文档信息:

完善说明信息

在我们创建用户的时候,需要传递一个com.liferunner.dto.UserRequestDTO对象,这个对象的属性如下:

代码语言:javascript
复制
@RestController
@RequestMapping(value = "/users")
@Slf4j
@Api(tags = "用户管理")
public class UserController {

    @Autowired
    private IUserService userService;

    @ApiOperation(value = "用户详情", notes = "查询用户")
    @ApiIgnore
    @GetMapping("/get/{id}")
    //@GetMapping("/{id}") 如果这里设置位这样,每次请求swagger都会进到这里,是一个bug
    public String getUser(@PathVariable Integer id) {
        return "hello, life.";
    }

    @ApiOperation(value = "创建用户", notes = "用户注册接口")
    @PostMapping("/create")
    public JsonResponse createUser(@RequestBody UserRequestDTO userRequestDTO) {
        //...
    }
}

代码语言:javascript
复制
@Data
@AllArgsConstructor
@NoArgsConstructor
@Builder
@ApiModel(value = "创建用户DTO", description = "用户注册需要的参数对象")
public class UserRequestDTO {
    @ApiModelProperty(value = "用户名", notes = "username", example = "isaaczhang", required = true)
    private String username;
    @ApiModelProperty(value = "注册密码", notes = "password", example = "12345678", required = true)
    private String password;
    @ApiModelProperty(value = "确认密码", notes = "confimPassword", example = "12345678", required = true)
    private String confirmPassword;
}

可以看到,我们有很多通过@Apixxx开头的注解说明,这个就是Swagger提供给我们用以说明字段和文档说明的注解。

  • @Api 表示对外提供API
  • @ApiIgnore 表示不对外展示,可用于类和方法
  • @ApiOperation 就是指的某一个API下面的CURD动作
  • @ApiResponses 描述操作可能出现的异常情况
  • @ApiParam 描述传递的单参数信息
  • @ApiModel 用来描述java object的属性说明
  • @ApiModelProperty 描述object 字段说明 所有的使用,都可以进入到相关的注解的具体class去查看所有的属性信息,都比较简单,这里就不做具体描述了。想要查看更多的属性说明, 大家可以进入:Swagger属性说明传送门。

配置完之后,重启应用,刷新UI页面:

阶段效果二
阶段效果二

上图中红框圈定的都是我们重新配置的说明信息,足够简单明了吧~

集成更好用的UI界面

针对于API说明来说,我们上述的信息已经足够优秀了,可是做技术,我们应该追求的是更加极致的地步,上述的UI界面在我们提供大批量 用户接口的时候,友好型就有那么一丢丢的欠缺了,现在给大家再介绍一款更好用的开源Swagger UI,有请swagger-bootstrap-ui。

UI2
UI2

我们从上图可以看到,这个UI的Star数目已经超过1.1K了,这就证明它已经很优秀了,我们接下来解开它的庐山真面目吧。

集成依赖

只需要在我们的expensive-shop\pom.xml中加入以下依赖代码:

代码语言:javascript
复制
        <!--一种新的swagger ui-->
        <dependency>
            <groupId>com.github.xiaoymin</groupId>
            <artifactId>swagger-bootstrap-ui</artifactId>
            <version>1.6</version>
        </dependency>

预览效果

添加完依赖后,只需要重启我们的应用,然后访问http://localhost:8088/doc.html,效果如下:

阶段效果3
阶段效果3

点击创建用户:

阶段效果4
阶段效果4

上述的效果是不是更符合我们的审美了~ 到此为止,我们使用Swagger来动态生成API的效果已经全部演示完了,但是如果某一天我们要和一个不能连接查看我们网站的客户进行集成的时候,我们怎么办呢? 还是要手写一份文档给他们吗? 那我们不就一样很痛苦吗!!! 作为程序员,我们是绝对不能允许这种情况发生的! 那就让我们继续看下去。

生成离线文档

为了不让我们做痛苦的工作,我们既然已经在代码中添加了那么多的说明信息,是否有一种方式可以帮助我们来生成一份离线的文档呢?答案是肯定的。

开源项目swagger2markup

A Swagger to AsciiDoc or Markdown converter to simplify the generation of an up-to-date RESTful API documentation by combining documentation that’s been hand-written with auto-generated API documentation.

源码传送门 documents传送门

Swagger2Markup它主要是用来将Swagger自动生成的文档转换成几种流行的格式以便离线使用 格式:AsciiDoc、HTML、Markdown、Confluence

使用MAVEN插件生成AsciiDoc文档

mscx-shop-api\pom.xml中加入以下依赖代码:

代码语言:javascript
复制
<build>
        <plugins>
            <!--生成 AsciiDoc 文档(swagger2markup)-->
            <plugin>
                <groupId>io.github.swagger2markup</groupId>
                <artifactId>swagger2markup-maven-plugin</artifactId>
                <version>1.3.3</version>
                <configuration>
                    <!--这里是要启动我们的项目,然后抓取api-docs的返回结果-->
                    <swaggerInput>http://localhost:8088/v2/api-docs</swaggerInput>
                    <outputDir>src/docs/asciidoc/generated-doc</outputDir>
                    <config>
                        <swagger2markup.markupLanguage>ASCIIDOC</swagger2markup.markupLanguage>
                    </config>
                </configuration>
            </plugin>
        </plugins>
    </build>
  • <swaggerInput>http://localhost:8088/v2/api-docs</swaggerInput> 是为了获取我们的api JSON数据,如下图:
API-JSON
API-JSON
  • <outputDir>src/docs/asciidoc/generated-doc</outputDir> 设置我们要生成的目录地址

执行命令:

代码语言:javascript
复制
expensive-shop\mscx-shop-api>mvn swagger2markup:convertSwagger2markup

要是大家觉得命令太长了,也可以点击IDEA => Maven => mscx-shop-api => Plugins => swagger2markup => swagger2markup:convertSwagger2markup就可以执行啦,如下图:

swagger2markup
swagger2markup

生成结果如下:

asciidoc
asciidoc

adoc文件生成好了,那么我们使用它来生成html吧

使用MAVEN插件生成HTML

mscx-shop-api\pom.xml中加入以下依赖代码:

代码语言:javascript
复制
            <!--生成 HTML 文档-->
            <plugin>
                <groupId>org.asciidoctor</groupId>
                <artifactId>asciidoctor-maven-plugin</artifactId>
                <version>1.5.6</version>
                <configuration>
                    <sourceDirectory>src/docs/asciidoc/generated-doc</sourceDirectory>
                    <outputDirectory>src/docs/asciidoc/html</outputDirectory>
                    <backend>html</backend>
                    <sourceHighlighter>coderay</sourceHighlighter>
                    <attributes>
                        <toc>left</toc>
                    </attributes>
                </configuration>
            </plugin>
  • <sourceDirectory>src/docs/asciidoc/generated-doc</sourceDirectory> 源文件目录指定为我们上一节生成的adoc
  • <outputDirectory>src/docs/asciidoc/html</outputDirectory> 指定输出目录

执行生成命令:

代码语言:javascript
复制
\expensive-shop\mscx-shop-api>mvn asciidoctor:process-asciidoc

生成结果如下:

result html
result html

打开overview.html,如下:

html
html

至此,我们的文档就已经全部生成了!

下节预告


下一节我们将继续开发我们的用户登录以及首页信息的部分展示,在过程中使用到的任何开发组件,我都会通过专门的一节来进行介绍的,兄弟们末慌!

gogogo!

本文参与 腾讯云自媒体分享计划,分享自作者个人站点/博客。
原始发表:2019-11-08 ,如有侵权请联系 cloudcommunity@tencent.com 删除

本文分享自 作者个人站点/博客 前往查看

如有侵权,请联系 cloudcommunity@tencent.com 删除。

本文参与 腾讯云自媒体分享计划  ,欢迎热爱写作的你一起参与!

评论
登录后参与评论
0 条评论
热度
最新
推荐阅读
目录
  • Swagger生成JavaDoc
    • 什么是Swagger
      • 集成Swagger
        • 添加依赖
        • 启用功能
        • 配置基础信息
        • 阶段效果一
        • 完善说明信息
      • 集成更好用的UI界面
        • 集成依赖
        • 预览效果
      • 生成离线文档
        • 开源项目swagger2markup
        • 使用MAVEN插件生成AsciiDoc文档
        • 使用MAVEN插件生成HTML
      • 下节预告
      相关产品与服务
      Serverless HTTP 服务
      Serverless HTTP 服务基于腾讯云 API 网关 和 Web Cloud Function(以下简称“Web Function”)建站云函数(云函数的一种类型)的产品能力,可以支持各种类型的 HTTP 服务开发,实现了 Serverless 与 Web 服务最优雅的结合。用户可以快速构建 Web 原生框架,把本地的 Express、Koa、Nextjs、Nuxtjs 等框架项目快速迁移到云端,同时也支持 Wordpress、Discuz Q 等现有应用模版一键快速创建。
      领券
      问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档