1. 为什么我要用 Claude Code 手搓一个 Presentation Agent先说清楚这个东西是什么。Presentation Agent直译就是演示文稿智能体你给它一句话需求比如“帮我做一份 2025 年新能源汽车出海趋势的汇报”它自己拆大纲、自己搜资料、自己生成一页页 HTML 幻灯片最后你在浏览器里翻页就能看。它适合谁适合经常要做技术分享、周报汇报、方案评审但又不想在 PPT 排版上耗掉半天的开发者也适合想入门 Agent 编排、想找一个“有真实产出”的练手项目的同学。我为什么不用现成的 PPT 工具因为传统 PPT 是二进制格式模型很难直接操控版式而 HTML 天生就是文本模型生成静态页面的能力又强所以“生成 HTML 演示页面”这条路比“生成 .pptx”顺得多。整套流程我用 Claude Code 来写它负责读需求、改代码、跑命令、修报错我负责 review 和定方向。这篇文章不讲空话我会把三件事讲透第一怎么用 TaoToken 拿到一个统一 Key把 Claude Code 接上第二Presentation Agent 的三个 AgentOutline / Search / HTML怎么编排第三本地怎么跑起来验证以及我踩过的那些报错怎么排。你跟着做能复现一个最小可用的版本。核心检索词先埋在这Claude Code 接入、Presentation Agent 开发、大模型 Agent 编排、HTML 幻灯片生成。这四个词贯穿全文你搜哪个都能落到这篇。我试过纯手写这套编排后来发现用 Claude Code 边聊边生成效率高太多尤其是前端那部分我基本没自己写 CSS。下面从环境准备开始一步步来。2. TaoToken 前置准备统一 Key 与 Claude Code 接入配置这一章是地基地基不稳后面全白搭。TaoToken 的作用是给你一个统一的 API 入口和 Key让你不用在多个模型供应商之间来回切换配置。官网地址是 https://taotoken.net/?utm_sourcetaotoken_aicg_blog_endutm_mediumcsdnutm_campaignrewriteutm_content API 根地址是 https://taotoken.net/api 注意 API 地址后面不加任何参数。第一步注册并拿到 Key。打开官网进控制台找到 API Keys 页面deep linkhttps://taotoken.net/console/api-keys?utm_sourcetaotoken_aicg_blog_endutm_contentapi_keysutm_campaignrewrite 新建一个 Key复制出来。这个 Key 就是你后面所有配置里要填的东西形如sk-xxxxxxxx。别把它提交到 Git我一般放.env里然后加进.gitignore。第二步确认你要用的模型 ID。TaoToken 支持多种模型你在模型对话页面deep linkhttps://taotoken.net/models?utm_sourcetaotoken_aicg_blog_endutm_contentmodelsutm_campaignrewrite 能看到当前可用的模型列表。做 Presentation Agent 我建议用长上下文、代码能力强的模型因为要生成大量 HTML。记下你选的 Model ID比如claude-sonnet-4-5这类后面配置要用。第三步配置 Claude Code。Claude Code 读取的是环境变量你需要设置三个东西Base URL、API Key、Model。在终端里这样写macOS / Linuxexport ANTHROPIC_BASE_URLhttps://taotoken.net/api export ANTHROPIC_API_KEYsk-你的Key export ANTHROPIC_MODELclaude-sonnet-4-5Windows PowerShell 用这个$env:ANTHROPIC_BASE_URLhttps://taotoken.net/api $env:ANTHROPIC_API_KEYsk-你的Key $env:ANTHROPIC_MODELclaude-sonnet-4-5如果你想让配置持久化写进~/.zshrc或~/.bashrc然后source一下。这里有个坑Base URL 千万别写成https://taotoken.net/api/带尾斜杠有些客户端拼接路径时会变成双斜杠导致 404。我踩过这个坑排查了半小时。第四步验证 Claude Code 能不能连上。在项目目录里直接跑claude进去后随便问一句“你好”能正常回就说明通了。如果报 401八成是 Key 错了或者没生效重新echo $ANTHROPIC_API_KEY确认一下。关于 Coding Plan如果你打算长期用 Claude Code 做开发、跑 Agent可以看下 https://taotoken.net/coding-plan?utm_sourcetaotoken_aicg_blog_endutm_contentcoding_planutm_campaignrewrite 它更适合高频编码场景比按量付费省心。接入文档在 https://taotoken.net/doc?utm_sourcetaotoken_aicg_blog_endutm_contentdocutm_campaignrewrite 遇到配置细节可以对照看。这一章做完你应该有一个能正常对话的 Claude Code。下一章开始写真正的 Agent 代码。3. 可复制配置Presentation Agent 的目录结构与核心配置片段这一章给你能直接抄的配置。先说目录结构我习惯这样组织presentation-agent/ ├── .env ├── config/ │ └── settings.toml ├── agents/ │ ├── outline_agent.py │ ├── search_agent.py │ └── html_agent.py ├── tools/ │ ├── search_tool.py │ └── fetch_tool.py ├── output/ └── main.py.env文件内容TAOTOKEN_BASE_URLhttps://taotoken.net/api TAOTOKEN_API_KEYsk-你的Key TAOTOKEN_MODELclaude-sonnet-4-5 SERPER_API_KEY你的搜索Keyconfig/settings.toml是核心把模型参数、Agent 限制都放这[llm] base_url https://taotoken.net/api model claude-sonnet-4-5 temperature 0.7 max_tokens 8192 [outline_agent] num_topics 5 max_tool_calls 6 [search_agent] max_tool_calls 8 max_fetch_length 4000 parallel true [html_agent] page_width 1280 page_height 720 theme modern [output] dir ./output注意max_fetch_length这个参数它控制每次抓网页后截断的长度。我一开始没限制结果一个 Search Agent 就烧了 900K token大部分是输入 token。限制到 4000 字符后成本直接降下来。如果你用 Claude Code 的 settings 文件~/.claude/settings.json可以这样写把 TaoToken 作为统一入口{ env: { ANTHROPIC_BASE_URL: https://taotoken.net/api, ANTHROPIC_API_KEY: sk-你的Key, ANTHROPIC_MODEL: claude-sonnet-4-5 }, permissions: { allow: [Bash(python:*), Read, Write] } }这里三件套必须齐全Base URL 是https://taotoken.net/apiKey 是你的sk-开头那串Model ID 是你在模型列表里选的那个。少一个都连不上。如果你用 Cline 或 CC Switch 这类工具配置逻辑一样都是填这三项。Cline 的 MCP 配置里把 TaoToken 当成一个 provider 填进去即可。Codex 的auth.json也是同理把 base_url 和 api_key 换成 TaoToken 的。配置写完跑一句python -c import tomllib; print(tomllib.load(open(config/settings.toml,rb)))确认 TOML 没语法错。这一步别省我见过太多人因为 TOML 少个引号卡半天。4. 三个 Agent 的编排与本地运行验证现在写核心逻辑。整个 Presentation Agent 是一个 workflow分三步Outline Agent 生成大纲Search Agent 并行收集内容HTML Agent 生成页面。每个 Agent 只配两个工具搜索和 fetch。先看 Outline Agent 的 prompt这是纯 prompt 驱动的OUTLINE_PROMPT 你的任务是根据用户的描述生成大纲。 大纲包含 {num_topics} 个子主题每个子主题包含 3-5 个要点。 要求 - 如果对用户描述不清楚或涉及时效性信息使用搜索工具获取最新信息 - 搜索到相关链接后可用 fetch 工具阅读页面详细内容 - 最终必须返回有效的 JSON 格式严格遵循以下 schema {schema} 重要无论如何都必须输出符合上述 schema 的 JSON 对象。 关键点是强制 JSON 输出用 Pydantic 模型生成 schema 塞进 prompt解析时就不会崩。Outline Agent 跑完你得到一个结构化的主题列表。Search Agent 是并行的每个子主题一个 Agent各自去搜。这里我踩的坑最多并行 Agent 之间缺乏全局把控会重复抓同一个来源token 浪费严重。后来我加了一个汇总步骤把各 Agent 的结果去重再合并。另外图片问题很头疼模型自己判断的图片链接经常失效或带水印我的建议是把图片下载到本地顺便拿到尺寸这样 HTML 排版时能预留位置。HTML Agent 内部也是 workflow先定主题样式再生成封面页、目录页、内容页。封面和目录好搞prompt 调好基本没问题内容页难容易出现布局不对齐、内容分布不均、图片截断。我的做法是给每页固定 1280x720 的画布内容溢出就自动缩字号二者做权衡。本地运行验证先跑最小闭环python main.py --topic 2025年新能源汽车出海趋势 --pages 8跑完去output/目录看应该有一个index.html。用浏览器打开python -m http.server 8000 --directory output然后访问http://localhost:8000能翻页就说明成功了。我实测下来第一次跑通常会有一两页排版崩这是正常的调 prompt 迭代就行。验证请求是否真的走了 TaoToken可以在代码里打印 response 的 usage 字段看 token 消耗。如果 usage 一直是 0 或者报错说明请求没发出去回去检查 Base URL 和 Key。如果你想先单独验证模型通不通用模型对话页面deep linkhttps://taotoken.net/chat?utm_sourcetaotoken_aicg_blog_endutm_contentchatutm_campaignrewrite 发一句话测试比在代码里 debug 快。5. 常见报错排查401、local proxy failed、reading choices、OAuth这一章全是真实报错对照着排。401 Unauthorized。最常见原因就三个Key 错了、Key 没生效、Base URL 写错。先echo $ANTHROPIC_API_KEY看有没有值再确认 Base URL 是https://taotoken.net/api不带尾斜杠。如果用的是 settings.json检查 JSON 有没有语法错逗号多了少了都会导致整个配置不生效。local proxy failed / connection refused。这个通常是你本地起了代理但没配对或者环境变量里残留了旧的代理设置。检查echo $HTTP_PROXY $HTTPS_PROXY如果有值且不是你想要的unset掉。注意这里说的是清理本地环境变量不是让你去搞什么网络工具纯粹是配置冲突问题。reading choices 报错 / choices 字段为空。这是响应解析问题多半是模型返回的不是标准 OpenAI 格式或者你用的 SDK 版本和 API 不匹配。解决办法打印原始 response 看结构确认choices[0].message.content存在。如果用的是 Anthropic 格式的 SDK字段是content[0].text别搞混。OAuth 相关报错。Claude Code 有时会走 OAuth 流程如果你用 API Key 模式确保没有同时开着 OAuth 登录态。清掉~/.claude/下的凭证缓存重新用 Key 登录。如果报OAuth token expired直接重新配置环境变量即可。模型 ID 不存在。报错形如model not found。回去模型列表确认你填的 ID 和平台上一致大小写、连字符都要对。我见过有人把claude-sonnet-4-5写成claude-sonnet-4.5直接 404。token 超限。长文档生成 HTML 时容易触发。调小max_fetch_length或者把内容页拆成多次请求。别一次性把几万字塞进去。排障时如果拿不准接入文档deep linkhttps://taotoken.net/doc?utm_sourcetaotoken_aicg_blog_endutm_contentdocutm_campaignrewrite 里有完整的错误码对照。API Keys 页面可以随时重新生成 Key 排除 Key 本身的问题。6. 继续迭代把 Agent 用起来跑通最小闭环只是开始。我后来做的几件事你可以参考把 Search Agent 的网页内容先用小模型总结再喂给主模型token 直接降一个量级把图片下载到本地并记录尺寸HTML 排版稳定很多给 HTML Agent 加一个自动评估步骤用多模态模型看渲染截图判断布局有没有崩这样迭代快得多。Agent 模式的好处是省工程坏处是不可控prompt 写得再细产出也像开盲盒。所以评估标准一定要提前定义好最好能自动化。这套东西我断断续续搞了一两个月大部分时间花在调 prompt 和排错上代码本身反而不多。如果你要长期跑这类编码和 Agent 任务Coding Plandeep linkhttps://taotoken.net/coding-plan?utm_sourcetaotoken_aicg_blog_endutm_contentcoding_planutm_campaignrewrite 比按量付费更划算。想先验证模型效果就去模型对话页面发几条测试。配置过程中卡住了接入文档和 API Keys 页面是你最该先看的两个地方。最后留一个实用技巧每次改完 prompt别急着跑全流程先用一页内容做单页测试确认 HTML 渲染没问题再跑整份。这样迭代一轮只要几十秒比跑完整流程快十倍。
1. 为什么我要用 Claude Code 手搓一个 Presentation Agent先说清楚这个东西是什么。Presentation Agent直译就是演示文稿智能体你给它一句话需求比如“帮我做一份 2025 年新能源汽车出海趋势的汇报”它自己拆大纲、自己搜资料、自己生成一页页 HTML 幻灯片最后你在浏览器里翻页就能看。它适合谁适合经常要做技术分享、周报汇报、方案评审但又不想在 PPT 排版上耗掉半天的开发者也适合想入门 Agent 编排、想找一个“有真实产出”的练手项目的同学。我为什么不用现成的 PPT 工具因为传统 PPT 是二进制格式模型很难直接操控版式而 HTML 天生就是文本模型生成静态页面的能力又强所以“生成 HTML 演示页面”这条路比“生成 .pptx”顺得多。整套流程我用 Claude Code 来写它负责读需求、改代码、跑命令、修报错我负责 review 和定方向。这篇文章不讲空话我会把三件事讲透第一怎么用 TaoToken 拿到一个统一 Key把 Claude Code 接上第二Presentation Agent 的三个 AgentOutline / Search / HTML怎么编排第三本地怎么跑起来验证以及我踩过的那些报错怎么排。你跟着做能复现一个最小可用的版本。核心检索词先埋在这Claude Code 接入、Presentation Agent 开发、大模型 Agent 编排、HTML 幻灯片生成。这四个词贯穿全文你搜哪个都能落到这篇。我试过纯手写这套编排后来发现用 Claude Code 边聊边生成效率高太多尤其是前端那部分我基本没自己写 CSS。下面从环境准备开始一步步来。2. TaoToken 前置准备统一 Key 与 Claude Code 接入配置这一章是地基地基不稳后面全白搭。TaoToken 的作用是给你一个统一的 API 入口和 Key让你不用在多个模型供应商之间来回切换配置。官网地址是 https://taotoken.net/?utm_sourcetaotoken_aicg_blog_endutm_mediumcsdnutm_campaignrewriteutm_content API 根地址是 https://taotoken.net/api 注意 API 地址后面不加任何参数。第一步注册并拿到 Key。打开官网进控制台找到 API Keys 页面deep linkhttps://taotoken.net/console/api-keys?utm_sourcetaotoken_aicg_blog_endutm_contentapi_keysutm_campaignrewrite 新建一个 Key复制出来。这个 Key 就是你后面所有配置里要填的东西形如sk-xxxxxxxx。别把它提交到 Git我一般放.env里然后加进.gitignore。第二步确认你要用的模型 ID。TaoToken 支持多种模型你在模型对话页面deep linkhttps://taotoken.net/models?utm_sourcetaotoken_aicg_blog_endutm_contentmodelsutm_campaignrewrite 能看到当前可用的模型列表。做 Presentation Agent 我建议用长上下文、代码能力强的模型因为要生成大量 HTML。记下你选的 Model ID比如claude-sonnet-4-5这类后面配置要用。第三步配置 Claude Code。Claude Code 读取的是环境变量你需要设置三个东西Base URL、API Key、Model。在终端里这样写macOS / Linuxexport ANTHROPIC_BASE_URLhttps://taotoken.net/api export ANTHROPIC_API_KEYsk-你的Key export ANTHROPIC_MODELclaude-sonnet-4-5Windows PowerShell 用这个$env:ANTHROPIC_BASE_URLhttps://taotoken.net/api $env:ANTHROPIC_API_KEYsk-你的Key $env:ANTHROPIC_MODELclaude-sonnet-4-5如果你想让配置持久化写进~/.zshrc或~/.bashrc然后source一下。这里有个坑Base URL 千万别写成https://taotoken.net/api/带尾斜杠有些客户端拼接路径时会变成双斜杠导致 404。我踩过这个坑排查了半小时。第四步验证 Claude Code 能不能连上。在项目目录里直接跑claude进去后随便问一句“你好”能正常回就说明通了。如果报 401八成是 Key 错了或者没生效重新echo $ANTHROPIC_API_KEY确认一下。关于 Coding Plan如果你打算长期用 Claude Code 做开发、跑 Agent可以看下 https://taotoken.net/coding-plan?utm_sourcetaotoken_aicg_blog_endutm_contentcoding_planutm_campaignrewrite 它更适合高频编码场景比按量付费省心。接入文档在 https://taotoken.net/doc?utm_sourcetaotoken_aicg_blog_endutm_contentdocutm_campaignrewrite 遇到配置细节可以对照看。这一章做完你应该有一个能正常对话的 Claude Code。下一章开始写真正的 Agent 代码。3. 可复制配置Presentation Agent 的目录结构与核心配置片段这一章给你能直接抄的配置。先说目录结构我习惯这样组织presentation-agent/ ├── .env ├── config/ │ └── settings.toml ├── agents/ │ ├── outline_agent.py │ ├── search_agent.py │ └── html_agent.py ├── tools/ │ ├── search_tool.py │ └── fetch_tool.py ├── output/ └── main.py.env文件内容TAOTOKEN_BASE_URLhttps://taotoken.net/api TAOTOKEN_API_KEYsk-你的Key TAOTOKEN_MODELclaude-sonnet-4-5 SERPER_API_KEY你的搜索Keyconfig/settings.toml是核心把模型参数、Agent 限制都放这[llm] base_url https://taotoken.net/api model claude-sonnet-4-5 temperature 0.7 max_tokens 8192 [outline_agent] num_topics 5 max_tool_calls 6 [search_agent] max_tool_calls 8 max_fetch_length 4000 parallel true [html_agent] page_width 1280 page_height 720 theme modern [output] dir ./output注意max_fetch_length这个参数它控制每次抓网页后截断的长度。我一开始没限制结果一个 Search Agent 就烧了 900K token大部分是输入 token。限制到 4000 字符后成本直接降下来。如果你用 Claude Code 的 settings 文件~/.claude/settings.json可以这样写把 TaoToken 作为统一入口{ env: { ANTHROPIC_BASE_URL: https://taotoken.net/api, ANTHROPIC_API_KEY: sk-你的Key, ANTHROPIC_MODEL: claude-sonnet-4-5 }, permissions: { allow: [Bash(python:*), Read, Write] } }这里三件套必须齐全Base URL 是https://taotoken.net/apiKey 是你的sk-开头那串Model ID 是你在模型列表里选的那个。少一个都连不上。如果你用 Cline 或 CC Switch 这类工具配置逻辑一样都是填这三项。Cline 的 MCP 配置里把 TaoToken 当成一个 provider 填进去即可。Codex 的auth.json也是同理把 base_url 和 api_key 换成 TaoToken 的。配置写完跑一句python -c import tomllib; print(tomllib.load(open(config/settings.toml,rb)))确认 TOML 没语法错。这一步别省我见过太多人因为 TOML 少个引号卡半天。4. 三个 Agent 的编排与本地运行验证现在写核心逻辑。整个 Presentation Agent 是一个 workflow分三步Outline Agent 生成大纲Search Agent 并行收集内容HTML Agent 生成页面。每个 Agent 只配两个工具搜索和 fetch。先看 Outline Agent 的 prompt这是纯 prompt 驱动的OUTLINE_PROMPT 你的任务是根据用户的描述生成大纲。 大纲包含 {num_topics} 个子主题每个子主题包含 3-5 个要点。 要求 - 如果对用户描述不清楚或涉及时效性信息使用搜索工具获取最新信息 - 搜索到相关链接后可用 fetch 工具阅读页面详细内容 - 最终必须返回有效的 JSON 格式严格遵循以下 schema {schema} 重要无论如何都必须输出符合上述 schema 的 JSON 对象。 关键点是强制 JSON 输出用 Pydantic 模型生成 schema 塞进 prompt解析时就不会崩。Outline Agent 跑完你得到一个结构化的主题列表。Search Agent 是并行的每个子主题一个 Agent各自去搜。这里我踩的坑最多并行 Agent 之间缺乏全局把控会重复抓同一个来源token 浪费严重。后来我加了一个汇总步骤把各 Agent 的结果去重再合并。另外图片问题很头疼模型自己判断的图片链接经常失效或带水印我的建议是把图片下载到本地顺便拿到尺寸这样 HTML 排版时能预留位置。HTML Agent 内部也是 workflow先定主题样式再生成封面页、目录页、内容页。封面和目录好搞prompt 调好基本没问题内容页难容易出现布局不对齐、内容分布不均、图片截断。我的做法是给每页固定 1280x720 的画布内容溢出就自动缩字号二者做权衡。本地运行验证先跑最小闭环python main.py --topic 2025年新能源汽车出海趋势 --pages 8跑完去output/目录看应该有一个index.html。用浏览器打开python -m http.server 8000 --directory output然后访问http://localhost:8000能翻页就说明成功了。我实测下来第一次跑通常会有一两页排版崩这是正常的调 prompt 迭代就行。验证请求是否真的走了 TaoToken可以在代码里打印 response 的 usage 字段看 token 消耗。如果 usage 一直是 0 或者报错说明请求没发出去回去检查 Base URL 和 Key。如果你想先单独验证模型通不通用模型对话页面deep linkhttps://taotoken.net/chat?utm_sourcetaotoken_aicg_blog_endutm_contentchatutm_campaignrewrite 发一句话测试比在代码里 debug 快。5. 常见报错排查401、local proxy failed、reading choices、OAuth这一章全是真实报错对照着排。401 Unauthorized。最常见原因就三个Key 错了、Key 没生效、Base URL 写错。先echo $ANTHROPIC_API_KEY看有没有值再确认 Base URL 是https://taotoken.net/api不带尾斜杠。如果用的是 settings.json检查 JSON 有没有语法错逗号多了少了都会导致整个配置不生效。local proxy failed / connection refused。这个通常是你本地起了代理但没配对或者环境变量里残留了旧的代理设置。检查echo $HTTP_PROXY $HTTPS_PROXY如果有值且不是你想要的unset掉。注意这里说的是清理本地环境变量不是让你去搞什么网络工具纯粹是配置冲突问题。reading choices 报错 / choices 字段为空。这是响应解析问题多半是模型返回的不是标准 OpenAI 格式或者你用的 SDK 版本和 API 不匹配。解决办法打印原始 response 看结构确认choices[0].message.content存在。如果用的是 Anthropic 格式的 SDK字段是content[0].text别搞混。OAuth 相关报错。Claude Code 有时会走 OAuth 流程如果你用 API Key 模式确保没有同时开着 OAuth 登录态。清掉~/.claude/下的凭证缓存重新用 Key 登录。如果报OAuth token expired直接重新配置环境变量即可。模型 ID 不存在。报错形如model not found。回去模型列表确认你填的 ID 和平台上一致大小写、连字符都要对。我见过有人把claude-sonnet-4-5写成claude-sonnet-4.5直接 404。token 超限。长文档生成 HTML 时容易触发。调小max_fetch_length或者把内容页拆成多次请求。别一次性把几万字塞进去。排障时如果拿不准接入文档deep linkhttps://taotoken.net/doc?utm_sourcetaotoken_aicg_blog_endutm_contentdocutm_campaignrewrite 里有完整的错误码对照。API Keys 页面可以随时重新生成 Key 排除 Key 本身的问题。6. 继续迭代把 Agent 用起来跑通最小闭环只是开始。我后来做的几件事你可以参考把 Search Agent 的网页内容先用小模型总结再喂给主模型token 直接降一个量级把图片下载到本地并记录尺寸HTML 排版稳定很多给 HTML Agent 加一个自动评估步骤用多模态模型看渲染截图判断布局有没有崩这样迭代快得多。Agent 模式的好处是省工程坏处是不可控prompt 写得再细产出也像开盲盒。所以评估标准一定要提前定义好最好能自动化。这套东西我断断续续搞了一两个月大部分时间花在调 prompt 和排错上代码本身反而不多。如果你要长期跑这类编码和 Agent 任务Coding Plandeep linkhttps://taotoken.net/coding-plan?utm_sourcetaotoken_aicg_blog_endutm_contentcoding_planutm_campaignrewrite 比按量付费更划算。想先验证模型效果就去模型对话页面发几条测试。配置过程中卡住了接入文档和 API Keys 页面是你最该先看的两个地方。最后留一个实用技巧每次改完 prompt别急着跑全流程先用一页内容做单页测试确认 HTML 渲染没问题再跑整份。这样迭代一轮只要几十秒比跑完整流程快十倍。
