网站开发只要,青岛建站合作,河南建设工程信息网 建议访问中项网,wordpress 手机不显示前后端分离开发 介绍开发流程Yapi#xff08;api接口文档编写平台#xff09;介绍 Swagger使用方式1). 导入knife4j的maven坐标2). 导入knife4j相关配置类3). 设置静态资源映射4). 在LoginCheckFilter中设置不需要处理的请求路径 查看接口文档常用注解注解介绍 当前项目中api接口文档编写平台介绍 Swagger使用方式1). 导入knife4j的maven坐标2). 导入knife4j相关配置类3). 设置静态资源映射4). 在LoginCheckFilter中设置不需要处理的请求路径 查看接口文档常用注解注解介绍 当前项目中前端代码和后端代码混合在一起是存在问题的存在什么问题呢
主要存在以下几点问题
1). 开发人员同时负责前端和后端代码开发分工不明确
2). 开发效率低
3). 前后端代码混合在一个工程中不便于管理
4). 对开发人员要求高(既会前端又会后端)人员招聘困难
为了解决上述提到的问题现在比较主流的开发方式就是前后端分离开发前端人员开发前端的代码后端开发人员开发服务端的业务功能分工明确各司其职。我们本章节就是需要将之前的项目进行优化改造变成前后端分离开发的项目。
介绍
前后端分离开发就是在项目开发过程中对于前端代码的开发由专门的前端开发人员负责后端代码则由后端开发人员负责这样可以做到分工明确、各司其职提高开发效率前后端代码并行开发可以加快项目开发进度。
目前前后端分离开发方式已经被越来越多的公司所采用成为当前项目开发的主流开发方式。
前后端分离开发后从工程结构上也会发生变化即前后端代码不再混合在同一个maven工程中而是分为 前端工程 和 后端工程 。 前后端分离之后不仅工程结构变化后期项目上线部署时与之前也不同:
1). 之前: 前后端代码都混合在一起我们只需要将前端和后端的代码统一打成jar包直接运行就可以了。
2). 现在: 拆分为前后端分离的项目后最终部署时后端工程会打成一个jar包运行在Tomcat中(springboot内嵌的tomcat)。前端工程的静态资源会直接部署在Nginx中进行访问。
开发流程
前后端分离开发后面临一个问题就是前端开发人员和后端开发人员如何进行配合来共同开发一个项目可以按照如下流程进行 1). 定制接口: 这里所说的接口不是我们之前在service mapper层定义的interface 这里的接口(API接口)就是一个http的请求地址主要就是去定义请求路径、请求方式、请求参数、响应数据等内容。(具体接口文档描述的信息, 如上图)
2). 前后端并行开发: 依据定义好的接口信息前端人员开发前端的代码服务端人员开发服务端的接口 在开发中前后端都需要进行测试后端需要通过对应的工具来进行接口的测试前端需要根据接口定义的参数进行Mock数据模拟测试。
3). 联调: 当前后端都开发完毕并且自测通过之后就可以进行前后端的联调测试了在这一阶段主要就是校验接口的参数格式。
4). 提测: 前后端联调测试通过之后就可以将项目部署到测试服务器进行自动化测试了。
Yapiapi接口文档编写平台
介绍 YApi 是高效、易用、功能强大的 api 管理平台旨在为开发、产品、测试人员提供更优雅的接口管理服务。可以帮助开发者轻松创建、发布、维护 APIYApi 还为用户提供了优秀的交互体验开发人员只需利用平台提供的接口数据写入工具以及简单的点击操作就可以实现接口的管理。
YApi让接口开发更简单高效让接口的管理更具可读性、可维护性让团队协作更合理。
源码地址: https://github.com/YMFE/yapi
官方文档: https://hellosean1025.github.io/yapi/
Swagger
官网https://swagger.io/ Swagger 是一个规范和完整的框架用于生成、描述、调用和可视化 RESTful 风格的 Web 服务。功能主要包含以下几点:
A. 使得前后端分离开发更加方便有利于团队协作
B. 接口文档在线自动生成降低后端开发人员编写接口文档的负担
C. 接口功能测试
使用Swagger只需要按照它的规范去定义接口及接口相关的信息再通过Swagger衍生出来的一系列项目和工具就可以做到生成各种格式的接口文档以及在线接口调试页面等等。
直接使用Swagger, 需要按照Swagger的规范定义接口, 实际上就是编写Json文件编写起来比较繁琐、并不方便, 。而在项目中使用我们一般会选择一些现成的框架来简化文档的编写而这些框架是基于Swagger的如knife4j。knife4j是为Java MVC框架集成Swagger生成Api文档的增强解决方案。而我们要使用kinfe4j需要在pom.xml中引入如下依赖即可
dependencygroupIdcom.github.xiaoymin/groupIdartifactIdknife4j-spring-boot-starter/artifactIdversion3.0.2/version
/dependency使用方式
接下来我们就将我们的项目集成Knife4j来自动生成接口文档。
1). 导入knife4j的maven坐标
dependencygroupIdcom.github.xiaoymin/groupIdartifactIdknife4j-spring-boot-starter/artifactIdversion3.0.2/version
/dependency2). 导入knife4j相关配置类
这里我们就不需要再创建一个新的配置类了我们直接在WebMvcConfig配置类中声明即可。
A. 在该配置类中加上两个注解 EnableSwagger2 EnableKnife4j ,开启Swagger和Knife4j的功能。
B. 在配置类中声明一个Docket类型的bean, 通过该bean来指定生成文档的信息。
Slf4j
Configuration
EnableSwagger2
EnableKnife4j
public class WebMvcConfig extends WebMvcConfigurationSupport {/*** 设置静态资源映射* param registry*/Overrideprotected void addResourceHandlers(ResourceHandlerRegistry registry) {log.info(开始进行静态资源映射...);registry.addResourceHandler(/backend/**).addResourceLocations(classpath:/backend/);registry.addResourceHandler(/front/**).addResourceLocations(classpath:/front/);}/*** 扩展mvc框架的消息转换器* param converters*/Overrideprotected void extendMessageConverters(ListHttpMessageConverter? converters) {log.info(扩展消息转换器...);//创建消息转换器对象MappingJackson2HttpMessageConverter messageConverter new MappingJackson2HttpMessageConverter();//设置对象转换器底层使用Jackson将Java对象转为jsonmessageConverter.setObjectMapper(new JacksonObjectMapper());//将上面的消息转换器对象追加到mvc框架的转换器集合中converters.add(0,messageConverter);}Beanpublic Docket createRestApi() {// 文档类型return new Docket(DocumentationType.SWAGGER_2).apiInfo(apiInfo()).select().apis(RequestHandlerSelectors.basePackage(com.itheima.reggie.controller)).paths(PathSelectors.any()).build();}private ApiInfo apiInfo() {return new ApiInfoBuilder().title(瑞吉外卖).version(1.0).description(瑞吉外卖接口文档).build();}
}注意 Docket声明时指定的有一个包扫描的路径该路径指定的是Controller所在包的路径。因为Swagger在生成接口文档时就是根据这里指定的包路径自动的扫描该包下的Controller RestController RequestMapping等SpringMVC的注解依据这些注解来生成对应的接口文档。 3). 设置静态资源映射
由于Swagger生成的在线文档中涉及到很多静态资源这些静态资源需要添加静态资源映射否则接口文档页面无法访问。因此需要在 WebMvcConfig类中的addResourceHandlers方法中增加如下配置。
registry.addResourceHandler(doc.html).addResourceLocations(classpath:/META-INF/resources/);
registry.addResourceHandler(/webjars/**).addResourceLocations(classpath:/META-INF/resources/webjars/);4). 在LoginCheckFilter中设置不需要处理的请求路径
需要将Swagger及Knife4j相关的静态资源直接放行无需登录即可访问否则我们就需要登录之后才可以访问接口文档的页面。
在原有的不需要处理的请求路径中再增加如下链接
/doc.html,
/webjars/**,
/swagger-resources,
/v2/api-docs查看接口文档
经过上面的集成配置之后我们的项目集成Swagger及Knife4j就已经完成了接下来我们可以重新启动项目访问接口文档访问链接为 http://localhost:8080/doc.html
常用注解
问题说明 在上面我们直接访问Knife4j的接口文档页面可以查看到所有的接口文档信息但是我们发现这些接口文档分类及接口描述都是Controller的类名(驼峰命名转换而来)及方法名而且在接口文档中所有的请求参数响应数据都没有中文的描述并不知道里面参数的含义接口文档的可读性很差。
注解介绍
