前端api接口文档模板(前端接口文档怎么用)

网友投稿 507 2023-02-26


本篇文章给大家谈谈前端api接口文档模板,以及前端接口文档怎么用对应的知识点,希望对各位有所帮助,不要忘了收藏本站喔。 今天给各位分享前端api接口文档模板的知识,其中也会对前端接口文档怎么用进行解释,如果能碰巧解决你现在面临的问题,别忘了关注本站,现在开始吧!

本文目录一览:

使用 API Blueprint 来编写 API 接口文档

API Blueprint 用来编写API文档的一种标记语言前端api接口文档模板,类似于Markdown,具体的语法规则可以在 API Blueprint documentation 查看,文档里面还有一个简短的 API Blueprint tutorial 建议先仔细阅读一下这个教程。

使用 API Blueprint 文档,配合一些开源的工具可以把接口文档渲染成 html 再搭配一个静态服务器,就可以很方便的共享给同事。

相对于 word 这种富文本格式的文档来说, API Blueprint 是纯文本,这样可以很方便的使用版本控制工具 Git 来控制版本。

另外,配合一些工具,可以直接生成一个 mock data 数据,这样只要和后端的同学约定好接口格式,那么前端再开发的时候可以使用 mock data 数据来做测试,等到后端写好接口之后再做联调就可以前端api接口文档模板了。

API Blueprint 社区提供了一些文本编辑器的插件,可以识别 API Blueprint 语法支持语法高亮。

使用 apiblueprint 编写好文档使用,可以使用开源社区提供的一个工具 aglio 来把接口文档渲染成 html 文件, aglio 还会启动一个静态服务器,这样就可以在浏览器里面查看渲染好的文档了。

aglio 的使用教程,可以直接查看官方开发仓库的 readme 文档。另外,这里也有一份资料 使用API-Blueprint 编写 API 文档 可以参考。

前端文档接口怎么写

1.先上一个案例

a.接口名称如果是获取天气预报那么应该突出“获取”,第一个单词应该是动词,for example:get

b.采用小驼峰命名法

c.接口地址是后端人员编写的,这行就不要写了

d.参数和返回的数据一律小写

e.如果返回值有图片地址的话,应该是个路径而不是图片名  for exampl:picname:"./file/weather/real.jpg"

Restful接口文档规范

基于目前的大前端时代,对于常年负责后台开发的我来说, 最重要的就是提供稳定的接口和文档。便于小伙伴们进行业务对接。

当下常用的是RestFul风格的定义规范, 之前开发是清一色Get、Post。引入RestFul后感觉接口定义规范很多,看接口地址就知晓是什么功能, 一起来看看列的一些基础规范吧。
API与客户端用户的通信协议,总是使用HTTPS协议,以确保交互数据的传输安全。
应该尽量将API部署在专用域名之下: https://api.example.com

如果确定API很简单,不会有进一步扩展,可以考虑放在主域名下: https://www.example.com/api
https://api.example.com/v{n}

1、应该将API的版本号放入URL。

2、采用多版本并存,增量发布的方式。

3、n代表版本号,分为整型和浮点型

整型: 大功能版本, 如v1、v2、v3 ...

浮点型: 补充功能版本, 如v1.1、v1.2、v2.1、v2.2 ...

4、对于一个 API 或服务,应在生产中最多保留 3 个最详细的版本
路径又称"终点"(end point),表示API的具体网址。

1、在RESTful架构中,每个网址代表一种资源(resource),所以网址中不能有动词,只能有名词。

【所用的名词往往与数据库的表格名对应】

2、数据库中的表一般都是同种记录的"集合"(collection),所以API中的名词也应该使用复数。

例子: https://api.example.com/v1/products

https://api.example.com/v1/users

https://api.example.com/v1/employees
GET(SELECT): 从服务器取出资源(一项或多项)。

POST(CREATE): 在服务器新建一个资源。

PUT(UPDATE): 在服务器更新资源(客户端提供改变后的完整资源)。

DELETE(DELETE): 从服务器删除资源。

例子:

GET /v1/products 获取所有商品

GET /v1/products/ID 获取某个指定商品的信息

POST /v1/products 新建一个商品

PUT /v1/products/ID 更新某个指定商品的信息

DELETE /v1/products/ID 删除某个商品,更合理的设计详见【9、非RESTful API的需求】

GET /v1/products/ID/purchases 列出某个指定商品的所有投资者

GET /v1/products/ID/purchases/ID 获取某个指定商品的指定投资者信息
若记录数量很多,服务器不可能返回全部记录给用户。

API应该提供分页参数及其它筛选参数,过滤返回结果。

/v1/products?page=1pageSize=20 指定第几页,以及每页的记录数。

/v1/products?sortBy=nameℴ=asc 指定返回结果按照哪个属性排序,以及排序顺序。
传入参数分为4种类型:

1、cookie: 一般用于OAuth认证

2、request header: 一般用于OAuth认证

3、请求body数据:

4、地址栏参数:

1)restful 地址栏参数 /v1/products/ID ID为产品编号,获取产品编号为ID的信息

2)get方式的查询字段 见【六、过滤信息】
response:

----------------------------------------

{

status: 200, // 详见【status】

data: {

code: 1, // 详见【code】

data: {} || [], // 数据

message: '成功', // 存放响应信息提示,显示给客户端用户【须语义化中文提示】

sysMessage: 'success' // 存放响应信息提示,调试使用,中英文都行

... // 其它参数,如 total【总记录数】等

},

msg: '成功', // 存放响应信息提示,显示给客户端用户【须语义化中文提示】

sysMsg: 'success' // 存放响应信息提示,调试使用,中英文都行

}

----------------------------------------

【status】:

200: OK 400: Bad Request 500:Internal Server Error

401:Unauthorized

403:Forbidden

404:Not Found

【code】:

1: 获取数据成功 | 操作成功 0:获取数据失败 | 操作失败
1、实际业务开展过程中,可能会出现各种的api不是简单的restful 规范能实现的。

2、需要有一些api突破restful规范原则。

3、特别是移动互联网的api设计,更需要有一些特定的api来优化数据请求的交互。

1)、删除单个 | 批量删除 : DELETE /v1/product body参数{ids:[]}

2)、页面级API : 把当前页面中需要用到的所有数据通过一个接口一次性返回全部数据
1、前端需要哪些字段,API接口应该返回哪些字段,字段不多也不少。

2、更新功能尽量做到:初次返回的原始数据参数与提交更新的数据参数结构一致。

3、时间参数,尽量以一致格式的字符串传递, 如:

‘2019-01’ | ‘2019/01’

‘2019-01-01’ | ‘2019/01/01’

‘2019-01-01 12:12:12’ | ‘2019/01/01 12:12:12’
1、尽量采用自动化接口文档,可以做到在线测试,同步更新。

2、应包含:接口BASE地址、接口版本、接口模块分类等。

3、每个接口应包含:

接口地址:不包含接口BASE地址。

请求方式: get、post、put、delete等。

请求参数:数据格式【默认JSON、可选form data】、数据类型、是否必填、中文描述。

相应参数:类型、中文描述。

还在发愁写API文档?推荐一款阿里腾讯都在用的API管理神器

作为一个前后端分离模式开发的团队,我们经常会看到这样的场景:前端开发和后端开发在一起热烈的讨论“你这接口参数怎么又变了?”,“接口怎么又不通了?”,“稍等,我调试下”,“你再试试..."。

那能不能写好接口文档,大家都按文档来开发?很难,因为写文档、维护文档比较麻烦,而且费时,还会经常出现 API 更新了,但文档还是旧的,各种同步不一致的情况,从而耽搁彼此的时间。

之前我们团队也遇到了同样的问题,那么作为研发团队的负责人,我是如何带领团队解决这个问题的呢?

方法其实很简单,如果能做到让写文档/维护文档这件事情的短期收益就能远高于付出的成本,那么所有问题都能迎刃而解,开发人员就会非常乐意去写接口文档。

要做到写文档和及时维护文档的短期收益就能远高于付出的成本,无非两个方向:

鉴于此,我们设想如果有一款工具做到以下这些是不是就非常爽了?

总结下来,我们需要的就是这么一款工具:

为此,我们几乎尝遍了市面上所有相关的工具,但是很遗憾,没有找到合适的。

于是,我们自己实现了一个Postman + Swagger + RAP + JMeter

这个工具就是 Apifox,经常很长一段时间不断更新迭代后,我们基本上完全实现了最初的设想,几乎完美解决了最开始遇到的所有问题,在公司内部大受欢迎。并且也形成了我们自己的最佳实践。

没错,现在我们已经将Apifox产品化对外服务了,你们团队也可以直接使用Apifox了。

官网:www.apifox.cn

Apifox = Postman + Swagger + Mock + JMeter

Apifox 是 API 文档、API 调试、API Mock、API 自动化测试一体化协作平台。

通过一套系统、一份数据,解决多个系统之间的数据同步问题。只要定义好接口文档,接口调试、数据 Mock、接口测试就可以直接使用,无需再次定义;接口文档和接口开发调试使用同一个工具,接口调试完成后即可保证和接口文档定义完全一致。高效、及时、准确!

节省研发团队的每一分钟!

如果你认为 Apifox 只做了数据打通,来提升研发团队的效率,那就错了。Apifox 还做了非常多的创新,来提升开发人员的效率。

通常一个接口会有多种情况用例,比如 正确用例 参数错误用例 数据为空用例 不同数据状态用例。定义接口的时候定义好这些不同状态的用例,接口调试的时候直接运行,非常高效。

可以独立定义数据模型,接口定义时可以直接引用数据模型,数据模型之间也可以相互引用。同样的数据结构,只需要定义一次即可多处使用;修改的时候只需要修改一处,多处实时更新,避免不一致。

使用 Apifox 调试接口的时候,系统会根据接口文档里的定义,自动校验返回的数据结构是否正确,无需通过肉眼识别,也无需手动写断言脚本检测,非常高效!

Apifox 自动校验数据结构

设置断言:

Apifox 设置断言

运行后,查看断言结果:

先放一张图对比下 Apifox 和其他同类工具 零配置 mock 出来的数据效果:

Apifox Mock 数据结果对比同类工具

可以看出 Apifox 零配置 Mock 出来的数据和真实情况是非常接近的,前端开发可以直接使用,而无需再手动写 mock 规则。

「Apifox 如何做到高效率、零配置生成非常人性化的 mock 数据」

Apifox 项目可“在线分享” API 文档,分享出去的 API 文档可设置为公开或需要密码访问,非常方便与外部团队协作。

体验地址:https://www.apipark.cn/s/ce387612-cfdb-478a-b604-b96d1dbc511b/http/5041285

根据接口模型定义,自动生成各种语言/框架(如 TypeScript、Java、Go、Swift、ObjectiveC、Kotlin、Dart、C++、C#、Rust 等)的业务代码(如 Model、Controller、单元测试代码等)和接口请求代码。目前 Apifox 支持 130 种语言及框架的代码自动生成。

更重要的是:你可以通过自定义代码模板来生成符合自己团队的架构规范的代码,满足各种个性化的需求。

接口调试

Apifox 多种主题色可选

关于前端api接口文档模板和前端接口文档怎么用的介绍到此就结束了,不知道你从中找到你需要的信息了吗 ?如果你还想了解更多这方面的信息,记得收藏关注本站。 前端api接口文档模板的介绍就聊到这里吧,感谢你花时间阅读本站内容,更多关于前端接口文档怎么用、前端api接口文档模板的信息别忘了在本站进行查找喔。

版权声明:本文内容由网络用户投稿,版权归原作者所有,本站不拥有其著作权,亦不承担相应法律责任。如果您发现本站中有涉嫌抄袭或描述失实的内容,请联系我们jiasou666@gmail.com 处理,核实后本网站将在24小时内删除侵权内容。

上一篇:vue 动态修改a标签的样式的方法
下一篇:springboot整合ehcache 实现支付超时限制的方法
相关文章

 发表评论

暂时没有评论,来抢沙发吧~