[置顶] 【swagger】前后端分离联调利器——swagger安装和使用

一、前言

互联网发展越来越迅速，近来项目中使用了前后端分离的模式。前端开发使用Angular4，后端开发使用SSM框架。这样的话就有了前后端联调的问题，接口数据类型，接口返回参数等等问题。项目初期的时候使用postman进行测试，但是测试比较麻烦，需要把url粘贴进去，然后再测试，后来发现了一个联调利器——swagger。

经过了3个月使用，发现这个联调利器真的是很好使，所以记录下来，让大家一起研究。

二、安装部署

与其说是安装部署，不如说是在项目中添加swagger的相关jar包，然后把swagger交给spring管理。通过访问相关url，就可以看到swagger的管理界面了。

2.1 在项目中依赖swagger相关的jar

小编在web的项目pom中依赖：

包括了springfox-swagger2和springfox-swagger-ui，小编引入的版本都是2.7.0

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

2.2 1. Springmvc的配置文件里添加

<bean class="springfox.documentation.swagger2.configuration.Swagger2DocumentationConfiguration" id="swagger2Config"/>
<mvc:resources location="classpath:/META-INF/resources/" mapping="swagger-ui.html"/>
<mvc:resources location="classpath:/META-INF/resources/webjars/" mapping="/webjars/**"/>

添加完后的效果：

2.3 运行项目，打开swagger联调界面

小编给web配置的tomcat的端口是8081，运行项目中，在浏览器中输入：http://localhost:8081/swagger-ui.html#/

会看到如下界面：



在显示的界面中会有所有的Controller，在每个Controller中会有包含的所有的接口，可以进行调试，举个例子：

在小编项目中的place-manage-controller中，会有下面的接口，在swagger中也通过不同的颜色显示出了每个接口的responseMethod类型，绿色是post类型，棕色是put类型，红色是delete类型，蓝色是get类型。



选择一个接口会有相关的调试方法：



经过操作后，就会看到操作的结果：

三、swagger可以帮助提高代码质量

在使用springmvc的时候我们需要制定接口的responseMethod类型，如果不写，在swagger中会把所的类型都显示出来：



下次自己就知道要添加相关的类型了。

四、小结

通过研究和使用swagger，个人感觉前后台联调的效率真的提高了，有的时候真的需要通过可视化界面来显示内容，如果还要通过excel来统计各个接口，是非常不方便的，而且接口变化还是很频繁的。欢迎更多前后端分离的项目来使用swagger。