分享按钮点一次开始转圈,接口 500 之后一直不恢复,用户又点了五次,后台收到六条重复分享记录。日志里能对上时间点,这种反而好排。
请求的 finally 里只写了 console.log,没有把 loading 状态置回 false,按钮一直是禁用样式。失败后也没有防抖,重复点击照样发请求。这一点先确认清楚,后面就不用反复试。
btn.disabled = true;
fetch('/api/share', {method:'POST'}).finally(() => { btn.disabled = false; });
「分享按钮 loading 卡住」排查到最后往往是很小的一处差异,前面那些复杂猜测可以先放一放。线上出问题先对时间点,跟发布、备份、任务执行的时刻排一排,能省掉一半功夫。
日志级别临时调高可以,记得改回去,长期开着既占磁盘又掩盖真问题。权限不要一口气开到最大,先加到够用再往上试,范围小才好收。
处理上按这个顺序:把状态复位放进 finally 保证异常也会执行;请求期间给按钮加 disabled 属性 不要只改样式;失败后 1 秒内忽略重复点击 用时间戳判断。
结果对不对很好判断,接口返回 500 后按钮在 1 秒内恢复可点,后台只记录一次分享。
