前后端分离之【接口文档管理及数据模拟工具docdoc与dochelper】

前后端分离的常见开发方式是:

  • 后端:接收http请求->根据请求url及params处理对应业务逻辑->将处理结果序列化为json返回
  • 前端:发起http请求并传递相关参数->获取返回结果处理相关逻辑

分离的主要目的是让前后端可以并行的进行工作,彼此之间只需要依赖一份接口文档

接口文档可能会使用一些文本工具进行记录,例如word,excel等

其中记录的内容可能为请求路径,请求类型,请求参数,响应参数,请求示例,响应示例,变更记录等

不过以上方式还存在那么一点不完美,那就是前端需要等待后端开发完接口才能有数据进行测试在此之前只能先画页面

这就有可能造成前端要等后端的情况,使工作变为串行

因此我想能否有办法可以消除这种情况,让前端不必等待后端

经过一段时间的摸索,我想可以做一个mock server来模拟前端需要的数据

当前端请求某个url时,mock server会在其数据库中进行查询,匹配到这个url后就返回默认或者用户自定义的模拟数据

这样一来前端就可以在不依赖后端的情况下拿到数据进行测试了

但如果只是仅仅依赖mock server,那么一些已开发的接口将无法得到正常的请求

那么问题就又变成了如何使正常接口与mock接口共存

很容易想到的就是使用nginx反向代理,将未开发完的接口匹配到mock server,剩余的接口匹配正常程序

所以前端开发时自己启动一个nginx,然后需要mock什么接口自己去配置即可

但是。。。。当接口很多时,前端得自己手动去配置nginx,还要在对nginx进行重启等等操作,很繁琐

为了解决这个问题我又想能不能让这一切自动化的去完成

有一个客户端程序,自动的对nginx进行相关配置并启动nginx,将开发中的接口转发给mock server,将其余接口转发给正常程序

显然这个思路是可行的,为了让程序好用,客户端制作成了GUI,并且打包成了exe,使以上nginx配置步骤变为一键操作

以下是根据以上思路制作完毕的docdoc及dochelper截图,及一个简单的演示视频:

视频地址:https://www.bilibili.com/video/av46052020

github docdoc:https://github.com/github20120522/docdoc

github dochelper:https://github.com/github20120522/docdochelper

原文地址:https://www.cnblogs.com/xiayudashan/p/10518500.html

时间: 2024-07-30 12:42:54

前后端分离之【接口文档管理及数据模拟工具docdoc与dochelper】的相关文章

Api接口文档管理工具,你知道哪些呢?

上周看到有人在我的Github开源项目中提了个issue,说是否考虑接入swagger.那今天我就用swagger与其他接口文档工具做对比,同时说说Api接口文档工具的那点事.如今,在前后端分离开发的这个年代,Api接口文档管理工具越来越显得重要.完整的Api接口文档能大大提升前后端开发协作的效率. image 目前市场有哪些比较优秀的接口文档管理工具呢?Swagger Api接口文档工具到底如何,我大致汇总一下吧! 一.Swagger 说到Swagger,他确实是为开发者发明的一款神器,他可以

.NET Core使用swagger进行API接口文档管理

一.问题背景 随着技术的发展,现在的开发模式已经更多的转向了前后端分离的模式,在前后端开发的过程中,联系的方式也变成了API接口,但是目前项目中对于API的管理很多时候还是通过手工编写文档,每次的需求变更只要涉及到接口的变更,文档都需要进行额外的维护,如果有哪个小伙伴忘记维护,很多时候就会造成一连续的问题,那如何可以更方便的解决API的沟通问题?Swagger给我们提供了一个方式,由于目前主要我是投入在.NET Core项目的开发中,所以以.NET Core作为示例 二.什么是Swagger S

强烈推荐 在线接口文档管理工具 小幺鸡 小团队可以省掉测试了

在朋友那儿看到一个不错的在线文档管理工具 主要特点 : 在线接口测试 在线测试,方便前后端开发,降低错误率.支持:xml.json.txt.binary.websocket 可视化编辑与分享 可视化编辑器,完善的分享机制,多功能导出.让接口撰写变得十分简单 安全保障 基于阿里云服务器,提供安全备份系统.多家公司使用,安全证明. 代码开源 可离线安装到内网服务器仅供公司内部使用.接口在线测试,降低接口错误率 开放源码,支持任意修改 简洁明了的API 简单的维护更新 多种导出满足不同需求 自己搭建试

前后端分离之——接口数据返回---标准格式

开发中,如果前端和后端,在没有统一返回数据格式,我们来看一下会发生什么: 后台开发人员A,在接口返回时,习惯返回一个返回码code=0000,然后返回数据: 后台开发人员B,在接口返回时,习惯直接返回一个boolean类型的success=true,然后返回数据: 后台开发人员C,在接口返回时,习惯在接口失败时返回码为code=0000. 可以看到,上面的三个开发人员,都没有大问题,没有谁对谁错,只要给前端接口文档,前端都是可以接上接口的.但是,在项目功能越来越多,接口数量持续增长时,对开发人员

webpack 前后端分离开发接口调试解决方案,proxyTable解决方案

如果你有单独的后端开发服务器 API,并且希望在同域名下发送 API 请求 ,那么代理某些 URL 会很有用. dev-server 使用了非常强大的 http-proxy-middleware 包.更多高级用法,请查阅其文档. 在 localhost:3000 上有后端服务的话,你可以这样启用代理: proxy: { "/api": "http://localhost:3000" } 请求到 /api/users 现在会被代理到请求 http://localhos

vue的初识与简单使用---前后端分离通过接口调取数据

vue的安装 #### 1.环境搭建 ''' - 安装node ``` 官网下载安装包,傻瓜式安装:https://nodejs.org/zh-cn/ ``` - 安装cnpm ``` npm install -g cnpm --registry=https://registry.npm.taobao.org ``` - 安装脚手架 ``` cnpm install -g @vue/cli ``` - 清空缓存处理 ``` npm cache clean --force ``` #### 2.项

DoNetCore Web Api 采用Swagger进行接口文档管理

第一步:创建API项目 步骤这里不说明 第二步:就是Nuget 包, 两种方式:1.工具->Nuget管理->程序包管理控制台 Install-Package Swashbuckle.AspNetCore 2.工具->Nuget管理->管理Nuget包...  或者右击项目... 输入 Swashbuckle.AspNetCore 第三步:全局配置,这里以最简单的配置为例 在Startup.cs 文件下 ConfigureService 下添加如下代码 services.AddSw

Dokuwiki API接口文档管理中文支持更改

1.文件 \conf\local.php 增加$conf['fnencode'] = 'gbk';如果存就更改 2.文件 \inc\pageutils.php function utf8_encodeFN($file,$safe=true){ global $conf; if($conf['fnencode'] == 'utf-8') return $file; if($safe && preg_match('#^[a-zA-Z0-9/_\-\.%]+$#',$file)){ return

前后端分离--构建前端Mock Server

mock:模拟的,虚假的 mock server:模拟服务,模拟请求,模拟虚假数据 为了前后端更好的分工,接口文档是必须的,前后端都根据接口文档写代码,然后对接接口就行了. 但是,后端跟不上前端节奏,接口跟不上来怎么办?即便接口跟上来了,大后端数据跟不上又怎么办? 第一种想到的方法就是模拟返回数据,根据接口文档定义好的返回数据格式,新建一个json文件夹,里面放一堆*.json文件,像这样: 然后请求json数据,像这样: 所以为了前端有数据,就会有很多很多的请求json文件.当后端接口上来后,