踩坑日记---两位前端室友深夜一人给我一脚,竟是因为...

大家好,第一次做标题党,还望请求原谅哈!

可能会有点拖拉,如果你也碰到相似的问题可以直接翻到最后。


起源

事情起源是这样的,我们实训课要求分组,于是我和几个朋友组了个队,其中包括两位前端室友。

现在项目都是前后端分离了,哪怕大学的作业也是如此。所以我们之间的交互就是后端开发出接口,前端的同学负责拿数据并渲染到页面上。

刚刚开始,我作为后端的一员,简单开发出了一组和用户对象有关的增删改查接口,并自行通过IDEA的restful插件(类似postman的功能)测试通过后,确保crud方法都可使用,之后才挂到服务器运行上并告诉两位同学。


故事开始

其中一位同学使用的是vue-resource技术来调用接口并获取数据的,查询和增加方法都可以使用,而更新与删除方法因为时间原因还没有测试,所以到目前为止还没有什么问题出现。

而另外一位同学采用的是axios技术调用接口,刚刚开始查询方法还好,一到增加方法就开始报500的错误。这个状态码相信后端的朋友秒懂。这位同学在百度状态码500是什么原因时,我内心计算了上千次—“怎么会啊?明明测试时都是正常的,为啥服务器那边会有问题呢?

因为本着之前测试过了增加接口,可以插入成功,所以本人一直觉得是程序谎报了“错误”。应该是某一层面或者版本问题。

于是继续弄自己的事情了,到晚上回来时,发现两位室友还在弄。其中使用vue-resource技术的室友后面也换成axios测试了一遍,也是相同的错误。这个时候想着去找一下日志了。


问题

一查发现服务器日志报了一个SQLEXCEPTION异常,具体是插入的属性值为空,也就是说前端页面表单的数据没有传过来?!

先用个笨方法,在数据库中允许对应的属性为空(null)。后面测试时,前端没有500异常了,但是结果也很明显,就是无论怎么输入数据,保存到数据库的值都为空。

出大事,但也有个方向可以去找寻,就是白天时vue-resource和自测时用的IDEA插件都可以正常插入数据,但一到axios就不行了。那应该是它们传输数据时底层会有所差别。

后面查找资料,发现(原文:https://www.cnblogs.com/yiyi17/p/9409249.html

踩坑日记---两位前端室友深夜一人给我一脚,竟是因为...
axios会自动将传入的数据转换为json串,和后端如果不处理的话,默认是接受不到的(使用Springboot)。

于是我满带惭愧的打开代码,在对应的方法参数上加上了@RequestBody注解,并重新打包上传至服务器,最后问题解决。


小反思

这个过程中,因为刚刚开始测试过接口,在自认为没问题的情况下告诉室友。但是曝出500状态码时,还一致认为是前端调用问题。导致被这一个小错误从而影响了两位室友一整天的时间。

最后成功解决了这个错误,也在反思,以前自己敲代码时就没有加这个注解的习惯。没有规范,没有全方位考虑到各种情况。

不过这次经历对个人而言收获还是大的,遇到问题先不甩锅,解决问题才是根本,到这里,也谢谢两位室友的不杀之恩。

所以标题的内容并没有实际发生,谢谢您的观看哈????