经验总结之前后端联调(swagger)

2019-01-07  本文已影响17人  留白_汉服vs插画

前后端一起工作的时候,最常见的一个情况就是后端定义接口,前端调用接口。
但是在前端调用接口的时候,经常容易出现调不通的显现,现在总结一下经常出现的错误:

比如后端在swagger上定义了一个接口 接口使用

每一列有自己的含义;
1、相关页面的所有请求的汇总
2、get方法还是post方法
3、访问的地址是什么
4、扩展的描述,包括这是做什么的

打开第一个采购红冲调整:


接口详细说明

1、返回码,如果正常调用后端内容,返回200 OK
2、返回的一个实例。如果点Model,可以参看每个参数的具体数据类型。
3、前端给后端传递参数。
4、参数的描述
5、传递哪些是必须的,类型是application/json。点击一下这个小窗口,可以自动填充模拟数据,然后点击8,模拟前后端联调。非常方便的啦。
6、返回其他字段
7、给后端传递数据的一个实例,如果点击model,可以看每个字段的数据类型。
8、Try it out 可以模拟前后端联调,试一下。

前后端联调可能出现的问题:
1、get,post 方法使用错误。
2、地址使用错误
3、传给后端的参数缺少某个必填选项
4、传给后端的某个参数字段拼写错误
5、传给后端的某个参数字段赋值的格式不对。尤其是时间戳经常出现问题。
6、传递后端参数出现对象中包含对象的时候,注意结构是不是完全对应。要求完全对应。
7、有时候前端偷懒时候,直接把state传递给后端,这时候会有非常多的参数。前后端能正常工作,但是为了让传递参数更简洁,常常前端删掉某些不必要的参数。这时候尤其注意,直接delete this.state.XYZ ,可能会让前端不能正常工作,因为之前的某个地方使用了XYZ参数做逻辑运算。这时候可以通过复制state的参数给变量parameter,然后删掉parameter中的变量XYZ,再传递parameter给后端。另外注意复制的时候,不能是地址复制,可以通过parameter=[...state]复制。

上一篇下一篇

猜你喜欢

热点阅读