小编典典

将 HTML 渲染为图像

all

有没有办法将html呈现为像PNG这样的图像?我知道画布是可能的,但我想渲染标准的 html 元素,例如 div 。


阅读 115

收藏
2022-05-19

共1个答案

小编典典

有很多选择,它们都有自己的优点和缺点。

选项 1:使用 API

优点

  • 执行 Javascript
  • 近乎完美的渲染
  • 正确使用缓存选项时速度快
  • 规模由 API 处理
  • 精确的时间,视口,…
  • 大多数时候他们提供免费计划

缺点

  • 如果您打算大量使用它们,则不是免费的

选项 2:使用众多可用库之一

优点

  • 大多数时候转换速度很快

缺点

  • 渲染不良
  • 不执行 javascript
  • 不支持最近的 Web 功能(FlexBox、高级选择器、Webfonts、Box Sizing、媒体查询……)
  • 有时不那么容易安装
  • 规模复杂

选项 3:使用 PhantomJs 和包装库

优点

  • 执行 Javascript
  • 蛮快

缺点

  • 渲染不良
  • 不支持最近的 Web 功能(FlexBox、高级选择器、Webfonts、Box Sizing、媒体查询……)
  • 规模复杂
  • 如果要加载图像,要让它工作就不是那么容易了……

选项 4:使用 Chrome Headless 和包装库

优点

  • 执行 Javascript
  • 近乎完美的渲染

缺点

  • 获得关于以下方面的确切结果并不容易:
    • 页面加载时间
    • 视口尺寸
  • 规模复杂
  • 如果 html 包含外部链接,则相当慢甚至更慢

披露:我是 ApiFlash 的创始人。 我尽我所能提供一个诚实和有用的答案。

2022-05-19