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。支援的文字與簡單圖形保持可編輯;SVG、圖示與部分複雜結構會被點陣化。Flexbox、Grid、漸層與陰影可在已發佈的 HTML 規約範圍內使用。瀏覽器與 PowerPoint 的渲染可能不同,因此每次匯出後都應檢查結果。

架構

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 可調度處理,即使 worker 重新啟動也不會遺失任務。
Private Worker
Step 04
Private Worker
私有渲染器載入已儲存的任務,將支援的 HTML/CSS 映射為 PowerPoint 物件或圖片,並隨處理進度更新持久化任務狀態。
PPTX Output
Step
PPTX Output
產生的 PowerPoint 檔案會上傳至雲端儲存空間,並回傳限時簽章 URL 供下載。保留期限依部署環境的營運政策而定,請透過任務狀態確認目前結果並及時儲存。

三種整合管道

REST API

用於建立 HTML 轉 PPTX 匯出任務與輪詢狀態的標準 HTTP 端點。最適合後端整合、內部工具與 SaaS 嵌入。任何語言都能使用——curl、JavaScript、Python、Go、Ruby 等。創作者持有的範本草稿建立不屬於 REST API 的服務範圍。

Skills

為 Claude Code、Codex 等代理工具註冊 html2pptx skill。代理可以診斷、改寫並匯出投影片安全的 HTML、開啟本機編輯,並透過內建的遠端 MCP 流程建立創作者持有的 HTML 範本草稿。儀表板審核後只能建立 unlisted 分享;新範本的 public gallery 發佈已停止,unlisted 分享不計入創作者獎勵。

MCP (Model Context Protocol)

透過 MCP 協定將後端能力開放給 AI 代理。使用位於 /mcp 的遠端 HTTP 端點處理匯出、文件、目錄與創作者持有的範本草稿建立;本機 stdio MCP 僅用於在 edit-slide 中開啟本機 HTML。公開支援的草稿流程會在驗證後透過已驗證遠端 MCP 建立;legacy 或隱藏 Web 入口不屬於此公開契約。儀表板僅支援 unlisted 分享,不支援新的 public gallery 發佈。

html2pptx.app 與其他方案的比較

項目html2pptx.app常見替代方案
轉換方式支援的元素轉為 PPTX 物件;部分內容點陣化依實作而異:物件轉換或整頁圖片
文字可編輯性支援的文字元素可編輯依轉換方式而異
CSS 支援已發佈的子集,包括 Flexbox、Grid、漸層、陰影與 transform依服務商而異
SVG 處理點陣化為 PNG依服務商而異
檔案大小取決於嵌入與點陣化的圖片取決於輸出方式與圖片量
字型處理公開 REST 使用淨化後可用的系統字型堆疊,不擷取外部 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 會被點陣化為 PNG,無法在 PowerPoint 中作為向量編輯
  • 公開 REST 會移除 @font-face,無法擷取外部 Google Fonts 或自訂 Web 字型;請使用並驗證系統字型堆疊
  • 支援已發佈子集內的 Flexbox 與 CSS Grid;需要檢查匯出後的版面
  • 在 HTML 規約範圍內支援漸層、陰影與 border-radius;不保證與瀏覽器像素一致
  • 支援 Base64 data URI 與絕對 URL 圖片
  • 明確尺寸的投影片畫布,支援自訂 width/height/layout。1600x900px(13.333in x 7.5in)仍是預設範例
  • 支援多頁投影片(每個 .slide 元素產生一頁 PPTX 投影片)
  • 支援日文字型(Noto Sans JP、Yu Gothic、Meiryo)
  • 提供託管 Studio 與託管 Web 匯出,可直接在瀏覽器中手動使用

快速開始

四步驟完成首次帶驗證的匯出

REST API 是非同步的:先建立任務、再輪詢狀態,完成後使用 downloadUrl。

1

註冊帳號

html2pptx.app 建立帳號。Free Preview 已包含 1 把 API 金鑰與每月最多 10 次匯出,用於有限評估;Founder Beta 會為持續使用與商業用途擴大配額。

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"。回應通常包含 PPTX 檔案的 downloadUrl;無法產生下載 URL 時,worker 可能改以 fileBase64 作為備援。

程式碼範例

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    "metadata": {
11      "channel": "api",
12      "source": "docs-quickstart"
13    }
14  }'
15
16# 回應 (200 OK):
17# {
18#   "jobId": "5d934729-a0db-4aa9-bc65-e7a3e7e52b32",
19#   "status": "queued",
20#   "createdAt": "2026-04-02T10:30:00Z",
21#   "fileName": "quarterly-review.pptx",
22#   "slideCount": 1
23# }
24# 回應標頭包含: x-request-id: req_abc123...
25
26# 輪詢任務完成:
27curl -s https://html2pptx.app/api/export/jobs/5d934729-a0db-4aa9-bc65-e7a3e7e52b32 \
28  -H "Authorization: Bearer sk_live_xxxx"
29
30# 回應 (200 OK,completed 時):
31# {
32#   "jobId": "5d934729-a0db-4aa9-bc65-e7a3e7e52b32",
33#   "status": "completed",
34#   "createdAt": "2026-04-02T10:30:00Z",
35#   "completedAt": "2026-04-02T10:30:12Z",
36#   "fileName": "quarterly-review.pptx",
37#   "slideCount": 1,
38#   "mimeType": "application/vnd.openxmlformats-officedocument.presentationml.presentation",
39#   "downloadUrl": "https://storage.example.com/quarterly-review.pptx?token=..."
40# }

API 參考

連線資訊

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

Content-Type: 匯出工作建立、狀態與方案端點使用 application/json。PPTX 匯入可使用包含檔案的 multipart/form-data,或包含 pptxBase64 的 application/json;準確契約請參閱 OpenAPI 文件。建立端點接受頂層的 html 或同一金鑰持有的 templateId,以及 data、css、fileName 與選用的尺寸參數;沒有巢狀的 payload 包裝結構。

驗證

商用匯出端點需要驗證。請在儀表板建立或撤銷 API 金鑰,透過以下任一請求標頭送出,並將金鑰視為機密資訊保存。

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 回應通常包含 downloadUrl。無法產生 URL 時,fileBase64 可能作為 worker 備援回傳;公開 REST 呼叫端不能選擇回應格式。
  • 任務所有權繫結到建立該任務的 API 金鑰或已驗證的 MCP 主體。其他金鑰無法讀取同一個 jobId。
  • 投影片數量由伺服器端依淨化後的 .slide 根元素計算。限制判斷會忽略用戶端提供的數量。

速率限制

商用匯出在方案解析後會透過回應標頭提供速率與配額資訊。可用標頭會依方案與回應路徑而異。REST 呼叫以 API 金鑰為單位限制,遠端 MCP 呼叫則以已驗證的主體為單位限制。

Header說明
x-request-id匯出端點回傳的追蹤請求識別碼。除錯或聯絡支援時請保留該值。
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 或同一 API 金鑰持有的可重複使用 templateId 建立 PPTX 匯出任務。回應為 queued 狀態的任務描述子;請使用 GET /api/export/jobs/{jobId} 取得最終結果。

請求主體

fileNamestring

產生 PPTX 的輸出檔名。必須以 .pptx 副檔名結尾。

預設值: export.pptx

htmlstring

包含一個或多個 .slide 元素的投影片導向 HTML。同一 API 金鑰持有的可重複使用範本可由 templateId 解析時可省略。

cssstring

選用的 CSS,會全域套用到提交的 HTML。

預設值: ""

templateIdstring

以 tpl_ 開頭並註冊到同一 API 金鑰的可重複使用匯出範本 ID。可取代 html。

dataobject

在淨化前合併到 html/css 或可重複使用範本中的範本變數。

預設值: {}

autoEmbedFontsboolean

保留的字型嵌入請求旗標。公開 REST 淨化會移除 @font-face,worker 無法擷取外部 Google Fonts 或自訂 Web 字型;請使用並驗證系統字型堆疊。

預設值: false

slideCountinteger

為回溯相容保留的已棄用輸入。公開閘道會忽略它,並從淨化後的 .slide 元素重新計算實際數量。

widthnumber

選用的 PPTX 投影片寬度(英吋)。與 height 搭配使用以自訂簡報尺寸。

heightnumber

選用的 PPTX 投影片高度(英吋)。與 width 搭配使用以自訂簡報尺寸。

layoutstring

選用的 PPTX 版面配置預設集或自訂版面名稱。常用預設集:LAYOUT_16x9、LAYOUT_16x10、LAYOUT_4x3、LAYOUT_WIDE。

aspectRatiostring

選用比例:16:9、16:10 或 4:3。分隔符可使用 :、x 或 ×;不支援的值會被忽略。

metadataobject

原樣轉送給 worker 的不透明中繼資料。便於在你這一側進行請求追蹤。

預設值: {}

callbackUrlstring

用於接收任務完成/失敗提示的 HTTPS URL。成功酬載為 jobId、status、fileName;失敗酬載為 jobId、status、message;它不是完整結果。目前沒有對客戶公開可驗證的 Webhook 簽章契約,因此應將回呼視為未驗證,並從需要驗證的狀態端點取得結果。

錯誤代碼

400請求主體無效——缺少必填欄位或 JSON 格式錯誤。
401API 金鑰缺少或無效。請確認 Authorization 或 X-API-Key 標頭帶有有效的 sk_live_ 金鑰。
403API 金鑰沒有此操作的權限。請檢查方案限制或金鑰範圍。
404指定的 tpl_ templateId 不存在,或未註冊到目前的 API 金鑰。
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"。completed 回應通常包含 downloadUrl;fileBase64 可能作為備援回傳。

路徑參數

jobIdstringRequired

POST /api/export/jobs 端點回傳的任務 ID。

狀態值

queued

任務正在處理佇列中等待。

processing

worker 正在將 HTML 轉換為 PowerPoint。

completed

轉換成功完成。通常可使用 downloadUrl;fileBase64 可能作為備援出現。

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 class——這是投影片分割的邊界標記
  • 每個 .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
  • 字型:公開 REST 會在淨化時移除 @font-face,不能擷取外部 Google Fonts 或自訂 Web 字型。請指定目標環境可用的系統字型堆疊,並在 PowerPoint 中確認換行
  • 圖片:支援 base64 data URI 與絕對 URL。相對路徑會失敗——請一律使用絕對 URL
  • SVG:支援行內 SVG 元素,會被轉換為高品質 PNG 圖片
  • Canvas:託管 REST/MCP 不支援 canvas bitmap 狀態,因為它不會隨 HTML 字串序列化。請先轉換為 PNG,再以允許的 data:image <img> 送出
  • Video:僅允許嵌入核准的 base64 data:video 來源;不支援外部影片 URL。請提供適合的 poster 作為回退畫面
  • 避免使用:script 標籤、iframe、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 元素

支援的元素會依下表轉換。可編輯性因元素而異;映射為圖片的項目在 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託管 REST/MCP 不支援canvas bitmap 狀態不會隨 HTML 字串序列化。請先轉換為 PNG,再以帶允許 data:image 的 <img> 送出。
video嵌入媒體 / poster 回退僅接受核准的 base64 data:video 來源;不支援外部影片 URL。請提供適合的 poster。
圖示元素(FontAwesome、Material Icons 等)圖片偵測到的圖示字型會轉換為圖片,無法作為文字或向量編輯。

不支援或會被移除的元素

以下元素會在輸入淨化階段被移除,或不受渲染器支援。請勿在投影片 HTML 中依賴它們:

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 轉換規約進行驗證、視需要透過本機 stdio MCP 開啟本機視覺化編輯器、透過遠端 MCP 匯出,並透過遠端 MCP 建立創作者持有的 HTML 範本草稿。儀表板審核後只能建立 unlisted 分享;新範本的 public gallery 發佈已停止,unlisted 分享不計入創作者獎勵。產生的 PPTX 仍是待確認的匯出結果,分發前需要驗證標記並目視檢查。

運作方式

這個 skill 打包了四項核心能力:(1) HTML 撰寫知識——在已發佈的 PowerPoint 轉換規約範圍內撰寫 HTML/CSS 的規則;(2) 以遠端 MCP 為基礎的匯出自動化——透過託管的 html2pptx.app MCP 伺服器建立任務、輪詢狀態並取得結果;(3) 本機視覺化編輯——透過本機 stdio MCP 的編輯器開啟/停止工具與 localhost 橋接,在匯出前檢視或微調 HTML;(4) 範本草稿建立——公開支援的 HTML 草稿流程使用已驗證遠端 MCP 的驗證與草稿儲存流程;legacy 或隱藏 Web 入口不屬於此公開契約。此流程不會發佈到 public gallery。由於新增本機 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 class 元素與明確尺寸的投影片安全 HTML。1600x900 是預設範例
  4. 4代理依轉換規約驗證標記
  5. 5如需目視確認,代理會透過 CLI 或本機 stdio MCP 開啟本機 edit-slide 編輯器,再從磁碟重新讀取編輯後的 HTML
  6. 6代理連線到遠端 MCP,呼叫 html2pptx_create_export_job
  7. 7代理使用 html2pptx_wait_for_export_job 輪詢直到完成
  8. 8若使用者想建立 HTML 範本草稿,代理會使用 html2pptx skill 與遠端 MCP:從 HTML 推斷標題/標籤、執行 AI 安全預檢、驗證並修正錯誤、儲存創作者持有的草稿,然後回傳 draftUrl 供儀表板審核。審核後只能建立不計獎勵的 unlisted 分享,不會發佈到 public gallery
  9. 9代理將完成的任務摘要回傳給使用者

本機視覺化編輯器

edit-slide skill 讓代理可以在 PowerPoint 風格的視覺化編輯器中開啟本機 HTML 投影片,編輯器由可用的回送(loopback)來源提供服務,例如 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` 檔案。不會建立創作者持有的範本草稿、unlisted 分享或 public gallery 項目。

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 範本草稿流程是 AI 安全預檢、已驗證遠端 MCP 驗證與草稿建立。CLI、本機 MCP 與一般 REST 不是草稿建立的公開契約;legacy 或隱藏 Web 入口不屬於此公開流程。儀表板審核後只能建立 unlisted 分享;新範本的 public gallery 發佈已停止,unlisted 分享不計入創作者獎勵。

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 端點,涵蓋匯出、PPTX 匯入、用量、文件、範本、目錄與創作者持有的 HTML 範本草稿建立;本機 stdio MCP 僅公開用於本機 edit-slide 工作階段的 html2pptx_open_local_slide_editor 與 html2pptx_stop_local_slide_editor。匯出任務、PPTX 匯入、任務輪詢與 HTML 範本草稿建立使用遠端 MCP;只有在使用者的機器上開啟、預覽、編輯或停止編輯本機 HTML 檔案時才使用本機 stdio MCP。名為 html2pptx_publish_template 的遠端工具也只會建立草稿;儀表板審核後只能建立 unlisted 分享,新範本不能發佈至 public gallery,unlisted 分享不計入創作者獎勵。

安裝與設定

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、pollIntervalMs(1–60 秒)、timeoutMs(最多 300 秒)與 responseFormat("url" | "base64" | "both")。MCP 內嵌傳輸上限為 2 MiB,超過時會改為回傳附警告的簽署 URL。
html2pptx_import_pptx僅限遠端 MCP。以 pptxBase64 傳入既有 .pptx,並將其轉換為可編輯的 HTML 投影片。本機 stdio MCP 不公開此工具,也不接受 filePath。會解析佈景主題色彩、母片文字樣式與字型。
html2pptx_get_export_job依 jobId 取得匯出任務的目前狀態。
html2pptx_wait_for_export_job每 1–60 秒輪詢一次,直到任務完成、失敗或達到最長 300 秒等待。工具內部不重試也不執行退避;傳輸錯誤與限流錯誤會直接回傳呼叫端,由呼叫端依 Retry-After 決定後續操作。
html2pptx_get_docs取得 html2pptx.app 文件,理解 API 規約、HTML 要求與整合指南。
html2pptx_get_usage取得目前方案的用量與配額狀態。顯示每日與每月匯出數、剩餘配額、方案限制與重設資訊。
html2pptx_list_templates列出可用的市集範本,附中繼資料與選用的分類篩選。
html2pptx_get_template_html取得範本的原始 HTML 與設計提示詞,方便代理研究或重混改作。
html2pptx_validate_template_html在 AI 安全預檢之後,對用於建立創作者持有範本草稿的 HTML 進行 dry-run 驗證。建立草稿前必須執行。
html2pptx_publish_template上傳驗證通過的 HTML,推斷缺少的標題/說明/分類/標籤,並且只建立創作者持有的 HTML 範本草稿。工具回傳 draftUrl 供儀表板審核;審核後只能建立 unlisted 分享,不會將新範本發佈至 public gallery,且 unlisted 分享不計入創作者獎勵。
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 Resources(文件)

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;llms.txt 並不是正式的 Web 標準。

https://html2pptx.app/llms.txt

精簡 Markdown 索引——服務總覽、API 規約與支援的 CSS

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

涵蓋公開文件各章節的擴充 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 class、明確的投影片尺寸)
15# - 按設定的固定間隔輪詢狀態(工具本身不做重試或退避)
16# - 將傳輸與限流錯誤回傳給呼叫端,由呼叫端依 Retry-After 決定是否重試

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 代理)。公開支援的創作者 HTML 範本草稿流程使用已驗證遠端 MCP,CLI 會刻意拒絕草稿建立;legacy 或隱藏 Web 入口不屬於此公開契約。

初始設定

在轉換檔案之前,請先設定 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
已停用。公開支援的創作者 HTML 範本草稿流程使用已驗證遠端 MCP;新範本不能發佈至 public gallery,審核後的草稿只能建立不計入創作者獎勵的 unlisted 分享。
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 -> 儀表板審核
12# legacy/隱藏 Web 入口不屬於此公開契約
13# 儀表板審核 -> unlisted 分享(不計入創作者獎勵)
14# 不支援將新範本發佈至 public gallery

應用情境與範例

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;唯讀工具依已驗證主體限制為每分鐘 30 次。範本發佈與驗證使用可依部署設定的獨立上限(預設每分鐘 5 次與 12 次)。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 匯出僅用於第一方的瀏覽器流程。
  • 請以符合方案限制的間隔輪詢公開狀態路由(通常從 20 秒開始);遇到 429 時遵循 Retry-After,不要高頻連打狀態端點。
  • 保持投影片標記的確定性:明確的投影片尺寸、可預測的 CSS、不依賴執行時期的內容。1600x900 仍是預設範例。
  • MCP 只會內嵌傳輸不超過 2 MiB 的完整 PPTX。即使明確要求 responseFormat: "base64" 或 "both",較大的檔案也會改為回傳簽署下載 URL 與機器可讀警告,以避免回應過大。
  • 遠端 /mcp 的每個已驗證 HTTP POST 最多包含 32 則 JSON-RPC 訊息與一則 tools/call 訊息。請將其他工具呼叫分開傳送,讓伺服器正確套用各操作的速率限制。
  • 針對代理整合,請在上線前決定用戶端要使用本機 stdio MCP 還是遠端 /mcp。

FAQ

html2pptx.app 與其他 HTML 轉 PPTX 方案有什麼不同?

html2pptx.app 不會把每頁投影片都渲染成一張截圖,而是將支援的文字、簡單圖形、表格與 CSS 屬性映射為 PowerPoint 物件。行內 SVG、圖示與部分複雜清單會被點陣化。輸出遵循已發佈的 HTML 規約,匯出後應進行目視檢查。

任何 HTML 都能轉換成 PPTX 嗎?

無法保證穩定轉換。html2pptx.app 針對帶 .slide class 元素與明確尺寸的投影片導向 HTML 進行最佳化。1600x900 是預設範例,但直式與其他自訂尺寸同樣支援。任意網頁、互動式應用程式、捲動式版面,以及依賴 JavaScript 渲染的頁面皆不支援。HTML 規約一節描述了確切的要求。

什麼會成為獨立的一頁投影片?

每個帶 .slide class 的元素都會成為輸出 PPTX 中的一頁投影片。如果你的 HTML 包含 5 個 class="slide" 元素,輸出就會有 5 頁。為了得到可預期的結果,請定義清楚的投影片邊界。

匯出的內容在 PowerPoint 中仍可編輯嗎?

支援的文字會成為可編輯的 PowerPoint 文字方塊,支援的簡單圖形仍可調整。行內 SVG、偵測到的圖示與部分複雜結構會以圖片匯出,因此無法作為文字或向量編輯。

匯出需要多久?

匯出時間取決於投影片數量、版面複雜度、圖片載入與字型處理。不要假設固定完成時間;請以符合方案限制的間隔輪詢(通常從 20 秒開始),遇到 429 時遵循 Retry-After,直到任務變為 completed 或 failed。

支援哪些字型?

公開 REST 會在淨化時移除 @font-face,無法從 Google Fonts 或自訂 URL 擷取外部 Web 字型。請使用 Arial、Helvetica、Noto Sans 等目標環境可用的系統字型堆疊,並在目標 PowerPoint 環境中檢查字形、替代字型與換行。

有免費方案嗎?

有。Free Preview 包含 1 把 API 金鑰與每月最多 10 次匯出,可在限額內使用 API、Skills 與 MCP。限制由程式碼強制執行且可能調整,請透過 GET /api/export/plans 查看目前的方案中繼資料。

投影片中可以使用 SVG 嗎?

可以。行內 SVG 會被轉換為 PNG 圖片。請在目標 PowerPoint 環境中檢查產生的 PPTX,因為渲染與圖片縮放可能有所不同。

檔案大小上限是多少?

HTML 酬載應保持在 5MB 以內。產生的 PPTX 檔案大小依內容而異,通常介於 100KB 到 10MB 之間。內含大量 base64 嵌入高解析度圖片的任務會產生較大的檔案。大圖建議改用 URL 參照。

這個服務的安全性如何?

html2pptx.app 實作多層安全防護:任務繫結到建立它的主體;API 金鑰以雜湊形式儲存;請求主體限制與並行任務限制在伺服器端強制執行。伺服器端自動化請使用 REST API,並將託管 Web 匯出視為瀏覽器介面。

html2pptx.app 支援日文與 CJK 字元嗎?

支援日文、中文與韓文文字。請指定目標環境已有的 CJK 系統字型堆疊(例如 font-family: "Noto Sans JP", "Microsoft JhengHei", sans-serif)。公開 REST 不會擷取外部 Web 字型;請在目標 PowerPoint 環境中檢查字型替代與換行。

如何處理錯誤?

請檢查任務狀態端點。若 status 為 "failed",error 或 message 欄位包含人類可讀的說明。商用匯出錯誤使用 RFC 9457 Problem Details 欄位以及回溯相容的 error、message 欄位;部分舊版與創作者端點會回傳較精簡的 JSON 錯誤物件。常見問題:缺少 .slide 元素 (400)、API 金鑰缺少或無效 (401/403)、超過速率限制 (429)、內容過大 (413)。

可以用 CSS Grid 做複雜的投影片版面嗎?

支援的 CSS Grid 子集包括 grid-template-columns、grid-template-rows、gap 與格線放置屬性。請使用明確的投影片尺寸並檢查匯出的 PPTX;複雜的瀏覽器版面或不支援的屬性組合可能呈現不同結果。

有任務完成的 webhook 嗎?

有。callbackUrl(僅限 HTTPS)會收到輕量提示:成功時為 jobId、status、fileName,失敗時為 jobId、status、message;它不是完整結果。目前沒有對客戶公開可驗證的 Webhook 簽章契約,因此應將回呼視為未驗證,並從需要驗證的狀態端點取得完整結果。請以狀態輪詢為準:通常以 20 秒間隔開始,429 時遵循 Retry-After。MCP 的 html2pptx_wait_for_export_job 只按固定/設定間隔輪詢,不會在內部重試或退避。

疑難排解

問題解決方式
任務一直停在 "queued" 狀態私有 worker 可能離線或過載。請繼續以符合方案限制的間隔檢查狀態(通常 20 秒),遇到 429 時遵循 Retry-After。若持續發生,請在儀表板檢查 worker 健康狀態或聯絡支援。
投影片顯示為空白請確認 HTML 中含有 class="slide" 的元素,且這些元素有可見內容。同時確認 CSS 已包含在酬載中,而不是依賴外部樣式表。
PPTX 中的字型看起來不一樣公開 REST 會移除 @font-face,也不會擷取外部 Google Fonts 或自訂 Web 字型。請改用目標環境已有的 Arial、Noto Sans 等系統字型堆疊,並在 PowerPoint 中檢查字型替代與換行。
429 速率限制錯誤讀取 Retry-After 回應標頭並等待指定秒數後再試。正常狀態輪詢通常從 20 秒間隔開始,並應符合目前方案限制;若需要更高上限,請升級方案。
版面與瀏覽器預覽不一致請在 .slide 元素上以行內樣式指定明確尺寸。1600x900 是預設範例,但只要投影片 HTML 與請求的 width/height/layout 相符,自訂長寬比同樣可行。避免響應式/百分比版面、媒體查詢與視口相對單位(vh、vw)。
圖片沒有出現在 PPTX 中圖片請使用絕對 URL(https://...)或 base64 data URI。相對路徑與 localhost URL 會失敗。請確認圖片 URL 可從 worker 公開存取。
PPTX 檔案太大檔案過大通常是嵌入的 base64 圖片或大量圖片內容造成。請改用 URL 參照,或在嵌入前先壓縮圖片。