html页面是前端漏洞入口地图，需用开发者工具elements面板重点检查innerhtml赋值、动态src/href属性、富文本渲染三类高危点，手动注入验证是否漏转义。
HTML页面本身不执行逻辑，但它是所有前端漏洞的“入口地图”——XSS、Clickjacking、恶意跳转、富文本注入、CSP缺失等问题，全靠扫描HTML结构、标签行为和输出上下文才能暴露。直接看源码比等扫描器报告更准，也更快。
怎么用浏览器控制台快速查XSS风险点
别等工具跑完才动手。打开开发者工具的 Elements 面板，重点盯三类位置：
- 所有
innerHTML赋值的地方：比如el.innerHTML = userInput—— 这是高危信号，必须替换成textContent或服务端转义后输出 - 动态拼接的
src、href、data-属性：尤其是从 URL 参数或表单取值后直接塞进<img src="...">或<a href="..."></a> - 未过滤的富文本渲染：如
v-html（Vue）、dangerouslySetInnerHTML（React）—— 检查是否绕过了白名单过滤，或允许了<script></script>、onerror、javascript:等关键词
手动测试时，往输入框或URL里填 <img src="x" onerror="alert(1)">，然后在 Elements 里搜 onerror，看是否原样存在 DOM 中。存在即漏转义。
检查Clickjacking只需看两个响应头
HTML页面能否被嵌入恶意 iframe，不取决于你写了几个 <iframe></iframe>，而取决于服务器返回的 HTTP 响应头。打开 Network 面板，选任意 HTML 请求，看 Response Headers：
- 必须有
X-Frame-Options，且值为DENY或SAMEORIGIN；若缺失或为ALLOW-FROM（已废弃），就存在风险 - 更推荐用
Content-Security-Policy的frame-ancestors指令，例如frame-ancestors 'none'或frame-ancestors https://trusted.com；注意它优先级高于X-Frame-Options，但旧浏览器不支持
如果这两个头都缺，本地建个测试页：<iframe src="https://yoursite.com" sandbox></iframe>，加载成功说明可被劫持。
富文本编辑器输出前必须过白名单过滤
富文本不是“放行HTML”就行，而是要明确知道哪些标签、属性、URL协议能留，其余一律剥离。常见错误包括：
- 只过滤
<script></script>，却放行<svg onload="..."></svg>或<img src="data:text/html;base64,..."> - 允许
href，却不校验协议：用户输入javascript:alert(1)或vbscript:...就能触发 - 用正则替换代替 HTML 解析器：比如用
/on\w+=/gi去删事件，但攻击者写成ONCLICK（大小写混淆）或onclick（编码绕过）就能逃逸
正确做法是用成熟库（如 DOMPurify）做服务端净化，配置严格模式：DOMPurify.sanitize(dirtyHtml, { ALLOWED_TAGS: ['p', 'br', 'strong'], ALLOWED_ATTR: ['class'] })。前端仅作二次防护，不替代后端。
CSP策略不能只配script-src
一个只写了 script-src 'self' 的 CSP 几乎等于没设。真正起效的策略要覆盖全部资源类型，并堵死常见绕过路径：
-
default-src 'none'是最安全起点，再逐项放开；不要用default-src 'self'然后漏掉object-src，否则 Flash 或 PDF 插件可能被滥用 -
script-src必须禁用unsafe-inline和unsafe-eval；若需内联脚本，用nonce（每次响应生成唯一值）或sha256-xxx（计算脚本哈希） -
base-uri 'self'防止攻击者用<base href="http://evil.com">劫持所有相对路径请求 -
form-action 'self'阻止表单提交到外部域名，缓解 CSRF 和钓鱼
上线前务必先开 Content-Security-Policy-Report-Only 头收集违规日志，观察真实流量中哪些资源被误杀，再切到正式策略。直接上线容易导致功能崩溃。
HTML漏洞扫描的本质，是把页面当作一份“数据流说明书”来读：用户输入从哪来、经过什么处理、以什么方式插入到哪个 HTML 上下文中、最终由谁（浏览器）解析执行。漏掉任何一个环节的校验或转义，都可能成为突破口。最常被忽略的，是那些“看起来只是展示”的地方——比如搜索结果页回显关键词、评论区显示昵称、甚至404页面里拼接的请求路径。
前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
