一个“收藏”操作添加了两条记录

描述

这周在做一个简单的电商项目,遇到了一个问题:用户在点击了商品收藏按钮后,数据库里添加了2条记录,它们除了主键Id外其他字段都相同。

实现情况

添加收藏这个功能的实现方式是这个样子的:后端有一个控制器来处理来自网页的异步POST请求,然后返回JSON来告知是否成功。数据库是一个简单的用户与商品的关系表。控制器中已经做了是否重复添加的判断。

分析与解决

首先,第一反应是检查控制器的判断条件是否写错了,结果是并没有。

之后,思考了一阵,查看了收藏操作的网络请求,结果发现这个点击事件发送了两次POST请求。这样就暂时算搞清楚了问题的原因,即并发问题。考虑到这个系统应该对并发的要求并不高,后端暂时不需要调整。那么,接下来这个问题就简化为了另一个问题——为什么一次点击事件触发了两次POST请求。

检查了js代码,这个事件绑定的方法没有写错。preventdefault,发起异步post请求,处理异步请求返回结果。

我对前端不太熟,请教了公司里的老司机。他说一般两个原因:

  1. 事件重复绑定。检查了一圈,并没有。

  2. 其实和1是相同的,只是表现不太一样,即绑定事件所在js外部文件被重复引入。由于项目不大,js文件都是在render页面中手工引入的。果然,该文件在layout模板和当前页面中各被引用一次,因此才出现了这个问题。

总结

  1. 排查bug和写代码也是一样的,大事化小,小事化无。无限可能的情况,按顺序排查,进而将问题转化为更小的问题。这和代码的抽象是同样的东西。

  2. 注意js文件的引入以及事件的绑定情况。

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容

  • Android 自定义View的各种姿势1 Activity的显示之ViewRootImpl详解 Activity...
    passiontim阅读 173,757评论 25 709
  • Spring Cloud为开发人员提供了快速构建分布式系统中一些常见模式的工具(例如配置管理,服务发现,断路器,智...
    卡卡罗2017阅读 135,026评论 19 139
  • 1.几种基本数据类型?复杂数据类型?值类型和引用数据类型?堆栈数据结构? 基本数据类型:Undefined、Nul...
    极乐君阅读 5,613评论 0 106
  • 今天无故为小事发脾气,去小店吃饭,由于自己点的黄焖鸡好了的时候,店主叫我没有听到,被别人先拿走了。顿时我就觉得不爽...
    风清扬Terry阅读 417评论 0 0
  • 抬头仰望,岁月静好 偶尔,我也会有这样的想法 若这世间没有人类的存在 这美妙的天空便不会有高楼横断 若这世间没有人...
    橙十四阅读 456评论 1 2