提示

获取code请参考鉴权

UI 接入 ​

预装版（UI 版本）适合希望快速嵌入完整 AiPPT 生成、编辑和下载能力的接入方。接入方负责在服务端获取授权 code，前端通过 iframe SDK 打开 AiPPT 页面。

本文边界 ​

本页只说明最小可用接入：获取 code、引入 SDK、创建 iframe、处理初始化错误和销毁 iframe。功能板块、默认页面、场景鉴权、自定义创建、下载模式等配置请阅读 UI 配置。

如果还不确定应该默认进入作品列表、AI 任务生成页、编辑器，还是使用自定义创建，请先阅读 业务流程图。

接入前检查 ​

检查项要求
开放平台凭证已获取 App Key 和 Secret Key
授权凭证服务端已按 鉴权 获取 code
页面容器前端页面已准备 iframe 挂载容器
安全配置页面不能设置 referrer=no-referrer
事件处理如需感知生成、保存、下载等行为，需实现 onMessage 并阅读 事件通知

引入JS ​

js
  <script src="https://api-static.aippt.cn/aippt-iframe-sdk.js"></script>

安全警告

由于AIPPT自身安全机制问题，开发者请不要在HTML中设置以下条件，否则会导致AIPPT初始化页面异常。

html
 <meta name="referrer" content="no-referrer">

接入SDK ​

html
<!DOCTYPE html>
<html lang="en">

<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>AiPPT</title>
  <script src="https://api-static.aippt.cn/aippt-iframe-sdk.js"></script>
  <style>
    #container {
      width: 100vh;
      height: 90vh;
    }
  </style>
</head>

<body>
  <button id="del">删除iframe</button>
  <div id="container"></div>
  <script>
    (async () => {
      try {
        await AipptIframe.show({
          appkey: '',
          channel: '根据调用鉴权功能，获取code接口的channel传参保持一致',
          code: '',
          container: document.getElementById('container'),
          editorModel: true,
          onMessage(eventType, data) {
            console.log(eventType, data)
          }
        })
      } catch (e) {
        /*
          如果初始化code信息失效，请在此处捕捉错误信息
          e: {
            code: number
            data: null
            msg: string | "code已过期"
          }
        */

      }
    })()

    const del = document.getElementById('del');
    del.addEventListener('click', () => {
      AipptIframe.deleteIframe();
    })
  </script>
</body>

</html>

接入成功标准 ​

  1. 页面能成功加载 AiPPT iframe。
  2. code 过期或无效时，前端能捕获错误并提示重新获取。
  3. 用户能进入预期页面，例如作品列表、AI 任务生成页或编辑 PPT 页面。
  4. 需要业务联动时，接入方能通过 onMessage 收到关键事件。

下一步 ​

  • 阅读 业务流程图，确认默认进入、UI 自定义创建或 API 自定义创建的入口选择。
  • 阅读 UI 配置，配置功能板块、下载、场景鉴权和路由。
  • 阅读 事件通知，处理 iframe 内部行为通知。
  • 阅读 事件推送，配置保存 PPT 等推送回调。