UI可扩展性概述
UI可扩展性允许您将自定义逻辑和UI(用户界面)引入Adobe Workfront Fusion。 通过使用Adobe App Builder,您可以修改组织的Workfront Fusion体验以更好地满足组织的需求,同时仍可依靠Fusion的核心功能。
本文概述了UI的可扩展性以及您的自定义扩展与Workfront Fusion的通信方式。
扩展结构
主持人和嘉宾
Fusion可以显示非Workfront Fusion团队创建的UI。 为确保这些UI更改不会影响Fusion的核心功能,UI在其自己的独立浏览器框架(<iframe>)中运行,与Fusion的代码完全不同。
- 主机: 包含扩展的应用程序。 此处是Fusion。 主机可决定扩展可以出现的位置以及它将与它们共享的数据。
- 来宾: 您的扩展。 它是主机加载到iframe中的小型Web应用程序。
创建UI扩展时,不会修改Fusion。 您可以生成并发布访客,在发布访客后,Fusion可以使用该访客。
下面的技术
您的来宾采用了两种Adobe技术:
- Adobe App Builder:适用于小型Web应用和无服务器操作的免费托管和工具平台。 您的扩展是一个App Builder应用程序。 App Builder为您提供了一个托管UI(在Adobe的
*.adobeio-static.net内容交付网络上)的位置,以及一个名为aio的命令行工具来创建、构建和发布它。 - Adobe UI可扩展性SDK (UIX):允许主持人和来宾通话的库。 您将使用您这边的一个包
@adobe/uix-guest。 Fusion在其一侧使用匹配的@adobe/uix-host包。
扩展点
扩展点是主机中允许出现来宾的名为“slot”。 Fusion定义其版块,您可以选择访客使用哪个版块。
扩展点名称由三部分组成: service/name/version。
Fusion提供了以下扩展点:
fusion/nav-organization/1fusion/nav-team/1fusion是服务 (产品, Fusion)。nav-organization/nav-team是名称(特定插槽)。1是版本。
一个扩展可以实施一个扩展点,也可以同时实施两个扩展点。 大多数扩展只使用一点。
Fusion会根据选择的扩展点向匹配导航部分添加一个带有扩展标题的按钮。 单击该链接会在Fusion的主内容区域中打开一个专用页面,并在该处加载您的UI。
UI扩展中包含的框架
当Fusion加载来宾时,扩展将在 两个 帧中运行:
- 注册帧(不可见)。 首先在后台运行。 注册框架可告知Fusion您的扩展提供了哪些功能。 例如,它可能表示它具有一个仪表板小组件,并发送该小组件的标题及其UI的URL。 注册帧通过调用
register(...)来执行此操作。 它不会呈现可见的UI。 - UI框架(可见)。 这是Fusion向用户显示的页面。 它必须通过调用
attach(...)向主机宣布自身。 如果它从未调用attach,则Fusion会等待并最终因错误而超时。
此示例显示了用户单击扩展按钮时的流程。
-
已单击按钮。
-
Fusion将加载REGISTRATION框架(隐藏)。
code language-none register({ methods: { dashboard: { getWidget() {...} } } })getWidget()返回您可见UI的URL -
Fusion将在该URL处加载您的UI框架(可见)。
code language-none attach({ id })此项为必需,否则Fusion将超时
-
Fusion发送上下文,您的UI呈现。
构建UI时,将编写两个框架。 重要的是要记住,可见页面 必须 调用attach。
有关生成UI的详细信息,请参阅生成自定义扩展UI。
Fusion中的上下文
附加扩展后,Fusion将与您的来宾共享context对象。 主库文件包含:
- 用户:登录用户的Fusion配置文件和Adobe IMS用户ID。
- 组织:活动组织的完整Fusion组织记录和Adobe IMS组织ID。
- 团队:活动团队(如果适用)。
- Adobe IMS访问令牌:如有必要,这将代表用户调用Adobe或Fusion API。
Fusion还会推送更新。 例如,如果用户在UI打开时切换组织或团队,则Fusion会发送新上下文,以便UI能够立即做出反应。
有关上下文字段的完整列表,请参阅Fusion上下文引用。
创建UI扩展
要创建UI扩展,请执行以下步骤:
要开始此过程,请转到设置您的工具和Adobe帐户。