面试官:前端如何防止接口重复提交?
前端如何防止接口重复提交?,这是一道非常高频的前端面试题,但是很多同学在面试时候都回答不完整,要么回答的不完整。老规矩,点赞收藏,点点关注支持一下,给我一分钟,理想哥教大家该怎么满分回答这个问题。
如果我是求职者,我会这么回答:
前端如何防止接口的重复提交?可以考虑以下几种方案:
第一,按钮禁用
可以在用户点击按钮后,立即对按钮增加disabled属性进行禁用,在接口请求结束后再去掉disabled属性重新启用按钮。
第二,加载loading
可以在用户点击按钮后,页面全局加载loading提示,这样可以阻止用户再次操作,也就自然可以实现接口重复提交
第三,接口锁定
我们可以在axios请求中进行统一封装,使用一个变量来记录当前正在处理的请求,在发送请求前,先检查是否正存在相同的请求,如果存在则不发送新的请求,如果不存在,再继续发送请求。
第四,唯一标识符。
前端每次请求前,都生成一个唯一标识符,比如UUID这种,并将该标识符作为请求的一部分发送到后端。后端接收到请求后,检查该标识符是否已经处理过,如果已经处理过则不再处理。
第五,防抖或节流
在用户点击提交按钮后,使用防抖或节流来延迟发送请求,确保一段时间内,用户只发送一次请求。
以上就是这个问题的回答了,大家可以下次面试时试试这么回答看看效果。
最后,欢迎关注理想哥,每天学点前端面试小技巧。
#每日一题挑战##前端##前端面试##前端面试必备宝典#