开发与配置
先确认应用可独立访问,再按选定方式接入 Console。本文使用平台公开协议,所有适配代码均在应用自己的仓库中实现。
配置应用入口
进入“应用管理 → 应用发布信息”,填写以下内容并保存草稿。
| 字段 | 填写说明 |
|---|---|
| 访问地址 | 应用自己的 HTTPS 业务入口,跳转和内置均须保留 |
| 打开方式 | 默认跳转;完成适配后选择隔离 iframe 或受信 qiankun 直挂 |
| Manifest 地址 | 内置必填;与访问地址同 Origin,匿名可读的 HTTPS JSON 地址 |
跳转方式无需容器 SDK。选择内置后,保存会自动排队检查公开 Manifest 和资源摘要;页面显示结果,失败时保留草稿并可重新检查。
按打开方式接入
| 方式 | 应用需要实现 | 配置与运行结果 |
|---|---|---|
| 跳转 | 独立网页、自有登录与业务路由 | 配置访问地址;客户在应用自己的页面使用 |
| 隔离 iframe | 独立网页之外,再交付下方 Manifest、容器与生命周期 | 选择隔离 iframe;业务代码在应用自己的 Origin 内运行 |
| 受信 qiankun 直挂 | 复用内置制品与生命周期;API、会话和资源显式指向应用自己的 Origin | 选择受信直挂;经独立审核并正式发布后,业务 DOM 直接挂载到 Console |
iframe 和直挂共用公开协议,但安全边界、审核条件与验收分别处理。第三方无需接入内部微应用 Registry,也不向 Console 提交业务代码或应用专属路由。
准备内置制品
下载公开 Manifest Schema、TypeScript 协议与容器 SDK。将两个 TypeScript 文件加入应用自己的构建,使用 qiankun@2.10.16。
{
"schema_version": "1.0",
"runtime": "qiankun",
"artifact_version": "1.0.0",
"entry": "/embedded/1.0.0/entry.html",
"container": "/embedded/1.0.0/container.html",
"assets": [
{ "path": "/embedded/1.0.0/entry.html", "sha256": "<64位小写SHA256>" },
{ "path": "/embedded/1.0.0/container.html", "sha256": "<64位小写SHA256>" }
]
}assets 须完整列出实际运行制品,包括脚本、样式和容器。示例摘要是占位值,发布前按实际响应字节计算。路径必须为同 Origin 的绝对路径,不带参数或片段。使用不可变版本地址;字节变化后重新检查并发布。
在应用自己的 Origin 容器中调用 startThirdPartyContainer,传入本应用身份、环境、已登记宿主、Manifest 路径/摘要、挂载 ID 和 DOM 容器;参数类型以下载的 SDK 为准。应用身份与允许的宿主来源由应用自己的服务端配置提供。
适配生命周期与业务界面
| 生命周期 | 应用职责 |
|---|---|
bootstrap | 初始化独立应用资源 |
mount | 直接显示业务界面;已有会话时进入业务页 |
update | 接收主题和语言变化,更新展示 |
unmount | 清理 DOM、监听器、定时器及其他资源 |
生命周期返回 Promise。HTML 声明 UTF-8。使用 host.path 作为站内路径,使用 host.applicationOrigin 构造应用自己的请求地址,避免相对 API 请求落到宿主。直挂可通过自身 Origin 的隐藏传输帧维护应用 BFF 请求和会话。
应用不重复展示门户导航、宣传页或登录中转页。保留应用自己的业务导航,适配工作区尺寸、明暗主题和语言。
配置安全与登录
- 容器的
frame-ancestors只允许已登记的 Console Origin;避免用X-Frame-Options阻止该宿主。 - 容器核验启动片段的
parent_origin、manifest_sha256、mount_id。桥接同时校验精确 Origin、event.source、应用、环境和挂载 ID;拒绝未知字段与旧挂载消息。 - 采用
listening → initialize → ready握手。初始化仅传递语言、主题与站内路径;后续按协议处理上下文、站内导航、未保存提示和卸载。 - 登录沿用应用自己的 BFF 和 OAuth/PKCE。需要授权时,由用户明确操作打开登录窗口;会话失效时在应用中提示重新登录。
- 桥接不传递平台 Token、Cookie、会话或通用 API 代理。Secret 仅保存在应用服务端。
受信直挂必须接受独立安全审核,不能靠制品检查自动获得信任。
处理订阅付款与回跳
应用的打开方式与平台商业页的嵌入方式分别配置。例如,应用已在 Console 内置时,其内容仍可嵌入平台定价或订阅组件;付款页面须在独立顶层窗口打开。
- 按订阅与支付指南处理已校验的
goodvision.customer-billing.checkout_started。跳转应用可沿独立页继续;内置应用保留原 Console 和应用挂载,提示用户点击“继续付款”打开原checkout_url,不能把应用 iframe 导航到收银台。 - 使用平台提供的原付款 URL;仅接受已公布的支付服务商 HTTPS 来源,不自行拼接金额或
return_url。弹窗受阻时重试原付款,不再创建订单。 - 付款返回应用已登记入口后,由应用自己的窗口通信恢复原挂载。回执核验精确来源 Origin、原付款 Window、随机关联值及应用/环境;仅允许配置过的宿主来源,拒绝通配 Origin、任意返回地址和迟到回执。此通信由应用实现,不是平台新增支付消息。
- 成功、取消或用户手动关闭付款窗口后,在原应用调用公开的
host.navigate('/app/subscription')并重新读取平台状态。回跳参数和窗口消息只触发查询,不改变订单或权益。卸载/切换上下文后清理监听器与定时器,不能恢复旧挂载。
若浏览器或支付服务商切断窗口通信,提示用户返回原 Console 并重新查询;不能以未收到回执推断支付失败或发起新购。独立访问仍回应用独立页,内置访问应留在原 Console 的应用订阅页。
下一步:在真实 PC 浏览器中测试。