Satori网页转 SVG 库

Satori 是由 Vercel 团队开源的使用 HTML 和 CSS 代码生成 SVG 图像的库，能够将 HTML 和 CSS 转换为 SVG、PNG、PDF 的在线工具，可以用来生成 Open Graph 图片。

Satori 支持 JSX 语法，下面是基本用法的概述：

// api.jsx
import satori from 'satori'

const svg = await satori(
  <div style={{ color: 'black' }}>hello, world</div>,
  {
    width: 600,
    height: 400,
    fonts: [
      {
        name: 'Roboto',
        // Use `fs` (Node.js only) or `fetch` to read the font as Buffer/ArrayBuffer and provide `data` here.
        data: robotoArrayBuffer,
        weight: 400,
        style: 'normal',
      },
    ],
  },
)

Satori 会将元素渲染成 600×400 的 SVG，并返回 SVG 字符串：

'<svg ...><path d="..." fill="black"></path></svg>'

在引擎盖下，它处理布局计算、字体、排版等，以生成与浏览器中完全相同的 HTML 和 CSS 匹配的 SVG。