html表单安全核心在于服务端强制校验，前端仅辅助；readonly无法防篡改，autocomplete="off"对密码无效，xss防护须用textcontent或dompurify，提交环节必须依赖csrf token、字段签名与服务端净化。
HTML表单控件本身不防注入，所有「安全输入」都靠组合策略：服务端强制校验是底线，前端只能辅助拦截普通用户误操作或提升体验。单独依赖 readonly、autocomplete="off" 或客户端 JS 验证，等于没设防。
为什么 readonly 不能防注入或篡改
readonly 只禁用键盘输入和删除，对粘贴、拖拽、JS 赋值（如 input.value = "xss"）、开发者工具修改完全无效。它不转义、不过滤、不阻止提交，字段值照常进入 FormData 和后端请求体。
- 生效类型仅限：
text、password、email、textarea等文本类；对select、checkbox、file无效 - 和
disabled混用时，字段会从提交数据中消失，导致后端收不到user_id或order_no等关键值 - 典型误用：把金额字段设为
readonly就认为“安全了”，结果攻击者一行控制台代码改完直接提交
怎样让密码类字段不被浏览器自动填充
现代浏览器（Chrome 80+、Edge 105+、Safari 15.4+）会忽略 autocomplete="off" 对 type="password" 的设置——不是你写错了，是浏览器主动跳过。真正起效的是语义化 + DOM 干扰组合。
Article To Html
下载
文章转信息图。将文章/笔记转化为手机可读的 HTML 信息图，自动匹配视觉风格。触发场景：文章转图、笔记转图、信息图、转小红书图、做张图、可视化这篇文章、文生图。
- 用语义化属性：
autocomplete="current-password"（登录页）、autocomplete="new-password"（注册/改密页）、autocomplete="one-time-code"（验证码） - 插入隐藏干扰字段：
<input type="password" name="fake_pwd" autocomplete="new-password" style="display:none;">，放在真实密码框之前 - 真实密码框初始设为
type="text"，在focus事件中再切回type="password"，避开页面加载时的自动填充扫描 - 服务端必须忽略
fake_pwd字段，不校验、不记录、不透传
用户输入渲染到页面时怎么防 XSS
只要把用户输入拼进 HTML，就可能触发 XSS。最简单可靠的方案是：能不用 innerHTML 就绝对不用，优先用 textContent。
-
textContent把内容当纯文本处理，哪怕输入是<script>alert(1)</script>，也只显示字符串本身 - 必须用
innerHTML时（如富文本、Markdown 渲染），必须调用DOMPurify.sanitize(dirty, {ALLOWED_TAGS: ['p', 'br', 'strong'], ALLOWED_ATTR: ['href']})，禁用黑名单模式 - 禁止对 URL 类属性（如
a[href]）放行javascript:、data:协议，只允许https?或/开头 - 服务端也要做转义：PHP 用
htmlspecialchars()，Python 用html.escape()，Node.js 用he.escape()
表单提交环节最关键的防护点
绕过前端一切限制只需一条 curl 命令。所以表单提交的安全重心必须落在服务端：CSRF token、输入净化、关键字段签名缺一不可。
- 每个表单必须嵌入一次性
csrf_token隐藏字段，服务端比对 session 中存储的值，过期时间建议 ≤15 分钟 - 敏感字段（如价格、数量、权限标识）应在生成表单时用 HMAC 签名，例如
hmac_sha256(price + user_id + secret_key)，后端收到后重新计算并校验 - 文件上传字段的
accept=".pdf"是纯 UI 提示，后端必须读取文件头判断真实 MIME 类型，并重命名 + 存非 Web 目录 - 所有字符串输入必须白名单过滤（如用户名只留
[a-zA-Z0-9_]），数字类必须强转类型（如intval()），不能依赖前端type="number"
最容易被忽略的是：服务端签名密钥硬编码、CSRF token 存 localStorage、富文本净化后又塞进 eval() 或 location.href——这些操作会让前面所有防护形同虚设。
前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
