HTML跨表单提交如何携带Token？身份鉴权方法-html教程-PHP中文网

Token应放在表单隐藏字段中，由后端模板渲染注入；前端不可自行读取localStorage或JS拼接，后端需从request.form（非header）获取并校验，微前端须由主应用统一管理Token生命周期。

html跨表单提交如何携带token？身份鉴权方法

HTML表单提交时Token该放哪？

浏览器原生

提交不带 Authorization 请求头，也不自动读 localStorage 或 cookie。所以你不能指望后端从 header 里取 Authorization: Bearer xxx —— 它根本不会发过去。

必须把 Token 塞进表单数据本身，最稳妥方式是加一个隐藏字段：

<input type="hidden" name="token" value="eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9...">

这个值必须由后端模板渲染时注入，比如 Flask 的 {{ user_token }}、Django 的 {{ csrf_token }}、或 PHP 的。前端 JS 拼接、localStorage 读取再写入 DOM，等于白做——绕过服务端签发逻辑，鉴权失效。

注意：别和 CSRF Token 混用同一个字段名。token 和 csrf_token 是两个东西，职责不同，存储位置和校验逻辑也不同。

后端怎么接收和校验这个表单Token？

表单 POST 过来的是 application/x-www-form-urlencoded 数据，不是 JSON，所以后端要从表单体里取，而不是从 header 或 JSON body。

Flask：request.form.get("token")
Spring MVC：@RequestParam("token") String token
PHP：$_POST["token"]

拿到值后，校验逻辑取决于 Token 类型：

如果是 JWT：jwt.decode() 验签名、有效期、aud/iss 等字段，不查数据库
如果是服务端生成的随机字符串（如 UUID）：redis.get("token:" + token) 查是否存在且未过期，查到就立刻 del（原子性销毁）
别用简单字符串比较（==），改用恒定时间比对函数，比如 Python 的 hmac.compare_digest()

常见错误：后端代码写成从 request.headers.get("Authorization") 取，结果永远拿不到值，直接判鉴权失败。

为什么 Ajax 提交表单总提示 Token 无效？

因为 fetch/XHR 不会自动提交表单里的 hidden 字段，你得手动取、手动塞。

Token Cost Estimator

从 OpenClaw 会话记录估算 API token 费用。分析所有代理会话，计算按 token 计费与订阅方案的花费差异。

下载

无序列表说明典型错法：

document.querySelector('input[name="token"]') 没取值，直接发空 body
fetch 发 JSON，但把 Token 塞在 HTML hidden 字段里，没读出来就发了 { "email": "a@b.c" }
后端期待 Token 在 form 字段，你却塞进 headers: { 'Authorization': 'Bearer xxx' }，它根本不去 header 里找
表单页面被 PWA 缓存，用户点“返回”再提交，用的是上一轮的旧 Token，而服务端已刷新或销毁

正确做法只有一条：先取 DOM 值，再决定放哪：

const token = document.querySelector('input[name="token"]').value;
fetch("/api/submit", {
  method: "POST",
  headers: { "Content-Type": "application/json" },
  body: JSON.stringify({ data: "xxx", token })
});