前往小程序,Get更优阅读体验!
立即前往
首页
学习
活动
专区
工具
TVP
发布
社区首页 >专栏 >(防抖) 前后端防重复提交常用的那些方法

(防抖) 前后端防重复提交常用的那些方法

作者头像
友儿
发布2023-10-21 13:54:36
6680
发布2023-10-21 13:54:36
举报
文章被收录于专栏:友儿
防抖(Debounce)是一种防止重复提交的策略,它通过延迟一定时间来合并连续的操作,以确保只执行一次。
前端 JavaScript 实现
代码语言:javascript
复制
function debounce(func, delay) {
    let timer;
    return function() {
        clearTimeout(timer);
        timer = setTimeout(() => {
            func.apply(this, arguments);
        }, delay);
    };
}

const submitForm = debounce(function() {
    // 在这里执行表单提交操作
}, 1000); // 延迟 1 秒执行
代码语言:javascript
复制
<button id="submitBtn" onclick="submitForm()">Submit</button>

<script>
    let submitting = false;

    function submitForm() {
        if (!submitting) {
            submitting = true;
            // 执行表单提交操作
            document.getElementById('submitBtn').disabled = true;
        }
    }
</script>
防抖

Session Token防抖

代码语言:javascript
复制
// 生成随机的 token
$token = md5(uniqid());

// 存储 token 到会话
$_SESSION['submit_token'] = $token;

// 在表单中嵌入 token
echo '<input type="hidden" name="submit_token" value="' . $token . '">';

// 处理表单提交时的校验
if ($_POST['submit_token'] === $_SESSION['submit_token']) {
  // 处理表单提交
  // 清除会话中的 token
  unset($_SESSION['submit_token']);
}

Token防抖(利用随机生成的 token 来防止重复提交)

代码语言:javascript
复制
$token = md5(uniqid());
echo '<input type="hidden" name="submit_token" value="' . $token . '">';

if ($_POST['submit_token'] === $token) {
  // 处理表单提交
}

时间戳防抖

代码语言:javascript
复制
$currentTime = time();
$lastSubmitTime = $_SESSION['last_submit_time'] ?? 0;

if ($currentTime - $lastSubmitTime > 5) {
  // 处理表单提交
  $_SESSION['last_submit_time'] = $currentTime;
}

IP地址防抖 (利用IP地址来防止相同IP的重复提交)

代码语言:javascript
复制
$userIP = $_SERVER['REMOTE_ADDR'];
$lastSubmitIP = $_SESSION['last_submit_ip'] ?? '';

if ($userIP !== $lastSubmitIP) {
  // 处理表单提交
  $_SESSION['last_submit_ip'] = $userIP;
}

Cookie防抖 (利用Cookie来防止在一段时间内的重复提交)

代码语言:javascript
复制
if (!isset($_COOKIE['submit_cookie'])) {
  // 处理表单提交
  setcookie('submit_cookie', 'submitted', time() + 60); // 60秒内不允许重复提交
}

延时防抖(在最后一次操作后的一段时间内,只执行一次提交操作)

代码语言:javascript
复制
if (!isset($_SESSION['submit_timer'])) {
  $_SESSION['submit_timer'] = time();
}

if (time() - $_SESSION['submit_timer'] > 10) {
  // 处理表单提交
  $_SESSION['submit_timer'] = time();
}

数据库唯一性约束(利用数据库的唯一性约束来防止重复插入数据)

代码语言:javascript
复制
try {
  // 尝试插入数据,如果插入失败会抛出异常
  // 添加数据库的唯一性索引或唯一性约束以防止重复数据
} catch (Exception $e) {
  // 处理插入失败的情况
}

缓存防抖(利用缓存系统来记录提交状态)

代码语言:javascript
复制
$cacheKey = 'submit_status_' . $userIP;
if (!cache_get($cacheKey)) {
  // 处理表单提交
  cache_set($cacheKey, 'submitted', 60); // 60秒内不允许重复提交
}

验证码防抖(要求用户输入特定的验证码来提交表单,防止恶意重复提交)

代码语言:javascript
复制
if ($_POST['captcha'] === $_SESSION['captcha_code']) {
  // 处理表单提交
  // 清除验证码,以防止多次使用同一个验证码
  unset($_SESSION['captcha_code']);
}
本文参与 腾讯云自媒体同步曝光计划,分享自作者个人站点/博客。
如有侵权请联系 cloudcommunity@tencent.com 删除

本文分享自 作者个人站点/博客 前往查看

如有侵权,请联系 cloudcommunity@tencent.com 删除。

本文参与 腾讯云自媒体同步曝光计划  ,欢迎热爱写作的你一起参与!

评论
登录后参与评论
0 条评论
热度
最新
推荐阅读
目录
  • 防抖(Debounce)是一种防止重复提交的策略,它通过延迟一定时间来合并连续的操作,以确保只执行一次。
  • 前端 JavaScript 实现
  • 防抖
相关产品与服务
验证码
腾讯云新一代行为验证码(Captcha),基于十道安全栅栏, 为网页、App、小程序开发者打造立体、全面的人机验证。最大程度保护注册登录、活动秒杀、点赞发帖、数据保护等各大场景下业务安全的同时,提供更精细化的用户体验。
领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档