Selettore risorse micro front-end Overview

Il Selettore risorse micro front-end fornisce un’interfaccia utente che si integra facilmente con l’archivio di Experience Manager Assets in modo da poter sfogliare o cercare le risorse digitali disponibili nell’archivio e utilizzarle nell’esperienza di authoring dell’applicazione.

L’interfaccia utente micro front-end è resa disponibile nell’esperienza dell’applicazione utilizzando il pacchetto Selettore risorse. Eventuali aggiornamenti al pacchetto vengono importati automaticamente e l’ultimo Selettore risorse implementato viene caricato automaticamente all’interno dell’applicazione.

Panoramica

Il Selettore risorse offre molti vantaggi, tra cui:

  • Semplicità di integrazione con le applicazioni Adobe o non Adobe che utilizzano la libreria Vanilla JavaScript.
  • Facile manutenzione poiché gli aggiornamenti al pacchetto Selettore risorse vengono automaticamente distribuiti nel selettore risorse disponibile per l’applicazione. Non sono necessari aggiornamenti all’interno dell’applicazione per caricare le modifiche più recenti.
  • Facilità di personalizzazione grazie alle proprietà disponibili che controllano la visualizzazione del Selettore risorse all’interno dell’applicazione.
  • Filtri di ricerca full-text, predefiniti e personalizzati per passare rapidamente alle risorse da utilizzare nell’esperienza di authoring.
  • Possibilità di cambiare archivi all’interno di un’organizzazione IMS per la selezione delle risorse.
  • Possibilità di ordinare le risorse per nome, dimensioni e dimensioni e di visualizzarle in visualizzazione Elenco, Griglia, Raccolta o Cascata.

Prerequisiti prereqs

Devi accertarti di utilizzare i seguenti metodi di comunicazione:

  • L'applicazione è in esecuzione su HTTPS.
  • L’URL dell’applicazione si trova nell’elenco Consentiti degli URL di reindirizzamento del client IMS.
  • Il flusso di accesso IMS viene configurato e renderizzato utilizzando un pop-up sul browser web. Pertanto, i popup devono essere abilitati o consentiti nel browser di destinazione.

Se hai bisogno del flusso di lavoro di autenticazione IMS di Asset Selector, utilizza i prerequisiti precedenti. In alternativa, se sei già autenticato con il flusso di lavoro IMS, puoi aggiungere le informazioni IMS.

Ulteriori informazioni

IMPORTANT
Questo archivio funge da documentazione supplementare che descrive le API disponibili e alcuni esempi di utilizzo per l’integrazione di Asset Selector. Prima di installare o utilizzare il Selettore risorse, assicurati che all’organizzazione sia stato fornito l’accesso al Selettore risorse come parte del profilo Experience Manager Assets as a Cloud Service. Se non è stato eseguito il provisioning di, non è possibile integrare o utilizzare questi componenti. Per richiedere il provisioning, l’amministratore del programma deve generare un ticket di supporto contrassegnato come P2 dall’Admin Console e includere le seguenti informazioni:
  • Nomi di dominio in cui è ospitata l’applicazione che integra.
  • Dopo il provisioning, all'organizzazione verranno forniti imsClientId, imsScope e un redirectUrl corrispondenti agli ambienti richiesti che sono essenziali per la configurazione di Asset Selector. Senza tali proprietà valide, non è possibile eseguire i passaggi di installazione.

Installazione installation

Il selettore risorse è disponibile tramite CDN ESM (ad esempio, esm.sh/skypack) e versione UMD.

Nei browser che utilizzano la versione UMD (scelta consigliata):

<script src="https://experience.adobe.com/solutions/CQ-assets-selectors/static-assets/resources/assets-selectors.js"></script>

<script>
  const { renderAssetSelector } = PureJSSelectors;
</script>

Nei browser con supporto di import maps che utilizzano la versione ESM CDN:

<script type="module">
  import { AssetSelector } from 'https://experience.adobe.com/solutions/CQ-assets-selectors/static-assets/resources/@assets/selectors/index.js'
</script>

Nella federazione di moduli Deno/Webpack utilizzando la versione ESM CDN:

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

Utilizzo del Selettore risorse using-asset-selector

Dopo aver configurato il Selettore risorse ed aver effettuato l’autenticazione per utilizzarlo con l’applicazione Adobe Experience Manager as a Cloud Service, puoi selezionare le risorse o eseguire varie altre operazioni per cercare le risorse all’interno dell’archivio.

using-asset-selector

Nascondi/Mostra pannello hide-show-panel

Per nascondere le cartelle nel menu di navigazione a sinistra, fare clic sull'icona Nascondi cartelle. Per annullare le modifiche, fai di nuovo clic sull’icona Nascondi cartelle.

Selettore archivio repository-switcher

Asset Selector consente inoltre di cambiare archivi per la selezione delle risorse. Puoi selezionare l’archivio desiderato dal menu a discesa disponibile nel pannello a sinistra. Le opzioni dell’archivio disponibili nell’elenco a discesa si basano sulla proprietà repositoryId definita nel file index.html. Si basa sull’ambiente dell’organizzazione IMS selezionata a cui accede l’utente connesso. I consumatori possono trasmettere un repositoryID preferito e, in tal caso, il Selettore risorse interrompe il rendering del selettore archivio ed esegue il rendering solo delle risorse dall’archivio specificato.

Archivio risorse

Si tratta di una raccolta di cartelle di risorse che puoi utilizzare per eseguire le operazioni.

Filtri predefiniti filters

Il Selettore risorse fornisce anche opzioni di filtro predefinite per perfezionare i risultati della ricerca. Sono disponibili i seguenti filtri:

  • Stato: include lo stato corrente della risorsa tra all, approved, rejected o no status.

  • Il tipo di file: include folder, file, images, documents o video.

  • Stato scadenza: fa riferimento alle risorse in base alla relativa durata di scadenza. È possibile selezionare la casella di controllo Expired per filtrare le risorse scadute oppure impostare Expiration Duration per visualizzare le risorse in base alla loro durata di scadenza. Quando una risorsa è già scaduta o sta per scadere, viene visualizzato un badge che illustra la stessa situazione. Inoltre, puoi controllare se consentire l’utilizzo (o il trascinamento) di una risorsa scaduta. Ulteriori informazioni su personalizzare le risorse scadute. Per impostazione predefinita, il badge In scadenza viene visualizzato per le risorse che scadono nei successivi 30 giorni. È tuttavia possibile configurare la scadenza utilizzando la proprietà expirationDate.

    note tip
    TIP
    Se desideri visualizzare o filtrare le risorse in base alla loro data di scadenza futura, indica l'intervallo di date futuro nel campo Expiration Duration. Visualizza le risorse con il badge in scadenza.
  • Tipo MIME: include JPG, GIF, PPTX, PNG, MP4, DOCX, TIFF, PDF, XLSX.

  • Dimensioni immagine: include la larghezza minima/massima e l'altezza minima/massima dell'immagine.

    rail-view-example

Ricerca personalizzata

Oltre alla ricerca full-text, Asset Selector consente di cercare le risorse all’interno dei file utilizzando la ricerca personalizzata. Puoi utilizzare filtri di ricerca personalizzati sia nella vista modale che nella vista della barra.

custom-search

È inoltre possibile creare un filtro di ricerca predefinito per salvare i campi che si desidera cercare di frequente e utilizzarli in un secondo momento. Per creare una ricerca personalizzata delle risorse, puoi utilizzare la proprietà filterSchema.

Il selettore risorse consente di eseguire una ricerca full-text delle risorse all’interno dell’archivio selezionato. Ad esempio, se digiti la parola chiave wave nella barra di ricerca, vengono mostrate tutte le risorse con la parola chiave wave menzionata in una qualsiasi delle proprietà dei metadati.

Ordinamento sorting

Puoi ordinare le risorse all’interno selettore risorse per nome, dimensione o dimensione di una risorsa. Puoi anche ordinare le risorse in ordine crescente o decrescente.

Tipi di visualizzazione types-of-view

Il selettore risorse consente di visualizzare la risorsa in quattro diverse visualizzazioni:

  • visualizzazione elenco La visualizzazione elenco visualizza i file e le cartelle scorrevoli in un'unica colonna.
  • visualizzazione griglia La visualizzazione griglia visualizza i file e le cartelle scorrevoli in una griglia di righe e colonne.
  • visualizzazione raccolta La visualizzazione raccolta visualizza i file o le cartelle in un elenco orizzontale con blocco centrale.
  • vista a cascata La vista a cascata visualizza file o cartelle sotto forma di Bridge.

Grafico Panoramica

Ulteriori informazioni sulle funzionalità chiave key-capabilities-asset-selector

Grafico Integrare selettore risorse {width="70px"}
Integrare il selettore risorse

Scopri diverse funzionalità per integrare Asset Selector con più applicazioni.

Grafico Integrare Asset Selector con Adobe Applications {width="70px"}
Integrare Asset Selector con le applicazioni Adobe

Scopri come integrare Asset Selector con varie applicazioni Adobe.

Grafico Integrare selettore risorse {width="70px"}
Integrare Asset Selector con applicazioni di terze parti

Scopri le funzionalità per integrare Asset Selector con applicazioni non Adobe.

Grafico Integrare selettore risorse {width="70px"}
Integrare Asset Selector con le API aperte di Dynamic Medie

Informazioni su come integrare Asset Selector con le API aperte di Dynamic Medie.

Grafico delle proprietà di Asset Selector {width="70px"}
Proprietà selettore risorse

Scopri le nozioni di base per personalizzare vari componenti di Asset Selector, ad esempio filtri, selezione di risorse, risorse scadute e molto altro.

Grafico di esempio di Asset Selector {width="70px"}
Esempi di selettore risorse

Comprendere l'utilizzo delle proprietà in modo pratico.

Grafico Personalizza selettore risorse {width="70px"}
Personalizzazioni selettore risorse

Configura e personalizza vari componenti di Asset Selector in base alla tua usabilità.

Grafico caricamento selettore risorse {width="70px"}
Caricamento selettore risorse

Scopri come caricare file o cartelle in Asset Selector dal file system locale o di terze parti.

Grafico delle raccolte di Asset Selector {width="70px"}
Raccolte selettori risorse

Scopri come utilizzare le raccolte all'interno di Asset Selector utilizzando l'archivio Experience Manager.

recommendation-more-help
fbcff2a9-b6fe-4574-b04a-21e75df764ab