快速开始
1. 前期准备
先在管理控制台完成前端 SDK 集成的应用配置（repoId、三方应用接口地址、开启前端 SDK 集成并配置密钥等），详见：前期准备。
建议同时阅读：重要术语，明确 repoId、docId、context 等约束。
2. 实现下载/保存回调接口
前端 SDK 集成模式下，你需要提供文件下载与保存接口，并在初始化配置里通过 repoConfig.downloadUrl / repoConfig.uploadUrl 传入：
提醒：下载接口响应头不要包含
Content-Encoding: gzip（见获取文件回调文档中的注意事项）。
3. 后端生成 initConfig 并签名 token
业务系统后端需要生成一份 initConfig（包含 userinfo、meta、openConfig、repoConfig、documentServerAddr 等），并用管理控制台配置的 secret 签名生成 token（HS256 JWT）。
签名规则与示例见：签名；字段结构说明见：配置。
注意：
secret/token必须在后端生成与保管，避免在前端泄漏。
4. 页面中引入 SDK 并挂载
在业务系统页面中引入中台提供的 sdk.js，然后调用 ZOfficeSDK.mount() 挂载在线编辑/预览页面（iframe 方式）。完整示例可参考：编辑示例。
下面挂载示例（用你的后端返回的 initConfig 替换示例对象即可）：
<!DOCTYPE html>
<html style="height: 100%;">
<head>
<meta charset="UTF-8" />
<title>FrontSDK Quickstart</title>
<script src="sdk.js"></script>
<style>
html, body { height: 100%; margin: 0; padding: 0; overflow: hidden; }
</style>
</head>
<body>
<div id="frameholder" style="height: 100%;"></div>
<script>
// TODO: 由你的业务系统后端生成并返回
const initConfig = {
userinfo: { id: "user", display_name: "user", email: "user@example.com" },
meta: {
id: "docId",
name: "demo.docx",
modified_at: "2025-11-18T10:41:52.12Z",
created_by: { id: "user", name: "user", email: "user@example.com" },
permissions: { read: true, write: true }
},
repoConfig: {
id: "repoId",
downloadUrl: "http://my.integration.com/v2/context/docId/content",
uploadUrl: "http://my.integration.com/v2/context/docId/content",
params: { "x-param-1": "aaa" }
},
openConfig: { action: "edit" },
documentServerAddr: "http://zoffice_hostname:8001/docs",
token: "YOUR_SIGNED_JWT_TOKEN"
};
ZOfficeSDK.mount(initConfig, "#frameholder");
</script>
</body>
</html>