微前端資產選擇器 Overview

Last update: Wed Oct 09 2024 00:00:00 GMT+0000 (Coordinated Universal Time)

建立對象：

管理員
使用者

搜尋最佳實務

中繼資料最佳實務

Content Hub

具有OpenAPI功能的Dynamic Media

AEM Assets開發人員檔案

微前端資產選擇器提供一個輕鬆整合 Experience Manager Assets 存放庫的使用者介面，讓您可以瀏覽或搜尋存放庫中的可用數位資產，並用於您的應用程式編寫體驗。

在您的應用程式體驗中可利用資產選擇器套件使用微前端使用者介面。套件的任何更新都會自動匯入，而最新部署的資產選擇器會自動載入到您的應用程式。

資產選擇器提供了許多優點，例如：

使用Vanilla JavaScript程式庫輕鬆與任何Adobe或非Adobe應用程式整合。
容易維護，因為資產選擇器套件的更新會自動部署到您的應用程式可用的資產選擇器。您的應用程式無需更新即可載入最新的修改內容。
簡易的自訂功能，因為有可以控制應用程式中資產選擇器顯示的可用屬性。
全文搜尋、開箱即用和自訂篩選器，可快速找到要在編寫體驗中使用的資產。
能夠在 IMS 組織內切換存放庫以選擇資產。
可依名稱、維度和大小排序資產，並在「清單」、「格線」、「收藏館」或「瀑布」檢視中檢視資產。

先決條件 prereqs

您必須確定下列通訊方法：

應用程式正在HTTPS上執行。
應用程式的URL位於IMS使用者端的允許重新導向URL清單中。
IMS登入流程已設定完畢，並使用網頁瀏覽器上的快顯視窗呈現。因此，目標瀏覽器上應該啟用或允許快顯視窗。

如果您需要Asset Selector的IMS驗證工作流程，請使用上述先決條件。或者，如果您已通過IMS工作流程驗證，您可以改為新增IMS資訊。

檢視更多

IMPORTANT

此存放庫旨在作為補充檔案，說明整合資產選擇器的可用API和使用範例。在嘗試安裝或使用「資產選擇器」之前，請確保貴組織已布建對「資產選擇器」的存取權，作為Experience Manager Assetsas a Cloud Service設定檔的一部分。如果您尚未布建，則無法整合或使用這些元件。若要請求布建，您的程式管理員應從Admin Console提出標示為P2的支援票證，並包含下列資訊：

託管整合應用程式的網域名稱。
布建後，您的組織將會收到imsClientId、imsScope以及對應到設定資產選擇器所需必要環境的redirectUrl。如果沒有這些有效的屬性，您就無法執行安裝步驟。

安裝 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>

在具備 import maps 支援並使用 ESM CDN 版 的瀏覽器中：

<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 Module Federation 中：

import { AssetSelector } from 'https://experience.adobe.com/solutions/CQ-assets-selectors/static-assets/resources/@assets/selectors/index.js'

使用資產選擇器 using-asset-selector

在資產選擇器設定完成後，且您以 Adobe Experience Manager as a Cloud Service 應用程式使用資產選擇器完成身分驗證，則您可以選擇資產或執行各種其他操作，以便在存放庫中搜尋您的資產。

using-asset-selector

A：隱藏/顯示面板
B：存放庫切換器
C：資產
D：篩選器
E：搜尋列
F：排序
G：按遞增或遞減順序排序
H：視圖

隱藏/顯示面板 hide-show-panel

若要隱藏左側導覽中的資料夾，請按一下 隱藏資料夾 圖示。要還原變更，請再按一下 隱藏資料夾 圖示。

存放庫切換器 repository-switcher

Asset Selector也可讓您切換資產選取的存放庫。您可以從左側面板中的下拉清單中選擇您要的存放庫。下拉清單中可用的存放庫選項是根據repositoryId index.html檔案中定義的屬性。其基礎是登入使用者存取之所選IMS組織的環境。消費者可以傳遞一個偏好的repositoryID，而且在該情況下，資產選擇器將停止呈現 repo 切換器，並僅從指定的存放庫呈現資產。

資產存放庫

那是可用於執行操作的資產資料夾集合。

現成可用篩選器 filters

資產選擇器也提供現成可用的篩選器選項，以調整您的搜尋結果。您可以使用以下篩選器：

狀態： 包含all、approved、rejected或no status之間的資產目前狀態。
檔案型別： 包含folder、file、images、documents或video。

到期狀態： 根據資產的到期持續時間提及該資產。您可以勾選「Expired」核取方塊以篩選過期的資產；或設定資產的Expiration Duration以根據資產的到期持續時間顯示資產。當資產已過期或即將過期時，畫面會顯示相同的徽章。此外，您可以控制是否允許使用（或拖放）過期的資產。深入瞭解自訂過期的資產。依預設，會針對未來30天內到期的資產顯示 即將到期 徽章。不過，您可以使用expirationDate屬性來設定到期日。

note tip
TIP
若要根據資產的未來到期日檢視或篩選資產，請在「`Expiration Duration`」欄位中提及未來日期範圍。它會顯示具有即將到期徽章的資產。