Skip to content

UI 业务流程图

预装版 UI 的分工很明确:接入方负责服务端鉴权和宿主页面,iframe 负责生成、编辑与下载。宿主通过配置决定入口,通过消息感知结果。

宿主与 iframe 的职责边界

先把预装版 UI 理解成“接入方页面里的完整 AiPPT 工作区”:接入方负责用户体系、服务端鉴权和宿主页面交互,iframe 内负责生成、编辑、模板选择、下载等产品流程。

你要确认的事看哪里结论
用什么凭证打开 UI服务端鉴权段使用 /api/grant/code 获取 code,不要使用拼装版 API 的 token
打开后进入哪个页面页面入口段通过 routerOptions 进入作品列表、生成页或编辑器
是否要跳过默认入口自定义创建段通过 options.custom_generate 传入标题、文件、参考文档或已有任务
生成和编辑完成后怎么联动业务事件段通过 onMessage 接收保存、下载、错误、场景鉴权等通知

最小接入流程

  1. 服务端按 UI 鉴权 获取 code
  2. 前端引入 https://api-static.aippt.cn/aippt-iframe-sdk.js
  3. 调用 AipptIframe.show,传入 appkeycodechannelcontaineronMessage
  4. 按业务需要补充 routerOptionsoptions.custom_generate
  5. 监听关键事件,至少处理初始化失败、保存、下载和场景鉴权结果。

按问题查文档,不必顺序通读

接入配置由入口选择、能力配置和事件处理三部分组成:

顺序页面适合解决的问题
1业务流程图先确认 UI 版本整体链路、三类入口和关键事件边界
2接入完成 code 获取、SDK 引入和 AipptIframe.show 初始化
3配置配置功能板块、下载、场景鉴权、页面入口和自定义创建
4事件通知处理 iframe 通知宿主页面的路由、生成、保存、下载、错误和鉴权消息
5事件推送宿主页面主动向 iframe 发送操作,例如触发保存
6更新日志判断版本变化是否影响配置项、事件解析或接入逻辑

入口决策

入口配置方式进入后由谁继续推进典型后续
默认进入routerOptions.listrouterOptions.generaterouterOptions.editor用户在 iframe 页面内继续操作作品列表、AI 任务生成页或指定作品编辑器
UI 自定义创建options.custom_generate.type + content / File / referListUI 版本根据初始化内容创建任务进入编辑大纲;粘贴 Markdown 可按 step=2 直接进模板选择
API 自定义创建options.custom_generate.taskId + stepAPI 已创建任务,UI 版本继续展示该任务step=1 编辑大纲,step=2 选择模板,step=3 直接合成 PPT

主流程

阶段关键动作相关配置或事件
接入鉴权服务端使用 AK/SK 获取 code,前端引入 aippt-iframe-sdk.jsUI 鉴权UI 接入
初始化 iframe调用 AipptIframe.show,传入 appkeycodechannelcontaineronMessageUI 接入
初始化配置按业务需要配置功能板块、下载模式、场景鉴权、自定义创建和默认路由UI 配置
页面入口分为默认进入、UI 自定义创建、API 自定义创建三类入口routerOptionscustom_generate
生成流程用户选择标题、文件、Markdown、参考文档、单页等方式生成大纲和内容;大纲弹框中可编辑大纲、下一步和下载大纲fc_platecustom_generate.typeOUTLINE_CONFIRMOUTLINE_DOWNLOAD
场景鉴权开启 scene_auth 后,iframe 在指定场景发出 SCENE_AUTH,接入方调用 sceneAuthContinue 决定是否继续SCENE_AUTHAipptIframe.sceneAuthContinue
作品处理选择模板并合成新作品,合成成功后可进入编辑器继续编辑;进入编辑器后的保存才触发 PPT_SAVEOUTLINE_CONFIRMGENERATE_PPT_SUCCESSPPT_SAVEPPT_DOWNLOAD
宿主交互接入方通过 onMessage 接收通知,通过 setMessage 主动触发保存等动作事件通知事件推送