简单几步轻松保存各大网站的HTML源码-html教程-PHP中文网

应根据网页渲染方式选择保存方法：静态或ssr页面用curl可获原始html；含react/vue等动态内容则必须用puppeteer执行js后抓取完整dom。

简单几步轻松保存各大网站的html源码

不能靠浏览器“另存为”来可靠保存网页 HTML 源码——它常漏掉动态加载内容、内联样式/脚本，还可能混入浏览器自动生成的 DOM。

用 `curl` 直接抓取原始响应 HTML

适用于静态页面或服务端渲染（SSR）网站，能拿到服务器返回的真实 HTML，不含客户端 JS 渲染后的变动。

基础命令：curl -o page.html https://example.com
加 -L 跟随重定向（如跳转登录页）：curl -L -o page.html https://example.com
加 -H "User-Agent:..." 绕过部分反爬拦截（某些站拒收空 UA）
注意：不执行 JS，所以 document.write、fetch 后插入的内容不会出现在结果里

用 `puppeteer` 等工具获取 JS 渲染后完整 HTML

当页面依赖 React/Vue/AJAX 加载核心内容时，必须等 JS 执行完再提取 document.documentElement.outerHTML。

anything-to-html

将调研报告、方案对比、数据分析、需求梳理、会议纪要、设计说明、代码评审、学习笔记等任务产物输出为可在浏览器直接打开的单文件 HTML，替代 Markdown 作为最终交付物。Markdown 在信息密度、视觉清晰度和可分享性上已跟不上 AI 产物的丰富度，HTML 能同时承载排版、表格、SVG 等。

下载

Node.js 示例（需先 npm install puppeteer）：

const puppeteer = require('puppeteer');
(async () => {
  const browser = await puppeteer.launch();
  const page = await browser.newPage();
  await page.goto('https://example.com', { waitUntil: 'networkidle2' });
  await page.content().then(html => require('fs').writeFileSync('page.html', html));
  await browser.close();
})();

waitUntil: 'networkidle2' 比 domcontentloaded 更稳妥，等网络请求基本静默后再取 HTML
默认启用 headless，若遇到验证码或风控，可加 headless: false 手动观察行为

避免保存失败的三个关键点

很多人反复试了几次都得到空文件、403 或不完整 HTML，问题往往出在这几处：

没处理 Cookie 或登录态：目标页是登录后才展示的内容？curl 需手动带 -b cookies.txt；puppeteer 可先 page.goto(loginUrl) + page.type() 模拟登录
没禁用图片/CSS 加载（尤其 Puppeteer）：加 page.setRequestInterception(true) 并拦截非 HTML 资源，能显著提速并减少超时风险
没设超时：Puppeteer 默认 30 秒，复杂页面易超时，应显式设置：page.goto(url, { timeout: 60000 })

真实场景中，多数人卡在“以为页面是静态的，其实数据全靠 JS fetch”，结果用 curl 抓回来只有骨架。动手前先打开浏览器开发者工具的 Network 标签页，刷新看是否有关键 XHR/Fetch 请求——有，就必须上 Puppeteer 类方案。