PaaS 工作流 SDK

把 PaaS 的工作流编辑器作为原生 Web Component 嵌进任意前端项目。不是 iframe —— 编辑器原生渲染在你的页面里，组件直连 PaaS API。

原生 Web Component框架无关零 iframenpm 可装~360KB gzip

1. 安装

方式 A：npm

# 私有 registry 或本地 tarball
npm install paas-workflow-sdk
# 或 npm install ./paas-workflow-sdk-0.1.0.tgz

import "paas-workflow-sdk"; // 注册 <paas-workflow> 自定义元素

方式 B：CDN <script>（任意框架 / 原生 HTML）

<script type="module" src="https://sdk.zyntos.net/paas-workflow.js"></script>

2. 使用

引入后，在页面任意位置写这个标签即可（React / Vue / Angular / 原生 HTML 通用）：

<paas-workflow
  workflow-id="<画布ID>"
  base-url="https://paas-api.zyntos.net"
  token="<短效 token>"
  style="display:block;width:100%;height:100vh">
</paas-workflow>

3. 鉴权（两种）

方式	属性	说明
短效 token （生产推荐）	`token`	你的后端用 `sk-paas-` 换一个短效 scoped token，前端只拿 token。长效密钥不出服务器。
API Key 直传（仅可信/内部）	`api-key`	直接传 `sk-paas-`。⚠️ 长效密钥暴露在前端，可被盗用刷量，勿用于公开页。

换取短效 token（你的后端调一次）

// host 后端，sk-paas- 不出服务器
const { token } = await fetch(
  "https://paas-api.zyntos.net/api/v1/paas/api-keys/embed-token",
  { method:"POST",
    headers:{ Authorization:`Bearer ${SK_PAAS}`, "Content-Type":"application/json" },
    body: JSON.stringify({ ttl_seconds: 900 }) }   // 60~3600,默认 900
).then(r => r.json());
// → { token, expires_in, expires_at, scopes }；token 交给前端 <paas-workflow>

子 token 的 scopes 自动取调用方 sk-paas- 的子集，过期即失效，无需手动吊销。请求体只接受 ttl_seconds / scopes，不含 workflow_id（按租户+scope 授权，不绑单个工作流）。

4. 属性 & 事件

属性	必填	说明
`workflow-id`	是	画布 ID（在 PaaS 控制台创建工作流后获得）
`base-url`	是	PaaS API 网关，如 `https://paas-api.zyntos.net`
`token` / `api-key`	二选一	短效 token（推荐）或 `sk-paas-` 密钥

const el = document.querySelector("paas-workflow");
el.addEventListener("paas:ready", e => console.log("ready", e.detail.workflowId));

5. 前置条件

1	租户在 PaaS 控制台签发一个 `sk-paas-` API Key，含 `paas:read` / `paas:write` / `paas:aigc:generate` scope。
2	已建好一个工作流画布，拿到 `workflow-id`。
3	PaaS 网关放行画布 API（`/api/v1/paas/canvas/*`）与模型列表，并对第三方域名开 CORS（已默认开启）。