前后端防重复提交

数据重复提交是一个大忌，会带来无效数据，应该在前端和后端都建议检测防范。
前端一般是按钮按下触发数据提交，如果用户鼠标操作习惯不好，或者鼠标或系统设置问题会导致鼠标连击，如果前端不做相关处理，可能会触发多次提交操作。
那么怎么处理为好呢？首先，按下按钮按下事件触发函数中，可以考虑禁用按钮，等待提交正常返回后，重置页面填报项信息，然后再启用按钮，如果是错误返回，那么提示错误信息，可以不重置页面填报，然后再启用按钮。

$("#button_submit").click(()=>{validate_input();$("#button_submit").attr("disabled",true); axios.post(ifurl,jsondata).then(res=> {if (res.data.code=="200") {alert("提交成功");reset_input();$("#button_submit").attr("disabled",false);}else { alert(res.data.msg); $("#button_submit").attr("disabled",false); }}).catch(err => { alert("后端服务器错，请稍后再提交"); $("#button_submit").attr("disabled",false); });});

当然后端也不能盲目信任前端，还是要采取措施防止前端重复提交无效数据。

...
var lastpost=[];
...
app.post("/postargs", express.json(), (req, res) => {let thispt=Date.now();let chktime=lastpost.find(item=>(item.uid=req.session.user.userid));if (chktime==undefined) { lastpost.push({uid:req.session.user.userid,lastpt:thispt}) }else {if (thispt<chktime.lastpt+500) return(res.json({"msg":"拒上次提交不到半秒，疑似误连击，暂不接收本次提交，有疑问请重新提交"}))else { chktime.lastpt=thispt; }}

例子中是拒绝半秒以内的相同用户的提交，可以根据具体场景调整策略，非登录情况，可以考虑进入页面时，向服务器申请获得一个短时间内有效的ReqID，提交时带上。