UniDoc说明中心下载 .udoc
UNIDOC / KNOWLEDGE IN MOTION

嵌入模式简要说明

从理解,到动手实现。步骤、协议与可复制的示例,都在这份文档中。

UniDoc 的嵌入模式由 URL 明确开启,编辑器逻辑、文档格式和宿主通信协议保持不变。

完整接入以 内嵌接入文档 为准,含 URL 参数、请求/响应表、原生包保存、全屏、实时适宽、权限和 可运行示例

入口

http://127.0.0.1:8137/?embed=1
  • 顶层窗口打开:显示一行“开始”编辑工具并隐藏整条底部状态栏;点击 SVG 展开图标可展开完整功能区和状态栏,再次点击返回精简模式。
  • 放入 iframe:首屏是无功能区、无状态栏的 Outlook 式流式编辑画布;第一次点击正文后只显示“开始”,状态栏继续隐藏。
  • embed=1默认流式;embed=0保留旧版分页语义。
  • 也可显式设置embedView=flowembedView=paged
  • embedUi=full可直接以完整功能区启动,主要用于受信宿主或诊断。
  • embedZoom=80 设置初始文档比例;embedFit=width 持续按 iframe 实际宽度适配。
  • 全屏图标与展开功能区图标独立;浏览器全屏需 iframe 设置 allow="fullscreen" / allowfullscreen
  • 内嵌工具栏用 UniDoc 全屏图标替换 ¶;精简且非全屏时禁用内部手动缩放,宿主比例与自动适宽仍生效,退出展开/全屏恢复原比例。宿主 CSS 全屏回退需回传 unidoc:fullscreen-state
<iframe
  src="http://127.0.0.1:8137/?embed=1&embedView=flow"
  title="UniDoc 编辑器">
</iframe>

URL 模板

内置模板:

/?embed=1&template=blank
/?embed=1&template=builtin:meeting
/?embed=1&template=ppt169

内置键为blankppt169ppt43meetingweeklyresume,也可直接传模板中文名。

当前浏览器中用户保存的模板:

/?embed=1&template=user:合同模板
/?embed=1&template=user:0

从 URL 加载自定义 UDOC3 或 UniDoc JSON 模板:

/?embed=1&templateUrl=%2Ftemplates%2Fcontract.udoc&templateName=合同
/?embed=1&templateUrl=https%3A%2F%2Fcdn.example.com%2Ftemplates%2Fletter.udoc

templateUrl只接受http/https。跨域地址必须由模板服务器允许 CORS;UDOC3仍执行目录、尺寸、
哈希和文档类型校验。URL 模板完成或失败后,unidoc:ready才会发给宿主。

iframe 消息

现有unidoc:setunidoc:getunidoc:get-udoc协议不变。新增/补充状态字段:

window.addEventListener('message', event => {
  // frame 为宿主自己的 iframe 元素。
  if (event.origin !== new URL(frame.src).origin || event.source !== frame.contentWindow) return;
  if (event.data?.type === 'unidoc:ready') {
    console.log(event.data.mode);      // passive | home | full
    console.log(event.data.view);      // flow | paged
    console.log(event.data.template.status); // blank | ready | error
  }
  if (event.data?.type === 'unidoc:mode') {
    console.log(event.data.mode);      // home | full
  }
});

同源宿主或自动化还可以使用iframe.contentWindow.UniDocEmbedwake()
setExpanded(boolean)ready。跨域宿主应使用postMessage状态,不直接访问 iframe DOM。