通用要求

接口命名小驼峰
如果不是restfull的接口，需要语义化，例如：getUserInfo、getUserList、createUser、updateUser、deleteUser、uploadUserImg
接口尽量轻巧，前端不需要的数据，不需要返回
后端尽量统一风格，禁止单独适配
为了避免某些Chrome浏览器广告屏蔽插件的误拦截，不使用ad等广告字眼

对前端的要求：前端使用axios统一封装请求方法，做统一请求、拦截

安全性要求

如果是客户敏感信息，接口绝对需要返回最小量的数据
需要进行数据脱敏的情况，由后端进行脱敏，不能仅靠前端来脱敏展示
提交订单类接口，后端不能相信前端传入的金额数据，需要自己计算

接口的部署

接口统一部署在网关上，相关后端同学来维护发布

接口文档维护

统一维护在yapi平台上，禁止其余方式传输，一切以yapi平台为准；接口的变更，也需要同步在yapi平台上
接口文档，字段需要有必要的中文描述，以及枚举值

通用接口返回体

{"code":"200", // 状态码，200-正常；401-未登录，前端控制跳转登录界面"data":{ // 数据返回体},"message":"成功" // 提示信息，如果code不是200的话，前端将此提示信息弹窗展示
}

code枚举
200：正常
401：未登录，前端控制跳转登录界面
403：无权限，前端跳转相应界面

data 字段返回需要完整，禁止字段返回缺失
例如

data: {name: '', // 空字符串obj: null, // 空对象totol: 0, // 无值的数字list: [] // 空数组
}

message
如果code返回不是200，则前端弹窗提示message，需要简单醒目，不能抛出 Java的堆栈报错信息
如果code返回正确，message也尽量返回正确信息，用于前后端对比

前端通用组件要求

前端基于目前的业务，封装了一些公用列表、弹窗、交互、数据脱敏等一系列通用组件，需要后端的同一类接口，进行method、请求格式、返回格式的统一

例如：

获取列表的接口，post方式
通过id获取单个数据项的信息时，使用restfull的get格式，如 /person/123
添加类接口，post方式；更新类接口，put方式；删除类接口，delete方式

列表分页请求，通用参数

page：当前页码，以1开始
size：当前页面展示的条数，前端默认10

总之，不能出现分页信息，传入后端需要的start+limit的那种数据库查询的方式

列表返回的格式

需要返回 total 总条数，前端用于分页
不需要返回总页数之类的信息

{"code":"200", // 状态码"data":{"records":[ // 数据list],"total":20 // 总条数},"message":"成功" // 提示信息，如果code不是200的话，前端将此提示信息弹窗展示
}

日期格式传输

前后端传输时间字段，均以13位标准时间戳传输

布尔类数据

统一使用1、0来传输数据，1为true，0为false

超长型数字

后端库表的id，可能生成时超过16位，此时会面临精度丢失问题，这种情况，需要将id，通过字符串的形式传回到前端

数据精度处理

为了避免出现那种0.1+0.2=0.30000000000000004的问题，通常情况下，前端不做计算后结果的传输，一切计算后的数据，均由后端来计算
电商订单类，更应当如此！！！
后端返回前端数据，数据精度也需要过滤校验

图片地址的返回

需要返回全量的oss图片地址，禁止前端拿到url后再行拼接https

post方式请求细节

Content-Type的选择
除了上传类的post请求使用multipart/form-data外，其余的post请求，均使用application/json格式

post方式，尽量避免通过url上传值，统一放在body里面

模糊搜索接口约定

模糊搜索，要求速度快，数据量少

   请求方式：get接口返回：无需分页，最多返回10条数据

如无特殊规定，模糊搜索接口返回数组格式，格式如下

{"code":"200", // 状态码"data": [{value: 1label: '已创建'}, {value: 2label: '部分完成'}],"message":"成功" // 提示信息，如果code不是200的话，前端将此提示信息弹窗展示
}

后发先至接口的处理

有的时候，接口调用比较密集，而前端拿到返回需要有次序，此时需要后端在返回体内，添加前端开始调用接口的时间戳，用于前端来判断接口前后顺序

前端规范——前后端接口规范相关推荐

视频教程-VUE前端开发/前后端分离-Java
VUE前端开发/前后端分离 13年软件开发经验,设计开发30多个大型软件,涉及政府.银行.电信.能源等大型软件项目. 精通J2EE体系架构,熟练使用Struts.Spring.hibernate.ib ...
【前端44_前后端交互_跨域】前端解决：JSONP、后端解决：CORS 、后端代理
文章目录跨域什么是跨域前端解决: JSONP 实现原理步骤前端:创建标签,拼接传递参数后端:接收值,返回值封装 Ajax 代码在封装的 Ajax 中添加 JSONP 需求思路练习: ...
【前端】前后端交互重点Ajaxの介绍及实战
❤️Ajax❤️ 每篇前言: 第一部分:JSON简介效果展示: 第二部分:前后交互 1.此处介绍前后交互的两种方式: (1)利用form表单里的name属性进行前后端交互 HTML代码: Pytho ...
前端python和go_Python_前端网页+前后端交互-Go语言中文社区
学习Python_前端网页,以一个登录页为案例简单的 django.http.HttpResponse 可以把内容显示到网页上,本文主要记录如何使用渲染模板的方法来显示内容. HttpRespons ...
Python_前端网页+前后端交互
学习Python_前端网页,以一个登录页为案例简单的 django.http.HttpResponse 可以把内容显示到网页上,本文主要记录如何使用渲染模板的方法来显示内容. HttpRespons ...
mysql+java+springboot+前端实现前后端数据的交互的后台
目录后台配置一-五一. 新建模块二.添加依赖三.配置maven 四.在pom.xml添加如下五.配置文件 spring-Druid配置参数详解给一个接口类实现接口在控制器中接受返回值 ...
前端规范 - js开发规范
因为会牵扯到业务逻辑,在实际开发场景中,js开发会占绝大部分,相应的规范细节也比较多限于篇幅原因,加上有eslint的这个利器,本文只讲一些最最常用的规范 [强制] 开启eslint 开启了esli ...
前端规范 - 前端项目开发规范
0 前言好好做业务,提高自己的工程能力 [强制] 1 开启eslint 根据团队的习惯,制定适合自己的rules 比如 no-console no-debugger可以关闭 [强制] 2 新项目使用 ...
SpringBoot后台管理+Uniapp（混合APP）前端之酒店住宿+景点下单管理系统（SpringBoot前后端分离）
酒店住宿+景点下单管理系统(SpringBoot前后端分离) 之 SpringBoot后台管理+Uniapp(混合APP)前端 SpringBoot前后端分离项目-Thymeleaf模板引擎景区旅游管 ...
【两万字图文详解】运动会管理系统-前后端分离-项目开发：【后端】SpringBoot, SpringMVC, MyBatis【前端】Vue.js，ElementUI
项目名称:运动会管理系统技术栈: 后端:SpringBoot,SpringMVC,MyBatis,tkmapper,Maven聚合工程等前端:Vue.js,Element-u ...

前端规范——前后端接口规范