API Platform

三步快速上手

注册 MCP 服务器并安装 Skills。然后只需让你的 AI 代理创建演示文稿 —— PowerPoint 即可自动生成。

立即开始
terminal
1# 1. 注册 MCP 服务器
2# Claude Code / Codex / Grok Build 用户:运行对应的一行命令
3npx --yes --package html2pptx-local-mcp@latest html2pptx-install-mcp claude
4npx --yes --package html2pptx-local-mcp@latest html2pptx-install-mcp codex
5# Grok Build
6npx --yes --package html2pptx-local-mcp@latest html2pptx-install-mcp grok
7
8# 2. 安装 Skills(只运行你所用工具对应的行)
9npx skills add https://html2pptx.app -a claude-code  # Claude Code
10npx skills add https://html2pptx.app -a codex        # Codex
11npx skills add https://html2pptx.app -a cursor       # Cursor
12npx skills add https://html2pptx.app -a windsurf     # Windsurf
13# Grok Build
14npx --yes --package html2pptx-local-mcp@latest html2pptx-install-skills grok
15
16# 3. 用自然语言下达指令
17# 「根据这份会议记录创建一个演示文稿」
18# -> 代理生成 HTML -> 转换为 PPTX

服务概览

html2pptx.app 是什么

html2pptx.app 将你的 HTML 和 CSS 转换为完全可编辑的 PowerPoint 文件 —— 而不是截图。文本保持可编辑,布局得以保留,Flexbox、Grid、渐变、阴影等 CSS 属性都会被忠实还原。最终得到的是可直接用于生产的演示文稿文件。

架构

html2pptx.app 采用分阶段流水线,通过关注点分离保证可靠性与可扩展性:

Client
Step 01
Client
你的应用、代理或脚本通过 REST API 发送 HTML/CSS。任何能够发起 HTTP 请求的语言或平台都可以使用。
API Gateway
Step 02
API Gateway
负责认证(Bearer / X-API-Key)、按套餐层级的速率限制、请求校验,以及最初的任务创建请求。
Durable Queue
Step 03
Durable Queue
任务元数据存储在 Convex 中,大体积请求负载存储在对象存储中,Cloud Tasks 可以调度处理,工作进程重启也不会丢失任务。
Private Worker
Step 04
Private Worker
私有渲染器加载已保存的任务,将你的 HTML/CSS 转换为完全可编辑的 PowerPoint 文件,并随处理进度更新持久化的任务状态。
PPTX Output
Step
PPTX Output
生成的 PowerPoint 文件会上传到云存储,并返回一个限时签名 URL 供下载。文件保留 24 小时。

三种集成渠道

REST API

用于创建 HTML 转 PPTX 导出任务和轮询状态的标准 HTTP 端点。最适合后端集成、内部工具和 SaaS 嵌入。支持任何语言 —— curl、JavaScript、Python、Go、Ruby 等。模板发布不属于 REST API 的能力范围。

Skills

为 Claude Code、Codex 等代理工具注册 html2pptx skill。代理可以诊断、改写并导出幻灯片安全的 HTML,打开本地编辑,并通过内置的远程 MCP 工作流发布 HTML 模板草稿。非常适合由代理管理完整流水线的 AI 工作流。

MCP (Model Context Protocol)

通过 MCP 协议将后端能力暴露给 AI 代理。使用 /mcp 的远程 HTTP 端点完成导出、文档、目录和模板发布工具;本地 stdio MCP 仅用于在 edit-slide 中打开本地 HTML。HTML 模板草稿必须在校验后通过远程 MCP 创建。

html2pptx.app 与其他方案的对比

项目html2pptx.app常见替代方案
转换方式完全可编辑的 PowerPoint 输出每页幻灯片为截图/位图
文本可编辑性完全可编辑的文本框扁平图片 —— 无法编辑文本
CSS 支持Flexbox、Grid、渐变、阴影、transform有限或不支持
SVG 处理转换为高质量 PNG 图片转换为 PNG
文件大小通常较小,取决于嵌入的图片较大(嵌入图片)
字体嵌入自动嵌入 Web 字体不支持

支持的 CSS 功能

类别支持的属性
布局display: flex, display: grid, position: absolute/relative, gap, align-items, justify-content
盒模型padding, margin, width, height, box-sizing, overflow: hidden
背景background-color, linear-gradient(), radial-gradient(), background-image (URL/base64)
边框border, border-radius(含逐角设置), border-color, border-width
阴影box-shadow(单个和多个), text-shadow
排版font-family, font-size, font-weight, color, text-align, line-height, letter-spacing
变换transform: rotate(), scale(), translate(), skew()
视觉opacity, visibility, z-index, object-fit

使用场景

  • 从实时数据源自动生成报告
  • 由代理根据文本提示创建演示文稿
  • 为周期性幻灯片集成内部工具
  • 在 SaaS 中嵌入导出功能(仪表盘转 PPTX)
  • 填充符合品牌规范的模板
  • 通过 AI 代理将会议记录转换为演示文稿

支持的功能

  • SVG 会被转换为高质量图片,保证输出可靠
  • 自动嵌入 Web 字体(Google Fonts、自定义字体)
  • 支持 Flexbox 和 CSS Grid 布局,并在 PowerPoint 中忠实还原
  • 渐变、阴影和 border-radius 在 PowerPoint 中忠实还原
  • 支持 Base64 与 URL 图片,并自动优化
  • 显式幻灯片画布,支持自定义 width/height/layout。1600x900px(13.333in x 7.5in)仍是默认示例
  • 支持多页幻灯片(每个 .slide 元素生成一页 PPTX 幻灯片)
  • 支持日文字体(Noto Sans JP、Yu Gothic、Meiryo)
  • 提供托管 Studio 和托管 Web 导出,可在浏览器中手动使用

快速开始

四步完成首次带认证的导出

REST API 是异步的:先创建任务,再轮询状态,任务完成后解码返回的 fileBase64。

1

注册账号

html2pptx.app 创建账号。Free Preview 可用于验证输出质量,Founder Beta 解锁 API 密钥以进行真实 API 调用。

2

获取 API 密钥

进入控制台并点击「Create API Key」。复制并妥善保存 —— 密钥只会显示一次。密钥以 sk_live_ 开头,应作为机密信息处理。

3

发送第一个请求

将 HTML 幻灯片内容 POST 到 /api/export/jobs,并在 Authorization 头中携带 API 密钥。API 返回 jobId,可用于跟踪导出进度。

4

下载 PPTX

轮询 GET /api/export/jobs/{jobId},直到 status 为 "completed"(通常 5-15 秒)。响应中包含 PPTX 文件的 downloadUrl。如需内联文件内容,请使用 responseFormat: "base64"。

代码示例

1curl -X POST https://html2pptx.app/api/export/jobs \
2  -H "Authorization: Bearer sk_live_xxxx" \
3  -H "Content-Type: application/json" \
4  -H "Idempotency-Key: my-unique-request-id-123" \
5  -d '{
6    "fileName": "quarterly-review.pptx",
7    "html": "<section class=\"slide\" style=\"width: 1600px;height: 900px;padding: 64px\"><h1>Hello</h1><p>Generated via API</p></section>",
8    "css": ".slide { font-family: Arial, sans-serif; background: #fff; }",
9    "autoEmbedFonts": false,
10    "responseFormat": "url",
11    "metadata": {
12      "channel": "api",
13      "source": "docs-quickstart"
14    }
15  }'
16
17# 响应 (200 OK):
18# {
19#   "jobId": "5d934729-a0db-4aa9-bc65-e7a3e7e52b32",
20#   "status": "queued",
21#   "createdAt": "2026-04-02T10:30:00Z",
22#   "fileName": "quarterly-review.pptx",
23#   "slideCount": 1
24# }
25# 响应头包含: x-request-id: req_abc123...
26
27# 轮询任务完成:
28curl -s https://html2pptx.app/api/export/jobs/5d934729-a0db-4aa9-bc65-e7a3e7e52b32 \
29  -H "Authorization: Bearer sk_live_xxxx"
30
31# 响应 (200 OK,completed 且 responseFormat 为 "url" 时):
32# {
33#   "jobId": "5d934729-a0db-4aa9-bc65-e7a3e7e52b32",
34#   "status": "completed",
35#   "createdAt": "2026-04-02T10:30:00Z",
36#   "completedAt": "2026-04-02T10:30:12Z",
37#   "fileName": "quarterly-review.pptx",
38#   "slideCount": 1,
39#   "mimeType": "application/vnd.openxmlformats-officedocument.presentationml.presentation",
40#   "downloadUrl": "https://storage.example.com/quarterly-review.pptx?token=..."
41# }

API 参考

连接信息

基础 URL: 基础 URL: https://html2pptx.app

Content-Type: 所有请求和响应体均使用 application/json。创建端点接受顶层的 html/css/fileName 字段以及可选的 width/height/layout 控制参数;没有嵌套的 payload 包装结构。

认证

所有商用 API 端点都需要认证。请在以下任一请求头中携带你的 API 密钥。密钥按环境(测试 vs 生产)区分作用域,并可在控制台中轮换。

AuthorizationBearer sk_live_xxxx推荐 —— 大多数 HTTP 客户端和库使用的标准 Bearer 令牌格式
X-API-Keysk_live_xxxx备用请求头,适用于 Authorization 被占用的环境(如 API 网关、代理服务器)

任务生命周期说明

  • POST /api/export/jobs 会立即返回 queued 状态的任务描述符,不会阻塞到 PPTX 生成完成。
  • 请使用公开的状态路由 GET /api/export/jobs/{jobId}。不要依赖内部负载中可能出现的任何上游 worker URL。
  • 已完成的 REST 响应目前包含 fileBase64 和 mimeType。解码 fileBase64 即可将 PPTX 写入磁盘或返回给浏览器。
  • 任务所有权绑定到创建该任务的 API 密钥或已认证的 MCP 主体。其他密钥无法读取同一个 jobId。
  • 幻灯片数量由服务端根据净化后的 .slide 根元素计算。限制判断会忽略客户端提供的数量。

速率限制

每个 REST API 响应都包含描述当前每分钟窗口、每日限额和每月公平使用状态的响应头。REST 调用按 API 密钥执行限制,远程 MCP 调用按已认证主体执行限制。

Header说明
x-request-id每个 API 响应中包含的唯一请求标识符。便于调试及联系支持时使用。
X-Plan-Id应用于该请求的有效套餐 ID。
X-RateLimit-Limit当前一分钟窗口内允许的最大请求数。
X-RateLimit-Remaining当前窗口内剩余的请求数。
Retry-After收到 429 响应后需等待的秒数。
X-Daily-Limit在设有每日导出上限的套餐上返回。
X-Daily-Remaining当前 UTC 日内剩余的任务数。
X-Monthly-Used当前 UTC 月内已受理的导出数。
X-Fair-Use-State每月公平使用状态,如 normal、review 或 upgrade_recommended。
POST/api/v1/import/pptx

导入 PPTX 转 HTML

将现有 .pptx 转换为可编辑的 HTML 幻灯片(导出的逆过程)。会解析主题颜色(包括深色幻灯片上的 clrMap/clrMapOvr 反转)、母版文本样式和字体族。同步接口 —— 在单个响应中返回 HTML。也可通过 POST /api/import/pptx 访问。

请求体

filefile

multipart/form-data:.pptx 文件(最大 25 MB)。与 pptxBase64 二选一。

pptxBase64string

application/json:base64 编码的 .pptx 内容(接受 data URL)。推荐 JSON-RPC / MCP 客户端使用。

fileNamestring

可选的原始文件名,用于标注。

默认值: presentation.pptx

错误代码

400文件缺失/无效、base64 无效或 OOXML 无效。
401缺少 API 密钥。请设置 Authorization: Bearer 或 X-API-Key 请求头。
403API 密钥未关联到具备 API 访问权限的套餐。
413PPTX 超过 25 MB 大小限制。
响应 (200 OK)
1{
2  "fileName": "deck.pptx",
3  "plan": "api_starter",
4  "slideCount": 13,
5  "slides": [{ "index": 1, "html": "<section class=\"slide\">...</section>" }],
6  "html": "<!doctype html>...",
7  "css": "...",
8  "warnings": []
9}
POST/api/export/jobs

创建导出任务

根据顶层 HTML/CSS 字段及可选的演示文稿尺寸控制参数创建新的 PPTX 导出任务。响应为 queued 状态的任务描述符;使用 GET /api/export/jobs/{jobId} 获取最终结果。

请求体

fileNamestring

生成 PPTX 的输出文件名。必须以 .pptx 扩展名结尾。

默认值: export.pptx

htmlstringRequired

包含一个或多个带 .slide 类元素的 HTML 内容。每个 .slide 生成一页 PPTX 幻灯片。必填。

cssstring

可选的 CSS,全局应用于提交的 HTML。

默认值: ""

autoEmbedFontsboolean

尝试检测字体并将其嵌入生成的 PPTX。

默认值: false

widthnumber

可选的 PPTX 幻灯片宽度(英寸)。与 height 搭配使用以自定义演示文稿尺寸。

heightnumber

可选的 PPTX 幻灯片高度(英寸)。与 width 搭配使用以自定义演示文稿尺寸。

layoutstring

可选的 PPTX 版式预设或自定义版式名称。常用预设:LAYOUT_16x9、LAYOUT_16x10、LAYOUT_4x3、LAYOUT_WIDE。

metadataobject

透传给 worker 的不透明元数据。便于在你这一侧做请求追踪。

默认值: {}

responseFormatstring

控制已完成 PPTX 文件的交付方式。"url" 返回预签名下载 URL(默认)。"base64" 以 base64 内联返回文件。"both" 同时返回两者。取代已弃用的 includeFileBase64 参数。

默认值: "url"

callbackUrlstring

用于在任务完成或失败时接收 webhook POST 的 HTTPS URL。worker 会将完整任务结果发送到该 URL,并附带 x-signature-sha256 HMAC 头用于验证。仅接受 https:// URL。

错误代码

400请求体无效 —— 缺少必填字段或 JSON 格式错误。
401API 密钥缺失或无效。请确保 Authorization 或 X-API-Key 头中携带有效的 sk_live_ 密钥。
403API 密钥没有该操作的权限。请检查套餐限制或密钥作用域。
413请求实体过大。请求体总大小超过了套餐限制或 worker 硬性上限。
422净化后的 HTML 解析出的幻灯片数量超过套餐允许的上限。
429超过速率限制、超过每日限额、触发每月公平使用审查,或超过并发任务限制。请检查 Retry-After 和用量响应头。
502网关错误 —— worker 后端暂时不可用。请稍后重试。
503服务不可用 —— 系统正在维护或负载过高。请使用指数退避重试。
响应 (200 OK)
1{
2  "jobId": "5d934729-a0db-4aa9-bc65-e7a3e7e52b32",
3  "status": "queued",
4  "createdAt": "2026-04-02T10: 30: 00Z",
5  "fileName": "quarterly-review.pptx",
6  "slideCount": 1
7}
GET/api/export/jobs/{jobId}

查询任务状态

获取导出任务的当前状态。轮询该端点直到 status 为 "completed" 或 "failed"。任务完成后,REST API 以 fileBase64 形式返回 PPTX。

路径参数

jobIdstringRequired

POST /api/export/jobs 端点返回的任务 ID。

状态值

queued

任务正在处理队列中等待。

processing

worker 正在将 HTML 转换为 PowerPoint。

completed

转换成功完成。fileBase64 和 mimeType 可用。

failed

转换失败。message 字段包含人类可读的描述。

错误代码

401API 密钥缺失或无效。
404任务未找到 —— jobId 无效,或任务属于其他 API 密钥。
429状态轮询超过速率限制。
响应 (200 OK)
1{
2  "jobId": "5d934729-a0db-4aa9-bc65-e7a3e7e52b32",
3  "status": "completed",
4  "createdAt": "2026-04-02T10: 30: 00Z",
5  "completedAt": "2026-04-02T10: 30: 12Z",
6  "fileName": "quarterly-review.pptx",
7  "slideCount": 3,
8  "mimeType": "application/vnd.openxmlformats-officedocument.presentationml.presentation",
9  "downloadUrl": "https://storage.example.com/quarterly-review.pptx?token=..."
10}
GET/api/export/plans

套餐列表

返回公开的套餐目录及推荐的默认套餐。无需认证。

响应 (200 OK)
1{
2  "recommendedPlanId": "founding_beta",
3  "plans": [
4    {
5      "id": "free_web",
6      "name": "Free Preview",
7      "includes": { "api": true, "skills": true, "mcp": true },
8      "limits": {
9        "requestsPerMinute": 3,
10        "dailyRequestLimit": 10,
11        "monthlyRequestLimit": 10,
12        "monthlyReviewThreshold": 0,
13        "monthlyUpgradePromptThreshold": 0,
14        "maxSlidesPerJob": 20,
15        "concurrentJobs": 1,
16        "apiKeys": 1,
17        "maxPayloadBytes": 1048576
18      }
19    }
20  ],
21  "note": "Free Preview is generous for personal use. Paid tiers unlock commercial operation, team sharing, automation throughput, and support."
22}
GET/api/openapi.json

OpenAPI 规范

返回 html2pptx.app API 的 OpenAPI 3.x 规范。可用于生成客户端 SDK、导入 Postman 或浏览 API 模式。

响应 (200 OK)
1// 返回完整的 OpenAPI 3.x JSON 文档

HTML 契约

为保证可靠转换,你发送的 HTML 必须遵循以下规则。

  • 每页幻灯片必须带有 .slide 类 —— 这是幻灯片分割的边界标记
  • 每个 .slide 必须有显式尺寸。1600px x 900px(16:9 比例,13.333in x 7.5in)是默认示例,API/MCP 调用方也可以设置 width、height 或 layout 实现竖版/自定义输出
  • 支持的 CSS:flexbox、grid、linear-gradient、radial-gradient、box-shadow、text-shadow、border-radius、transform(rotate、scale、translate、skew)、opacity
  • 字体:系统字体(Arial、Helvetica、Noto Sans JP)默认可用。Google Fonts 或自定义 @font-face 声明需启用 autoEmbedFonts
  • 图片:支持 base64 data URI 和绝对 URL。相对路径会失败 —— 请始终使用绝对 URL
  • SVG:支持内联 SVG 元素,会被转换为高质量 PNG 图片
  • 避免使用:script 标签、iframe、canvas 元素、a 标签、表单元素、SVG 外部引用、CSS 动画、@keyframes 以及依赖运行时状态的内容
  • 嵌套:嵌套过深的元素(超过 10 层)可能影响输出质量。尽量保持 HTML 结构扁平
  • 文本换行:文本框默认不换行,以防止 PPTX 中出现意外断行。如需在容器内换行(如长段落),请为该元素添加 white-space: normal

错误响应格式

所有错误响应均遵循 RFC 9457 Problem Details 格式,并附带用于向后兼容的传统字段:

1{
2  "type": "https://html2pptx.app/errors/slides-limit-exceeded",
3  "status": 422,
4  "title": "Slides limit exceeded",
5  "detail": "Plan Starter supports up to 200 slides per job. You submitted 260 slides.",
6  "instance": "/api/export/jobs",
7  "error": "slides_limit_exceeded",
8  "message": "Plan Starter supports up to 200 slides per job.",
9  "slideCount": 260
10}

支持的 HTML 元素

每个 HTML 元素都会被转换为最合适的 PowerPoint 对象,以获得最大的可编辑性。

HTML 元素PPTX 输出备注
div, section, article带填充的形状背景色、渐变、边框和圆角都会保留。
p, h1-h6, span, b, em, strong, i, small文本框文本在 PowerPoint 中完全可编辑。字号、字重、样式、颜色、对齐和行高都会被转换。内联元素(span、b、em 等)会成为同一文本框内带样式的文本段。
img图片支持绝对 URL 和 base64 data URI。CSS object-fit(contain、cover、fill、scale-down)和 object-position 会被遵循。圆角通过裁剪实现。
table, tr, td, th原生 PPTX 表格完整的表格支持,包括单元格级文本样式、背景填充、边框(实线/虚线/点线)、内边距、文本对齐及 colspan/rowspan。
ul, ol, li项目符号 / 编号列表简单列表会成为可编辑的项目符号或编号列表。复杂列表(内含图片或 flex/grid)将作为图片转换。
svg图片 (PNG)SVG 会被转换为高质量 PNG 图片。
canvas图片 (PNG)Canvas 内容会作为 PNG 图片嵌入。
图标元素(FontAwesome、Material Icons 等)图片图标字体会被自动检测并转换为图片。

禁止的元素

出于安全性和兼容性考虑,以下元素会在输入净化阶段被移除:

script, iframe, object, embed

安全:移除活动内容

link, meta, base

安全:移除外部引用

form

PPTX 不支持交互元素

style

请改用内联样式或 css 参数

a

出于安全考虑移除锚点标签

foreignobject, image (SVG), feimage, use

移除 SVG 外部引用

animate, animateMotion, animateTransform, set, discard, mpath

不支持 SVG 动画

Skills 集成

Skills 是什么

Skills 是为 AI 编码代理打包的能力扩展,提供领域知识与工作流。html2pptx.app skill 教会你的代理如何编写幻灯片安全的 HTML,按 PPTX 转换契约进行校验,按需打开本地可视化编辑器,通过远程或本地 MCP 工作流导出,并通过内置的远程 MCP 发布工作流发布 HTML 模板草稿。安装一次后,代理即可将自然语言指令转换为可直接投产的 PowerPoint 文件或创作者持有的 HTML 草稿。

工作原理

该 skill 打包了四项核心能力:(1) HTML 编写知识 —— 编写能干净转换为可编辑 PowerPoint 的 HTML/CSS 规则;(2) 基于 MCP 的导出自动化 —— 连接远程 html2pptx.app MCP 服务器或本地 stdio MCP 服务器来创建任务、轮询状态并获取结果;(3) 本地可视化编辑 —— 当用户希望在导出前检查或微调 HTML 时,通过 localhost 桥接打开 edit-slide;(4) 模板发布 —— 要求 HTML 草稿走远程 MCP 的校验/发布闭环。由于添加本地 MCP 服务器会更改用户的 MCP 配置,代理应先征求同意。

claude-codegrok-buildcodexcursorvscodeantigravity

兼容 18+ 款 AI 代理,包括 Claude Code、Codex、Cursor、VS Code (GitHub Copilot)、Grok Build、Antigravity 等。Claude Code、Codex 和 Cursor 使用 skills CLI 命令。Grok Build 使用下方所示的 Grok 专用 skills 安装器。

工作流

  1. 1代理收到用户请求(例如「根据这份会议记录创建一套幻灯片」)
  2. 2代理读取 skill 定义,理解 html2pptx.app 的 HTML 契约
  3. 3代理生成带 .slide 类元素和显式尺寸的幻灯片安全 HTML。1600x900 是默认示例
  4. 4代理按转换契约校验标记
  5. 5如需可视化审查,代理通过 CLI 或本地 stdio MCP 打开本地 edit-slide 编辑器,然后从磁盘重新读取编辑后的 HTML
  6. 6代理连接远程 MCP 或本地 stdio MCP,并调用 html2pptx_create_export_job
  7. 7代理使用 html2pptx_wait_for_export_job 轮询直到完成
  8. 8如果用户想创建 HTML 模板草稿,代理会使用 html2pptx skill 和远程 MCP:从 HTML 推断标题/标签,执行 AI 安全预检,校验并修复错误,保存草稿,然后返回 draftUrl 供控制台审核
  9. 9代理向用户返回完成的任务摘要

本地可视化编辑器

edit-slide skill 让代理可以在 PowerPoint 风格的可视化编辑器中打开本地 HTML 幻灯片,编辑器由可用的回环地址(如 http://localhost:<port>)提供服务。托管版 edit-slide 不允许用于本地文件编辑。本地开发脚本会选择一个空闲端口,并将其注册到当前项目的 .html2pptx/edit-slide/editor-server.json。幻灯片文件始终保留在用户机器上,通过由 CLI 或本地 stdio MCP 工具启动的 localhost 桥接进行读写。如果尚未配置本地 MCP 服务器,代理应说明这将更改 MCP 设置,并在添加前征求用户同意。

local editor
1# 在包含幻灯片 HTML 的项目中运行
2node scripts/dev-studio.mjs
3npx --yes https://html2pptx.app/downloads/html2pptx-cli-0.4.0.tgz edit ./html2pptx/slides.html
4
5# 如果可从 npm 获取 html2pptx-cli@0.4.0+
6npx --yes html2pptx-cli edit ./html2pptx/slides.html
7
8# 如果已全局安装 CLI
9html2pptx edit ./html2pptx/slides.html
10
11# 仅打印 URL 而不打开浏览器
12html2pptx edit ./html2pptx/slides.html --no-open

本地编辑器流程的工作原理

1. 选择远程或本地 MCP

常规 PPTX 导出及目录/文档工具使用远程 MCP。仅当代理需要通过 edit-slide 打开或编辑本地 `.html` / `.htm` 文件时使用本地 stdio MCP。如果缺少本地 MCP,安装前先征求用户同意。

2. 启动桥接

`html2pptx edit <file>` 或 `html2pptx_open_local_slide_editor` 会在 `127.0.0.1` 上启动一个小型 HTTP 服务器。未指定端口时由操作系统分配空闲端口。访问范围限定在当前工作目录内。

3. 打开编辑器

该命令会打开 `http://localhost:<editor-port>/edit-slide?file=...&bridge=http://127.0.0.1:<bridge-port>#bridgeToken=...`。一次性令牌保存在 URL 片段中,编辑器启动后会将其从地址栏移除。

4. 加载本地文件

浏览器编辑器出示令牌,并从 localhost 桥接获取所选的 `.html` 或 `.htm` 文件。不会创建任何市场草稿或公开页面。

5. 可视化编辑

用户可以点击幻灯片元素,在右侧面板调整文本、排版、颜色、尺寸、内边距、外边距、圆角、边框、不透明度等属性。

6. 保存到磁盘

编辑内容通过桥接以乐观文件哈希的方式序列化回同一个 HTML 文件。不会创建版本历史、备份或审计日志。

7. 与代理继续协作

手动编辑后,代理应从磁盘重新读取 HTML 文件。如果用户需要 PowerPoint 输出,请作为单独的代理任务使用 html2pptx skills 处理。

隐私与文件访问模型

  • 桥接仅绑定 `127.0.0.1`。其他用户无法从网络打开本地桥接。
  • 每次桥接运行都会生成会话级令牌,编辑器必须出示该令牌才能进行本地读写。可见 URL 会在启动后被脱敏。
  • 幻灯片预览使用 no-referrer 处理,外部图片或字体不会收到带令牌的编辑器 URL。
  • 仅接受当前工作目录下的 `.html` 和 `.htm` 文件。
  • `app/`、`components/`、`lib/`、`.git/`、`.next/`、`node_modules/` 等敏感项目目录会被屏蔽。
  • 可视化编辑不会发布或上传幻灯片。Export PPTX 按钮只会显示提示,告知用户让 Claude Code 或其他代理使用 html2pptx skills 输出 PowerPoint。
  • 添加本地 stdio MCP 服务器是对用户代理环境的配置变更。Skills 和代理不应静默添加;应先询问,确认后再继续。
  • 编辑器状态保存在项目本地的 `.html2pptx/edit-slide/` 下。不会创建版本历史、备份或审计日志。

常见问题

找不到命令

先启动 `node scripts/dev-studio.mjs`,然后使用 `npx --yes https://html2pptx.app/downloads/html2pptx-cli-0.4.0.tgz edit ./path/to/slides.html`,或全局安装 `html2pptx-cli@0.4.0+`。

`npx` 不可用

使用已配置好的本地 stdio MCP 工具 `html2pptx_open_local_slide_editor`,或在添加本地 MCP 前先征求同意。若本地 MCP 不可用,请先安装/提供 npm 或全局 `html2pptx` CLI。

编辑器打开了但幻灯片未加载

确认路径是相对于运行命令的目录,且文件扩展名为 `.html` 或 `.htm`。

更改没有保存

保持终端运行。关闭 `html2pptx edit` 进程会停止 localhost 桥接。

代理想要添加本地 MCP

请先与用户确认。本地 MCP 是可选的,仅在由 MCP 驱动的本地 edit-slide 会话中需要;远程 MCP 无需访问本地文件也能导出 PPTX。

另一个标签页是只读的

编辑器使用本地标签页锁,避免两个标签页写入同一文件。请使用活动标签页,或点击转移编辑权控件。

设置

选择你实际使用的代理并运行对应命令。skills CLI 支持 Claude Code、Codex、Cursor、VS Code (GitHub Copilot) 和 Antigravity;Grok Build 使用自己的安装器。标签列表与下方 MCP 设置标签一致,同一代理在两个部分中出现在相同位置。

Claude Code

安装 html2pptx skill

通过 skills CLI 将已发布的 html2pptx skills 注册到 Claude Code。

terminal
1npx skills add https://html2pptx.app -a claude-code

不安装直接预览

在确认安装前,先列出 CLI 将要添加的 skills。

terminal
1npx skills add https://html2pptx.app --list

Tip: 优先使用按代理指定的标志,而不是 `--yes`。`--yes` 会一次性安装到所有检测到的代理目录。

可用的 Skills

html-to-pptx-slide-authoring

创建、诊断和修复幻灯片用 HTML/CSS。预先检查 HTML 能否正确转换为 PPTX,发现问题时自动改写。

  • HTML 诊断(safe / needs-rewrite / out-of-scope)
  • 自动改写标记
  • 生成全新幻灯片 HTML
  • 输入校验
pptx-studio-export-automation

创建 API 任务、管理状态、处理错误。包括 REST API / MCP 的选型判断。

  • 创建导出任务
  • 轮询并等待完成
  • 错误分析与重试
  • 套餐限制预检
edit-slide

在 localhost 上的可视化编辑器中打开本地 HTML 幻灯片,并通过 localhost 桥接保存回同一文件。

  • html2pptx edit <file>
  • 在 PowerPoint 风格 UI 中可视化编辑
  • 自动保存到本地 HTML
  • 变更检测与冲突防护

Skill 能力

诊断 HTML

在尝试导出前将标记分类为 safe、needs-rewrite 或 out-of-scope。可发现缺少 .slide 元素、不支持的 CSS 或动态内容等问题。

改写标记

将面向网页的 HTML(响应式布局、百分比尺寸、滚动容器)转换为适合 PPTX 转换的固定尺寸 .slide 结构。

生成幻灯片

根据文本提示、主题大纲或数据负载从零创建幻灯片安全的 HTML。应用视觉层级与可读性的最佳实践。

校验输出

在调用 API 之前,按 html2pptx.app 的 HTML 契约对生成的 HTML 做预检,避免无效输入浪费导出配额。

发布模板

对于市场 HTML 草稿,html2pptx skill 包含 AI 安全预检、远程 MCP 校验和草稿创建。Web、CLI、本地 MCP 和通用 REST 流程不会创建模板草稿。

MCP 集成

安装

Claude Code 用户运行这一行即可(远程导出 + 本地 edit-slide)

npx --yes --package html2pptx-local-mcp@latest html2pptx-install-mcp claude

Codex 用户运行这一行即可(远程导出 + 本地 edit-slide)

npx --yes --package html2pptx-local-mcp@latest html2pptx-install-mcp codex

Grok Build 用户运行这一行即可(远程导出 + 本地 edit-slide)

npx --yes --package html2pptx-local-mcp@latest html2pptx-install-mcp grok

MCP 是什么

MCP (Model Context Protocol) 是一个开放协议,通过标准化的工具接口将后端能力暴露给 AI 代理。html2pptx.app 支持两个 MCP 入口:位于 /mcp 的远程 HTTP MCP 端点,覆盖导出、用量、文档、模板、目录和 HTML 模板发布工作流;以及本地 stdio MCP 服务器,提供导出工具和通过 localhost 桥接的本地 edit-slide 会话。当代理需要将 HTML 转换为 PPTX 或创建 HTML 模板草稿时使用远程 MCP;仅当代理必须在用户机器上打开、预览或编辑本地 HTML 文件时才使用本地 stdio MCP,本地 MCP 不能发布模板。

安装与设置

Claude Code、Codex 和 Grok Build 用户运行一条命令即可同时注册远程导出工具和本地 edit-slide。远程 MCP 跟随托管服务;本地 MCP 使用 html2pptx-local-mcp@latest,后续启动会自动使用最新发布的包。

Claude Code

Claude Code 用户:运行这一行

此命令会将远程导出注册为 `html2pptx`,然后将本地 edit-slide 以 `html2pptx-local` 的名称直接写入 Claude Code 用户配置。

terminal
1npx --yes --package html2pptx-local-mcp@latest html2pptx-install-mcp claude

手动配置远程

如果只需要托管导出工具,可直接添加远程 MCP 服务器。

terminal
1claude mcp add --scope user --transport http html2pptx https://html2pptx.app/mcp

兼容的本地 edit-slide 设置

如果 Claude Code 的 stdio 注册不稳定,请使用安装器,它会直接写入本地服务器条目。

terminal
1npx --yes --package html2pptx-local-mcp@latest html2pptx-install-mcp claude

Tip: 安装器会以 user 作用域注册远程 MCP,并将本地 stdio MCP 直接写入 Claude Code 用户配置以获得更好的兼容性。

认证

MCP 服务器支持两种认证方式。请选择最适合你使用场景的一种。API 密钥适用于导出、文档、用量和目录工具,但 html2pptx_publish_template 需要绑定 WorkOS 的用户令牌,因为模板草稿需要创作者身份。

API 密钥(推荐)

使用控制台生成的 API 密钥。API 密钥不会过期(除非你设置了过期时间),因此无需重新认证。这是常规导出/文档/目录 MCP 使用的推荐方式。它不能创建创作者持有的模板草稿。

在控制台生成 API 密钥,然后以 Bearer 令牌形式传入。添加服务器时,大多数 MCP 客户端会自动处理。

  • 令牌不过期 —— 稳定、长期有效的会话
  • 设置简单 —— 粘贴密钥即可
  • 最适合日常使用与自动化

OAuth(浏览器登录)

通过 WorkOS AuthKit 使用 Google 或邮箱账号登录。访问令牌有效期为 24 小时,之后需要重新认证。html2pptx_publish_template 需要这种与身份绑定的方式。

添加 MCP 服务器时,浏览器会自动打开登录页面。登录以完成授权。

  • 无需管理 API 密钥
  • 适合快速试用和评估

OAuth 会话在 24 小时不活动后过期。如需不间断访问,建议改用 API 密钥。

可用的 MCP 工具

工具说明
html2pptx_list_export_plans列出当前商用套餐目录及推荐套餐。
html2pptx_create_export_job根据 HTML/CSS 内容创建导出任务。支持可选的 width、height、layout、waitForCompletion、timeoutMs 和 responseFormat("url" | "base64" | "both")。
html2pptx_import_pptx导出的逆过程:将现有 .pptx 转换为可编辑的 HTML 幻灯片。以 pptxBase64 传入文件(远程 MCP 可用);本地 stdio MCP 还接受 filePath。会解析主题颜色、母版文本样式和字体。
html2pptx_get_export_job按 jobId 获取导出任务的当前状态。
html2pptx_wait_for_export_job轮询直到任务完成或失败。重试和退避在工具内部处理。
html2pptx_get_docs获取 html2pptx.app 文档,了解 API 契约、HTML 要求和集成指南。
html2pptx_get_usage获取当前套餐的用量与配额状态。显示每周导出数、剩余配额、套餐限制和重置时间。
html2pptx_list_templates列出可用的市场模板,包含元数据和可选的分类筛选。
html2pptx_get_template_html获取模板的源 HTML 和设计提示词,便于代理研究或二次创作。
html2pptx_validate_template_html在 AI 安全预检后对市场 HTML 进行试运行校验。创建 HTML 模板草稿前必须执行。
html2pptx_publish_template上传校验通过的 HTML,推断缺失的标题/描述/分类/标签,默认创建创作者持有的 HTML 草稿。工具返回 draftUrl;用户在控制台中审核并按下最终发布按钮。
html2pptx_open_local_slide_editor仅限本地 stdio MCP。为本地 .html/.htm 幻灯片文件启动现有的 CLI localhost 桥接,并在不发布 HTML 的情况下打开无代码编辑器。远程 /mcp 不提供此工具,因为远程服务器无法访问用户文件。
html2pptx_stop_local_slide_editor仅限本地 stdio MCP。停止由 html2pptx_open_local_slide_editor 启动的本地编辑器桥接会话。

MCP 资源(文档)

MCP 服务器以 Resources 形式提供文档。代理可在创建导出任务前阅读这些资源,理解 API 契约和 HTML 要求。

URI资源说明
docs://html2pptx/overview服务概览架构、CSS 支持、与替代方案的对比
docs://html2pptx/quickstart快速开始四步完成第一次 API 调用
docs://html2pptx/api-referenceAPI 参考端点、认证、错误代码
docs://html2pptx/html-contractHTML 契约HTML 结构要求与支持的 CSS
docs://html2pptx/skillsSkills 集成面向 AI 代理的 skill 定义
docs://html2pptx/mcpMCP 集成MCP 服务器的设置与使用

llms.txt(面向 AI 优化的文档)

html2pptx.app 支持 llms.txt 标准。结构化的 Markdown 文档专为 AI 代理和 LLM 高效理解服务而优化。

https://html2pptx.app/llms.txt

精简索引(约 100 行)—— 服务概览、API 规范、支持的 CSS

https://html2pptx.app/llms-full.txt

完整文档(约 900 行)—— 所有章节的完整 Markdown

使用示例

1# 在 Claude Desktop 中通过 html2pptx.app MCP 的对话示例:
2
3User: 「创建一份关于我们 2026 年 Q1 业绩的演示文稿。」
4
5Claude (通过 MCP):
61. 调用 html2pptx_list_export_plans 查看可用套餐
72. 根据会话上下文生成幻灯片 HTML
83. 携带 HTML 负载调用 html2pptx_create_export_job
94. 调用 html2pptx_wait_for_export_job 轮询直到完成
105. 返回生成的 PPTX 负载或后续指引
11
12# 在幕后,MCP 工具会处理:
13# - 使用你配置的 API 密钥进行认证
14# - 正确的 HTML 契约格式(.slide 类、显式幻灯片尺寸)
15# - 带指数退避的状态轮询
16# - 错误处理与重试逻辑

CLI 工具

安装

全局安装

npm install -g html2pptx-cli

或通过 npx 直接运行

npx html2pptx-cli convert slides.html

CLI 是什么

html2pptx CLI 让你直接在终端将 HTML 文件转换为 PowerPoint,在 edit-slide 中打开本地 HTML,并浏览模板。它同时支持交互模式(为初次使用者提供引导提示)和直接模式(面向脚本、CI/CD 以及 Claude Code 等 AI 代理的命令行参数)。模板草稿创建仅限通过远程 MCP 的 HTML 流程,CLI 会有意拒绝。

初始设置

在转换文件之前,请先配置 API 密钥。这是一次性设置,会将凭据保存到 ~/.html2pptx/config.json(仅所有者可访问的权限)。

1html2pptx init

命令

命令说明
html2pptx login
交互式配置 API 密钥。会显示控制台链接,你可以在那里生成密钥。
html2pptx logout
从 ~/.html2pptx/config.json 中删除已保存的 API 密钥。
html2pptx convert [file]
将 HTML 文件转换为 PPTX。不带参数运行进入交互模式,传入文件路径则为直接模式。
html2pptx status
查看当前用量、剩余配额、速率限制和套餐详情。
html2pptx whoami
验证 API 密钥并显示认证状态、套餐名称和用量。
html2pptx config
显示当前配置(API 密钥、基础 URL)。
html2pptx templates list
浏览所有可用模板,包含标题、分类和幻灯片数量。
html2pptx templates get <id>
获取模板详情,包括下载 URL。使用 --prompt 获取设计提示词,--html 获取源代码。
html2pptx templates publish
已禁用。模板发布仅限通过远程 MCP 的 HTML 流程。
html2pptx --help
显示帮助和可用命令。
html2pptx --version
显示已安装的 CLI 版本。

Convert 选项

选项说明
-o, --output <file>输出的 PPTX 文件名(默认:输入文件名加 .pptx 扩展名)
-s, --size <size>幻灯片尺寸:"16:9"、"4:3" 或自定义 "WxH"(如 1920x1080)
--css <file>与 HTML 一同包含的外部 CSS 文件
--json以 JSON 输出结果,便于脚本和 CI/CD 流水线使用
--open转换完成后自动打开 PPTX 文件
--base-url <url>API 基础 URL(默认:https://html2pptx.app)

示例

直接模式(用于脚本和 AI 代理)

1# 一行命令完成转换
2html2pptx convert ./slides.html -o presentation.pptx -s 16: 9
3
4# 带外部 CSS
5html2pptx convert ./slides.html --css ./styles.css -o deck.pptx
6
7# JSON 输出用于脚本
8html2pptx convert ./slides.html --json
9# {"success":true,"file":"slides.pptx","size":"1.2 MB","duration":"3.2s"}

交互模式(适合初次使用)

1# 直接运行 convert,不带参数
2html2pptx convert
3
4# CLI 会引导你完成:
5#   > 要转换的 HTML 文件
6#   > 幻灯片尺寸选择
7#   > 输出文件名

账号管理

1# 检查认证状态
2html2pptx whoami
3#   Plan: Starter
4#   Usage: 1 / 120 exports today
5#   Remaining: 119
6
7# 查看详细用量
8html2pptx status
9#   Plan: Starter
10#   Daily Usage: 42 / 120 exports  ████████████░░░░░░░░
11#   Remaining: 78
12#   Rate Limit: 5 req/min
13#   Max Slides: 50 per job
14
15# 删除凭据
16html2pptx logout

模板

1# 列出所有模板
2html2pptx templates list
3
4# 获取模板及设计提示词
5html2pptx templates get atlantis-pizza-corp --prompt
6
7# 获取模板及 HTML 源码(JSON 输出)
8html2pptx templates get atlantis-pizza-corp --prompt --html --json
9
10# 草稿创建仅限远程 MCP:
11# AI 安全预检 -> html2pptx_validate_template_html -> html2pptx_publish_template -> 控制台审核

使用场景与示例

html2pptx.app 专为自动化、可重复的幻灯片生成而设计。以下是最常见的集成模式:

自动化季度报告

从实时数据生成季度业绩幻灯片。从数据库拉取指标,将其格式化为带图表和 KPI 卡片的幻灯片 HTML,再通过 API 导出。配合 cron 调度或由 BI 流水线触发,实现完全无人值守的报告。

1const slides = quarterly_data.map((quarter, i) => `
2  <section class="slide" style="width: 1600px;height: 900px;padding: 60px;font-family:'Noto Sans JP',sans-serif;">
3    <h2 style="color:#1a1a2e;font-size: 36px;">Q${i+1} Results</h2>
4    <div style="display:grid;grid-template-columns: 1fr 1fr;gap: 40px;margin-top: 40px;">
5      <div style="background:#f0f4ff;border-radius: 16px;padding: 32px;">
6        <p style="font-size: 14px;color:#6b7280;">Revenue</p>
7        <p style="font-size: 48px;font-weight: 700;color:#1a1a2e;">${quarter.revenue}</p>
8      </div>
9      <div style="background:#f0fdf4;border-radius: 16px;padding: 32px;">
10        <p style="font-size: 14px;color:#6b7280;">Growth</p>
11        <p style="font-size: 48px;font-weight: 700;color:#16a34a;">${quarter.growth}%</p>
12      </div>
13    </div>
14  </section>
15`).join("\n");
16
17const resp = await fetch("/api/export/jobs", {
18  method: "POST",
19  headers: { "Authorization": "Bearer sk_live_xxxx", "Content-Type": "application/json" },
20  body: JSON.stringify({ fileName: "q-report.pptx", html: slides }),
21});

销售提案模板

用 HTML/CSS 一次性定义符合品牌规范的幻灯片模板,然后为每个活动或客户提案填充动态内容。公司名称、项目详情、报价等变量在生成时注入。市场团队维护模板;销售人员即刻获得像素级精准的品牌幻灯片。

1// 带动态客户数据的销售提案模板
2function generateProposal(client) {
3  return `
4    <section class="slide" style="width: 1600px;height: 900px;padding: 60px;background:linear-gradient(135deg,#1a1a2e,#16213e);">
5      <h1 style="color:#fff;font-size: 48px;">${client.companyName} 御中</h1>
6      <p style="color:#a0aec0;font-size: 24px;margin-top: 20px;">ご提案書 - ${client.projectName}</p>
7      <div style="position:absolute;bottom: 60px;left: 60px;color:#718096;font-size: 14px;">
8        ${new Date().toLocaleDateString('ja-JP')} | Confidential
9      </div>
10    </section>
11    <section class="slide" style="width: 1600px;height: 900px;padding: 60px;">
12      <h2 style="font-size: 36px;color:#1a1a2e;">提案概要</h2>
13      <div style="display:grid;grid-template-columns: 1fr 1fr 1fr;gap: 30px;margin-top: 40px;">
14        ${client.features.map(f => `
15          <div style="background:#f7fafc;border-radius: 12px;padding: 24px;">
16            <h3 style="font-size: 20px;color:#2d3748;">${f.title}</h3>
17            <p style="font-size: 14px;color:#718096;margin-top: 8px;">${f.description}</p>
18          </div>
19        `).join('')}
20      </div>
21    </section>
22  `;
23}

代理驱动的演示文稿

让 AI 代理根据会议记录、研究摘要或项目简报创建幻灯片。借助 Skills 或 MCP 集成,代理理解 html2pptx.app 的 HTML 契约,生成符合规范的幻灯片并交付下载链接。用户只需用自然语言描述需求。

SaaS 导出嵌入

为你的 SaaS 产品添加「导出为 PowerPoint」功能。将应用的仪表盘、分析视图或报告渲染为幻灯片 HTML,并从后端调用 html2pptx.app API。用户获得文本和形状可编辑的原生 PPTX 文件 —— 而不是扁平截图。

1// 后端路由: POST /api/dashboard/export-pptx
2app.post("/api/dashboard/export-pptx", async (req, res) => {
3  const { dashboardId } = req.body;
4  const dashboard = await getDashboard(dashboardId);
5
6  // 将每个 widget 渲染为一页幻灯片
7  const slides = dashboard.widgets.map(widget => `
8    <section class="slide" style="width: 1600px;height: 900px;padding: 40px;">
9      <h2 style="font-size: 28px;color:#1a1a2e;">${widget.title}</h2>
10      <div style="margin-top: 20px;">${widget.renderToHTML()}</div>
11    </section>
12  `).join("");
13
14  // 调用 html2pptx.app API
15  const job = await fetch(process.env.HTML2PPTX_API_URL + "/api/export/jobs", {
16    method: "POST",
17    headers: {
18      "Authorization": `Bearer ${process.env.HTML2PPTX_API_KEY}`,
19      "Content-Type": "application/json",
20    },
21    body: JSON.stringify({
22      fileName: `${dashboard.name}.pptx`,
23      html: slides,
24    }),
25  });
26
27  const { jobId } = await job.json();
28  res.json({ jobId, statusUrl: `/api/export/jobs/${jobId}` });
29});

套餐与定价

选择符合你用量的套餐。当前公开目录在代码中定义并由 API 网关强制执行:每分钟请求数、每日护栏、每任务最大幻灯片数、并发任务、API 密钥数量和负载大小均因套餐而异。

套餐导出次数幻灯片/任务支持价格
Free Preview每月 10 次 / 3 rpm每任务 20 页社区¥0
Founder Beta每月 300 次 / 5 rpm每任务 50 页自助¥980/月
Starter每月 3,000 次 / 15 rpm每任务 100 页邮件¥2,980/月
Business每月 20,000 次 / 60 rpm每任务 200 页优先¥9,800/月
Enterprise / OEM定制每任务 500+ 页专属¥49,800/月起

可随时在控制台升级。变更立即生效并按比例计费。降级在当前计费周期结束时生效。

各套餐的速率限制与配额

每个套餐执行以下限制。所有渠道(REST API、Skills、MCP)共享同一配额。

套餐RPM每日每月幻灯片/任务并发API 密钥负载公平使用
Free Preview3 req/min10/天10/月20 页1 个任务1 个密钥1 MB每月 10 次硬性上限(超出需升级)
Founder Beta5 req/min50/天300/月50 页2 个任务3 个密钥2 MB每月 300 次硬性上限
Starter15 req/min300/天3,000/月100 页5 个任务10 个密钥5 MB每月 3,000 次硬性上限
Business60 req/min2,000/天20,000/月200 页20 个任务50 个密钥10 MB每月 20,000 次硬性上限
Enterprise / OEM120 req/min定制定制500 页50 个任务100 个密钥25 MB定制条款

* MCP 协议请求的速率限制为套餐 RPM 的 3 倍,以考虑协议开销(initialize、tools/list 等)。

安全与限制

公开 API、Skills、MCP、Studio 和托管 Web 导出都经由同一条安全敏感的转换流水线。下面这些实用控制是你在集成或对外暴露产品时真正重要的部分。

认证与授权

REST API 使用 API 密钥。远程 MCP 支持商用 API 密钥或基于 WorkOS 的已认证会话。任务查询绑定到创建该任务的同一 API 密钥或已认证主体。

SVG 与不可信标记

公开 API 和 MCP 会净化传入的 HTML。内联 SVG 会被转换为 PNG 图片以保证输出可靠。

Worker 隔离

导出任务在隔离的上下文中运行,强制执行请求体限制,并自动清理过期任务。

用量控制

每分钟速率限制、每日护栏、每月公平使用审查阈值、每任务最大幻灯片数、最大负载大小和并发任务限制,均根据当前套餐在服务端强制执行。

推荐的生产实践

  • 将 API 密钥视为机密信息,泄露时在控制台中轮换。
  • 后端自动化使用 REST API;同源的托管 Web 导出仅用于第一方浏览器流程。
  • 使用退避策略轮询公开的任务状态路由,而不是高频请求状态端点。
  • 保持幻灯片标记的确定性:显式幻灯片尺寸、可预测的 CSS、不依赖运行时的内容。1600x900 仍是默认示例。
  • 使用 responseFormat: "base64" 时,fileBase64 可能很大;请在你这一侧用流式或二进制安全的代码路径解码。
  • 对于代理集成,请在上线前确定客户端使用本地 stdio MCP 还是远程 /mcp。

FAQ

html2pptx.app 与其他 HTML 转 PPTX 方案有何不同?

大多数替代方案会对 HTML 截图,并将其作为扁平图片嵌入每页幻灯片。html2pptx.app 生成完全可编辑的 PowerPoint 输出 —— flexbox、渐变、border-radius、阴影等 CSS 属性都会被忠实还原。最终得到可编辑文本、高质量形状和更小的文件体积。

任何 HTML 都能转换为 PPTX 吗?

无法保证稳定转换。html2pptx.app 针对带 .slide 类元素和显式尺寸的幻灯片导向 HTML 做了优化。1600x900 是默认示例,但竖版和其他自定义尺寸同样受支持。任意网页、交互式应用、基于滚动的布局以及依赖 JavaScript 渲染的页面不受支持。HTML 契约一节描述了确切要求。

什么会成为单独的一页幻灯片?

每个带 .slide 类的元素都会成为输出 PPTX 中的一页幻灯片。如果你的 HTML 包含 5 个 class="slide" 元素,输出就会有 5 页。为获得可预测的结果,请定义清晰的幻灯片边界。

导出的内容在 PowerPoint 中仍可编辑吗?

是的,大多数情况下可以。文本保持完全可编辑,形状在 PowerPoint 中仍可调整。内联 SVG 会被转换为高质量 PNG 图片,以保证输出可靠。

导出需要多长时间?

大多数单页任务在 3-5 秒内完成。多页幻灯片(10-50 页)通常需要 8-20 秒,取决于复杂度、图片数量和字体嵌入。worker 会尽可能并行处理幻灯片。为获得最佳响应性,请每 2 秒轮询一次任务状态端点。

支持哪些字体?

系统字体(Arial、Helvetica、Times New Roman 等)默认可用。对于 Web 字体,请启用 autoEmbedFonts: true —— html2pptx.app 会从 Google Fonts 或你的自定义 @font-face URL 下载字体文件并嵌入 PPTX。Noto Sans JP、Yu Gothic、Meiryo、Hiragino 等日文字体完全受支持。

有免费套餐吗?

有。当前公开目录包含一个 Early Access 层级,可在限额内使用 API、Skills 和 MCP。限制由代码强制执行,并可能在早期推广阶段调整,请通过 GET /api/export/plans 查看当前套餐元数据。

幻灯片中可以使用 SVG 吗?

可以。支持内联 SVG,它会被转换为高质量 PNG 图片,确保在所有 PowerPoint 环境中输出可靠。

最大文件大小是多少?

HTML 负载应保持在 5MB 以内。生成的 PPTX 文件大小因内容而异,通常在 100KB 到 10MB 之间。包含大量 base64 嵌入高分辨率图片的任务会产生更大的文件。对于大图片,建议使用 URL 引用。

服务的安全性如何?

html2pptx.app 实施多层安全防护:任务绑定到创建主体;API 密钥以哈希形式存储;请求体限制和并发任务限制在服务端强制执行。服务端自动化请使用 REST API,并将托管 Web 导出视为浏览器界面。

html2pptx.app 支持日文和 CJK 字符吗?

完全支持。日文、中文和韩文字符都能正确渲染。为获得最佳效果,请在 CSS 中指定 CJK 字体(例如 font-family: "Noto Sans JP", sans-serif),并启用 autoEmbedFonts,确保在未安装该字体的机器上也能可移植地渲染。

如何处理错误?

检查任务状态端点。如果 status 为 "failed",error 字段包含人类可读的描述。所有 API 错误都返回遵循 RFC 9457 Problem Details 格式的结构化 JSON,包含 type、status、title、detail 和 instance 字段,以及用于向后兼容的传统 error 和 message 字段。常见问题:缺少 .slide 元素 (400)、API 密钥过期 (401)、超过速率限制 (429)、内容过大 (413)。

可以用 CSS Grid 实现复杂的幻灯片布局吗?

可以。CSS Grid 得到完全支持,包括 grid-template-columns、grid-template-rows、gap 和网格放置属性。你可以轻松创建多栏布局、仪表盘风格的卡片和复杂的视觉排布,并干净地转换为 PPTX。

有任务完成的 webhook 吗?

有。在 POST /api/export/jobs 请求中添加 callbackUrl 字段(仅限 HTTPS)。任务完成或失败时,worker 会将完整任务结果 POST 到你的回调 URL,并附带用于验证的 x-signature-sha256 HMAC 头。你也仍然可以以 2 秒间隔轮询 GET /api/export/jobs/{jobId}。对于 MCP 用户,html2pptx_wait_for_export_job 会自动处理轮询。

故障排查

问题解决方法
任务一直停留在 "queued" 状态私有 worker 可能离线或过载。等待 30 秒后重试。如果持续出现,请在控制台检查 worker 健康状态或联系支持。
幻灯片显示为空白确保 HTML 中包含 class="slide" 的元素且这些元素有可见内容。同时确认 CSS 已包含在负载中,而不是依赖外部样式表。
PPTX 中字体看起来不一样启用 autoEmbedFonts: true 嵌入 Web 字体。使用自定义字体时,确保 @font-face URL 可公开访问。为获得最大兼容性,可回退到 Arial、Noto Sans 等系统安全字体。
429 速率限制错误查看 X-RateLimit-Reset 头了解窗口何时重置。在轮询逻辑中实现指数退避。如需更高的请求限额,请升级套餐。
布局与浏览器预览不一致在 .slide 元素上使用内联样式指定显式尺寸。1600x900 是默认示例,但当幻灯片 HTML 与请求的 width/height/layout 匹配时,自定义宽高比同样可行。避免响应式/百分比布局、媒体查询和视口相对单位(vh、vw)。
图片未出现在 PPTX 中图片请使用绝对 URL(https://...)或 base64 data URI。相对路径和 localhost URL 会失败。确保图片 URL 可从 worker 公开访问。
PPTX 文件过大文件过大通常由嵌入的 base64 图片或大量图片内容导致。请改用 URL 引用,或在嵌入前压缩图片。