HTML表单防重复提交与唯一令牌生成实践
在Web开发中，表单重复提交是常见的问题，可能导致数据重复写入、业务逻辑错误甚至安全风险。最可靠的解决方案之一是使用令牌（Token）机制，核心是生成一个唯一的提交令牌，结合服务端校验实现防重复提交。
一、重复提交的常见场景
首先明确哪些情况会导致表单：
用户提交表单后，多次点击提交按钮
表单提交成功后，用户点击浏览器后退按钮，再次提交
网络延迟时，用户重复点击提交按钮等待响应
恶意用户通过脚本重复提交相同表单数据
二、令牌机制的核心原理
令牌机制的工作流程如下：
用户访问包含表单的页面时，服务端生成一个唯一、不可预测的令牌，同时将令牌存储到服务端的会话（Session）或缓存中
服务端将令牌通过隐藏字段的形式嵌入到HTML表单中
用户提交表单时，令牌会随表单数据一起发送到服务端
服务端接收到请求后，先校验令牌是否存在、是否有效：
如果令牌有效，处理表单逻辑，同时立即销毁该令牌，避免重复使用
如果令牌无效（不存在、已使用），直接返回错误提示，拒绝处理请求
三、唯一令牌的生成方式
生成令牌需要满足唯一性、不可预测性、时效性三个要求，以下是常见的生成方案：
1. 基础方案：UUID+时间戳
UUID（通用唯一识别码）本身具备极高的唯一性，结合当前时间戳可以进一步提升不可预测性，适合大多数中小型场景。
Java示例（生成令牌）：
import java.util.UUID;
import java.time.Instant;
public class TokenGenerator {
public static String generateToken() {
// 生成UUID，去除横线增强可读性
String uuid = UUID.randomUUID().toString().replace("-", "");
// 拼接当前时间戳（毫秒级）
long timestamp = Instant.now().toEpochMilli();
return uuid + "_" + timestamp;
}
}2. 高安全方案：哈希+随机数+会话标识
如果业务对安全性要求更高（比如支付、敏感信息提交），可以结合用户会话ID、随机数、固定盐值生成哈希令牌，避免令牌被猜测。
PHP示例（生成令牌）：
function generateSecureToken($sessionId) {
// 固定盐值，建议配置到环境变量中，不要硬编码
$salt = "form_submit_token_salt_2024";
// 生成16位随机数
$random = bin2hex(random_bytes(8));
// 拼接会话ID、随机数、盐值，计算SHA256哈希
$raw = $sessionId . $random . $salt . time();
return hash("sha256", $raw);
}四、完整实现示例
下面以Java + Servlet为例，展示从令牌生成、表单嵌入到服务端校验的完整流程。
1. 服务端生成令牌并存入Session
用户访问表单页面时，服务端生成令牌并存储到Session中：
import javax.servlet.ServletException;
import javax.servlet.annotation.WebServlet;
import javax.servlet.http.HttpServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;
import javax.servlet.http.HttpSession;
import java.io.IOException;
import java.util.UUID;
@WebServlet("/formPage")
public class FormPageServlet extends HttpServlet {
@Override
protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
// 生成唯一令牌
String token = UUID.randomUUID().toString().replace("-", "");
// 获取当前会话，没有则创建
HttpSession session = request.getSession(true);
// 将令牌存入Session，key为form_token
session.setAttribute("form_token", token); // 将令牌传递到前端
request.setAttribute("submitToken", token);
// 转发到表单页面
request.getRequestDispatcher("/form.jsp").forward(request, response);
}
}2. 前端表单嵌入令牌
在HTML表单中通过隐藏字段携带令牌，注意<input>标签需要转义为<input>：
<!DOCTYPE html>
<html lang="zh-CN">
<head>
<meta charset="UTF-8">
<title>表单提交页面</title>
</head>
<body>
<form action="/submitForm" method="post">
<!-- 隐藏字段携带令牌 -->
<input type="hidden" name="formToken" value="${submitToken}">
<label for="username">用户名：</label>
<input type="text" id="username" name="username" required>
<br><br>
<label for="email">邮箱：</label>
<input type="email" id="email" name="email" required>
<br><br>
<button type="submit" id="submitBtn">提交</button>
</form>
<script>
// 可选：点击提交按钮后禁用按钮，防止用户重复点击
document.getElementById("submitBtn").addEventListener("click", function() {
this.disabled = true;
this.innerText = "提交中...";
// 提交表单
this.form.submit();
});
</script>
</body>
</html>3. 服务端校验令牌并处理请求
表单提交后，服务端先校验令牌，再处理业务逻辑：
import javax.servlet.ServletException;
import javax.servlet.annotation.WebServlet;
import javax.servlet.http.HttpServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;
import javax.servlet.http.HttpSession;
import java.io.IOException;
@WebServlet("/submitForm")
public class SubmitFormServlet extends HttpServlet {
@Override
protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
request.setCharacterEncoding("UTF-8");
HttpSession session = request.getSession(false);
// 1. 校验Session是否存在
if (session == null) {
response.getWriter().write("会话已过期，请刷新页面重试");
return;
}
// 2. 从请求中获取令牌
String clientToken = request.getParameter("formToken");
// 3. 从Session中获取存储的令牌
String serverToken = (String) session.getAttribute("form_token");
// 4. 令牌校验逻辑
if (clientToken == null || serverToken == null || !clientToken.equals(serverToken)) {
response.getWriter().write("请勿重复提交表单或令牌无效");
return;
}
// 5. 令牌校验通过，立即销毁Session中的令牌，防止重复使用
session.removeAttribute("form_token");
// 6. 处理正常业务逻辑（比如保存用户数据）
String username = request.getParameter("username");
String email = request.getParameter("email");
// 模拟业务处理
System.out.println("接收到表单数据：用户名=" + username + "，邮箱=" + email);
// 7. 返回成功响应
response.getWriter().write("表单提交成功");
}
}五、补充优化方案
令牌机制之外，还可以结合以下方式增强防重复提交效果：
前端限制：提交按钮点击后禁用，或者通过JavaScript防止短时间内重复提交
令牌时效控制：给令牌设置过期时间（比如5分钟），过期后自动失效，避免Session中存储无效令牌
分布式场景适配：如果是分布式系统，不要将令牌存到单机Session，改为存到Redis等共享缓存中，设置过期时间，保证多服务实例都能校验令牌
幂等性设计：除了令牌校验，服务端业务接口本身也要做幂等性处理，比如根据唯一业务ID（如订单号）判断请求是否已处理
六、注意事项
令牌不要通过URL参数传递，避免被浏览器历史记录、日志泄露
令牌生成逻辑不要完全依赖前端，前端生成的令牌可以被篡改，必须由服务端生成
令牌校验通过后要立即销毁，不要等Session过期，避免窗口期内的重复提交
如果是前后端分离项目，令牌可以通过接口返回给前端，前端存储到本地（比如请求头中），提交时携带，校验逻辑和上述流程一致