[AEM Assets]{class="badge positive" title="适用于AEM Assets)。"}
内容审查程序安装和属性 content-advisor-installation-properties
Content Advisor还可用于与非Adobe(第三方)应用程序集成,从而将智能资产发现扩展到Adobe应用程序之外。 第三方集成支持相同的丰富功能集,包括AI支持的搜索、上下文感知推荐、基于活动简短的发现、访问Dynamic Media演绎版、内容片段发现、过滤器和资产元数据。
先决条件 prereqs
您必须确保采用以下通信方式:
- 主机应用程序在 HTTPS 上运行。
- 您无法在
localhost上运行此应用程序。 如果要在本地计算机上集成内容审查程序,则需要创建一个自定义域,例如[https://<your_campany>.localhost.com:<port_number>],并在redirectUrl list中添加此自定义域。 - 您可以使用相应的
imsClientId配置 clientID 并将其添加到 AEM Cloud Service 环境变量中。 - 需要在环境配置中定义 IMS 范围列表。
- 该应用程序的 URL 位于 IMS 客户端的重定向 URL 允许列表中。
- 使用 Web 浏览器上的弹出窗口配置和呈现 IMS 登录流。 因此,应在目标浏览器上启用或允许弹出窗口。
如果需要Content Advisor的IMS身份验证工作流,请使用上述先决条件。 或者,如果您已经通过 IMS 工作流程进行身份验证,那么您可以添加 IMS 信息。
- 托管集成应用程序的域名。
- 配置之后,将为您的组织提供
imsClientId、imsScope以及对应于所请求环境的redirectUrl,这些环境对于配置内容审查程序至关重要。 没有这些有效属性,您无法运行安装步骤。
安装 content-advisor-installation
内容顾问可通过ESM CDN(例如,esm.sh/skypack)和UMD版本使用。
在使用 UMD 版本的浏览器中(推荐):
<script src="https://experience.adobe.com/solutions/CQ-assets-selectors/static-assets/resources/assets-selectors.js"></script>
<script>
const { renderAssetSelector } = PureJSSelectors;
</script>
在使用 ESM CDN 版本带有 import maps 支持的浏览器中:
<script type="module">
import { AssetSelector } from 'https://experience.adobe.com/solutions/CQ-assets-selectors/static-assets/resources/@assets/selectors/index.js'
</script>
在使用 ESM CDN 版本的 Deno/Webpack 模块联合中:
import { AssetSelector } from 'https://experience.adobe.com/solutions/CQ-assets-selectors/static-assets/resources/@assets/selectors/index.js'
内容审查程序属性 content-advisor-propertiess
您可以使用内容审查程序属性来自定义内容审查程序的呈现方式。 下表列出了可用于定制和使用“内容指导”的属性。
true,内容顾问将在左边栏视图中呈现。 如果将其标记为false,则内容顾问将在模式视图中呈现。imsOrg密钥来验证您访问的组织是否位于Adobe IMS下。imsToken。apiKey。<Object>[{id: 'urn:234}, {id: 'urn:555'}] 资源必须在当前目录中可用。 如果您需要使用其他目录,请也为 path 属性提供一个值。rail属性一起使用,以启用资产查看器的边栏视图。Object<{ id?: string, defaultMessage?: string, description?: string}>i18nSymbols prop传递您自己的自定义本地化值。 通过此接口传递值将覆盖提供的默认翻译,而改用您自己的翻译。 要执行覆盖,您必须将一个有效的消息描述符对象传递到要覆盖的 i18nSymbols 键。intl.locale 属性提供有效的区域设置字符串来选择翻译语言。 例如: intl={{ locale: "es-es" }}支持的语言环境字符串遵循ISO 639 — 代码以表示语言标准的名称。
支持的区域设置列表:英语 — 'en-us'(默认)西班牙语 — 'es-es'德语 — 'de-de'法语 — 'fr-fr'意大利语 — 'it-it'日语 — 'ja-jp'韩语 — 'ko-kr'葡萄牙语 — 'pt-br'中文(繁体) — 'zh-cn'中文(台湾) — 'zh-tw'
Array<string>{allowList?: Object}default到express之间的内容顾问应用程序。 它还支持@react-spectrum/theme-express。在资源已选定并单击模态上的 Select 按钮时调用资源项数组。 仅在模态视图中调用此函数。 对于边栏视图,请使用 handleAssetSelection 或 onDrop 函数。 示例:
handleSelection=(资源:资源[])=> {…}
有关详细信息,请参阅选择的资源。
在选择或取消选择资源时调用项目数组。 如果您需要在用户选择资源时进行侦听,这会很有用。 示例:
handleAssetSelection=(assets: Asset[])=> {…}
有关详细信息,请参阅选择的资源。
Close 按钮时调用。 这仅在 modal 视图中被调用,在 rail 视图中将被忽略。single 或 multiple 资源选择配置。语法:
aemTierType: "author" "delivery"例如,如果同时使用了
["author","delivery"],则存储库切换器将显示创作和投放选项。EXPIRED、EXPIRING_SOON或NOT_EXPIRED。 请参阅自定义过期的资源。 此外,您可以使用allowSelectionAndDrag,其中函数的值可以是true或false。 如果该值设置为false,则无法在画布上选择或拖动过期的资产。uploadConfig属性下。 添加您为从用户那里收集元数据而提供的字段数组。 使用此属性,您还可以使用自动分配给资源但用户不可见的隐藏元数据。uploadConfig属性下。 它包含property和value。 Property等于从 metadataSchema 传递的字段mapToProperty,该字段的值正在更新。 而,value等于提供的新值作为输入。"/content/dam"uploadConfig属性下。 默认为资源存储库根目录的文件目标上传路径。uploadConfig属性下。(uploadInfo: UploadInfo) => void。 此属性嵌套在uploadConfig属性下。sourceTypes使用要启用的导入源数组。 支持的源为Onedrive和Dropbox。 语法为{ sourceTypes?: ImportSourceType[]; apiKey?: string; }。 此外,此属性嵌套在uploadConfig属性下。(uploadStats: UploadStats) => void。 此外,此属性嵌套在uploadConfig属性下。uploadConfig属性下。 它是一个回调函数,用于在文件更改时显示上载行为。 它会传递挂起的待上传文件的新数组以及上传的源类型。 如果发生错误,Source类型可以为null。 语法为(newFiles: File[], uploadType: UploadType) => void{ href: string; alt: string; },此外,此属性嵌套在uploadConfig属性下。featureSet:[ ]属性用于启用或禁用内容审查程序应用程序中的特定功能。 要启用组件或功能,您可以在数组中传递字符串值,或者将数组留空以禁用添加的功能,而只具有基本功能。 例如,要在内容审查器中启用上载功能,请使用语法featureSet:["upload"]。 同样,您可以使用featureSet:["content-fragments"]在内容顾问中启用内容片段。 要同时使用多个功能,语法为featureSet:["upload"、"content-fragments"]。ImsAuthProps ims-auth-props
ImsAuthProps属性定义内容顾问用于获取imsToken的身份验证信息和流程。 通过设置这些属性,您可以控制身份验证流程的行为方式,并为各种身份验证事件注册侦听器。
imsClientIdimsScoperedirectUrlredirectUrl,ImsAuthService将使用用于注册imsClientId的redirectUrlmodalModetrue,则身份验证流程将在弹出窗口中显示。 如果设置为false,则身份验证流程将以整页重新加载方式显示。 _Note :_为获得更好的UX,如果用户禁用了浏览器弹出窗口,则可以动态控制此值。onImsServiceInitializedservice,该参数是表示Adobe IMS服务的对象。 有关更多详细信息,请参阅ImsAuthService。onAccessTokenReceivedimsToken时调用的回调函数。 此函数接受一个参数imsToken,该参数是一个表示访问令牌的字符串。onAccessTokenExpiredonErrorReceivedImsAuthService ims-auth-service
ImsAuthService类用于处理内容顾问的身份验证流程。 它负责从Adobe IMS身份验证服务获取imsToken。 imsToken用于对用户进行身份验证并授权作为Cloud Service Assets存储库访问Adobe Experience Manager。 ImsAuthService使用ImsAuthProps属性来控制身份验证流并注册各种身份验证事件的侦听器。 您可以使用方便的registerAssetsSelectorsAuthService函数向内容顾问注册 ImsAuthService 实例。 ImsAuthService类中有以下函数可用。 但是,如果您使用 registerAssetsSelectorsAuthService 函数,则无需直接调用这些函数。
isSignedInUsergetImsTokenimsToken,该身份验证可用于验证其他服务(如生成资产_rendition)的请求。signInImsAuthProps在弹出窗口或全页重新加载中显示身份验证signOutrefreshTokencontentFragmentSelectorProps content-fragment-selector-properties
contentFragmentSelectorProps允许您配置如何在内容审查器中访问和显示内容片段。 通过启用featureSet中的内容片段功能并提供所需的配置,您可以将内容片段选择与资产无缝集成。 这使用户能够在同一统一界面中浏览、搜索和选择内容片段,从而确保跨资产和结构化内容的一致内容选择体验。
const assetSelectorProps = {
featureSet: [
'upload', /* Include upload or other featureSet values to ensure no missing functionality */
'content-fragments', /* Content Fragments pill will be shown */
],
contentFragmentSelectorProps: {
/* Configures the Content Fragments Pill experience */
/* ...props @aem-sites/content-fragment-selector MFE supports */
}
}
<AssetSelector {...assetSelectorProps} />
在contentFragmentSelectorProps中,您可以提及内容片段选择器属性中可用的任何属性。
有关如何将Content Advisor与Angular、React和JavaScript应用程序集成的信息,请参阅Content Advisor集成示例。