html中明文出现在或中的内容（如邮箱、电话、价格、商品id、api路径）最容易被爬虫提取；图片或canvas混淆效果有限，更可行的是敏感数据动态加载+后端鉴权+css伪元素拼接+unicode混淆+robots.txt与x-robots-tag配合。
HTML 中哪些内容最容易被爬虫提取？
爬虫本质上是解析 HTML 文本的程序，只要内容以明文形式出现在 或 <script></script> 中（包括内联 JSON、隐藏字段、注释），就极大概率被提取。比如邮箱、电话、价格、商品 ID、API 路径这些敏感字段，一旦写死在 HTML 里，用 curl 或 requests.get() 加个 BeautifulSoup 就能秒抓。
直接替换文本为图片或 Canvas 是否有效？
对简单规则爬虫有一定干扰，但实际效果有限：
- OCR 工具（如 Tesseract）可批量识别图片中的数字/字母，尤其字体规整时准确率很高
- Canvas 渲染后仍可通过
canvas.toDataURL()或截图 API 提取像素，再 OCR - 搜索引擎不索引图片文字，SEO 受损；屏幕阅读器也无法访问，损害可访问性
- 移动端缩放、高 DPI 屏幕下易模糊，影响体验
更可行的防护策略有哪些？
没有银弹，但组合使用可显著提高爬取成本：
anything-to-html
下载
将调研报告、方案对比、数据分析、需求梳理、会议纪要、设计说明、代码评审、学习笔记等任务产物输出为可在浏览器直接打开的单文件 HTML，替代 Markdown 作为最终交付物。Markdown 在信息密度、视觉清晰度和可分享性上已跟不上 AI 产物的丰富度，HTML 能同时承载排版、表格、SVG 等。
- 敏感数据（如手机号、订单号）**不在 HTML 源码中渲染**，改用 JS 动态请求（
fetch）+ 后端鉴权（如 JWT、session 校验），且接口返回前做频率/行为风控 - 关键字段用 CSS 伪元素（
::before/::after）拼接，但注意：这仅防基础正则提取，getComputedStyle()仍可读取，不能防真爬虫 - 对必须展示的文本（如价格），用 Unicode 同形字混淆（例如用全角数字
１２３替代123），但需测试字体支持和输入框粘贴兼容性 - 服务端启用
robots.txt禁止爬虫访问含敏感数据的路径，配合X-Robots-Tag: noindex响应头
JS 动态加载内容是否绝对安全？
不安全。现代爬虫（如 Puppeteer、Playwright、Selenium）能执行 JS 并等待 DOM 渲染完成，等效于真实浏览器。所以：
-
fetch请求的 URL 和参数若暴露在 JS 源码中，会被静态扫描工具（如grep -r "api/order"）直接发现 - 不要把密钥、token 写在前端代码里；API 接口必须校验 Referer、User-Agent、请求频率、设备指纹等维度
- 敏感操作（如导出、下载）建议用服务端生成临时 token + 一次性链接，而非前端拼接完整 URL
真正难绕过的是服务端逻辑层的防护——爬虫能拿到 HTML 和 JS，但拿不到你数据库查询条件、风控规则、用户会话上下文。把校验和过滤留在后端，才是关键防线。
前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
