Sviluppa un Asset compute di processo di lavoro per metadati

Gli Asset compute personalizzati possono produrre dati XMP (XML) che vengono rimandati all'AEM e memorizzati come metadati su una risorsa.

I casi d’uso comuni includono:

  • Integrazioni con sistemi di terze parti, ad esempio un sistema PIM (Product Information Management system), in cui è necessario recuperare e memorizzare nella risorsa metadati aggiuntivi
  • Integrazioni con i servizi Adobe, come IA per contenuti e Commerce, per migliorare i metadati delle risorse con attributi di apprendimento automatico aggiuntivi
  • Derivazione dei metadati della risorsa dal suo binario e memorizzazione come metadati della risorsa in AEM as a Cloud Service

Come procedere

In questo tutorial verrà creato un processo di lavoro dei metadati di Asset Compute che deriva i colori più comunemente utilizzati in una risorsa immagine e riscrive i nomi dei colori nei metadati della risorsa in AEM. Anche se il processo di lavoro è di base, questo tutorial lo utilizza per esplorare il modo in cui i processi di lavoro Asset Compute possono essere utilizzati per riscrivere i metadati nelle risorse in AEM as a Cloud Service.

Flusso logico di una chiamata di lavoro di metadati Asset Compute

Il richiamo dei processi di lavoro dei metadati Asset Compute è quasi identico a quello di rendering binario che genera processi di lavoro. La differenza principale è che il tipo restituito è un rendering XMP (XML) i cui valori vengono scritti anche nei metadati della risorsa.

I processi di lavoro Asset Compute implementano il contratto Asset Compute SDK worker API nella funzione renditionCallback(...), concettualmente:

  • Input: Parametri binari ed elaborazione originali del profilo di una risorsa AEM
  • Output: una copia trasformata XMP (XML) è stata salvata come copia trasformata nella risorsa AEM e nei metadati della risorsa

Flusso logico di lavoro metadati Asset compute

  1. Il servizio di authoring AEM richiama il processo di lavoro metadati Asset Compute, fornendo il binario originale (1a) della risorsa e (1b) eventuali parametri definiti nel profilo di elaborazione.
  2. L'SDK Asset Compute orchestra l'esecuzione della funzione renditionCallback(...) del processo di lavoro metadati Asset Compute personalizzato, derivando una rappresentazione XMP (XML), basata sul binario della risorsa (1a) e su eventuali parametri del profilo di elaborazione (1b).
  3. Il processo di lavoro Asset Compute salva la rappresentazione XMP (XML) in rendition.path.
  4. I dati XMP (XML) scritti in rendition.path vengono trasportati tramite l'SDK Asset Compute al servizio di authoring AEM e li espone come (4a) una rappresentazione di testo e (4b) persistenti al nodo di metadati della risorsa.

Configurare manifest.yml manifest

Tutti i lavoratori Asset compute devono essere registrati in manifest.yml.

Aprire manifest.yml del progetto e aggiungere una voce di processo che configura il nuovo processo di lavoro, in questo caso metadata-colors.

Ricorda che .yml è sensibile agli spazi.

packages:
  __APP_PACKAGE__:
    license: Apache-2.0
    actions:
      worker:
        function: actions/worker/index.js
        web: 'yes'
        runtime: 'nodejs:12'
        limits:
          timeout: 60000 # in ms
          memorySize: 512 # in MB
          concurrency: 10
        annotations:
          require-adobe-auth: true
      metadata-colors:
        function: actions/metadata-colors/index.js
        web: 'yes'
        runtime: 'nodejs:12'
        limits:
          memorySize: 512 # in MB

function punta all'implementazione di lavoro creata nel passaggio successivo. Denomina i processi di lavoro in modo semantico (ad esempio, actions/worker/index.js potrebbe essere stato denominato actions/rendition-circle/index.js), in quanto vengono visualizzati nell'URL del processo di lavoro e determinano anche il nome della cartella della suite di test del processo di lavoro.

limits e require-adobe-auth sono configurati in modo discreto per lavoratore. In questo processo di lavoro, 512 MB di memoria viene allocata in quanto il codice controlla (potenzialmente) i dati di immagini binarie di grandi dimensioni. Gli altri limits vengono rimossi per utilizzare i valori predefiniti.

Sviluppare un processo di lavoro metadati metadata-worker

Crea un nuovo file JavaScript del processo di lavoro metadati nel progetto Asset Compute nel percorso defined manifest.yml per il nuovo processo di lavoro, in /actions/metadata-colors/index.js

Installare i moduli npm

Installa i moduli npm aggiuntivi (@adobe/asset-compute-xmp, get-image-colors e color-namer) utilizzati in questo processo di lavoro di Asset compute.

$ npm install @adobe/asset-compute-xmp
$ npm install get-image-colors
$ npm install color-namer

Codice processo metadati

Questo processo di lavoro è molto simile al processo di lavoro che genera copie trasformate. La differenza principale è che scrive i dati XMP (XML) in rendition.path per essere salvato nuovamente in AEM.

"use strict";

const { worker, SourceCorruptError } = require("@adobe/asset-compute-sdk");
const fs = require("fs").promises;

// Require the @adobe/asset-compute-xmp module to create XMP
const { serializeXmp } = require("@adobe/asset-compute-xmp");

// Require supporting npm modules to derive image colors from image data
const getColors = require("get-image-colors");
// Require supporting npm modules to convert image colors to color names
const namer = require("color-namer");

exports.main = worker(async (source, rendition, params) => {
  // Perform any necessary source (input) checks
  const stats = await fs.stat(source.path);
  if (stats.size === 0) {
    // Throw appropriate errors whenever an erring condition is met
    throw new SourceCorruptError("source file is empty");
  }
  const MAX_COLORS = 10;
  const DEFAULT_COLORS_FAMILY = 'basic';

  // Read the color family parameter to use to derive the color names
  let colorsFamily = rendition.instructions.colorsFamily || DEFAULT_COLORS_FAMILY;

  if (['basic', 'hex', 'html', 'ntc', 'pantone', 'roygbiv'].indexOf(colorsFamily) === -1) {
      colorsFamily = DEFAULT_COLORS_FAMILY;
  }

  // Use the `get-image-colors` module to derive the most common colors from the image
  let colors = await getColors(source.path, { options: MAX_COLORS });

  // Convert the color Chroma objects to their closest names
  let colorNames = colors.map((color) => getColorName(colorsFamily, color));

  // Serialize the data to XMP metadata
  // These properties are written to the [dam:Asset]/jcr:content/metadata resource
  // This stores
  // - The list of color names is stored in a JCR property named `wknd:colors`
  // - The colors family used to derive the color names is stored in a JCR property named `wknd:colorsFamily`
  const xmp = serializeXmp({
      // Use a Set to de-duplicate color names
      "wknd:colors": [...new Set(colorNames)],
      "wknd:colorsFamily": colorsFamily
    }, {
      // Define any property namespaces used in the above property/value definition
      // These namespaces are automatically registered in AEM if they do not yet exist
      namespaces: {
        wknd: "https://wknd.site/assets/1.0/",
      },
    }
  );

  // Save the XMP metadata to be written back to the asset's metadata node
  await fs.writeFile(rendition.path, xmp, "utf-8");
});

/**
 * Helper function that derives the closest color name for the color, based on the colors family
 *
 * @param {*} colorsFamily the colors name family to use
 * @param {*} color the color to convert to a name
 */
function getColorName(colorsFamily, color) {
    if ('hex' === colorsFamily) {  return color; }

    let names = namer(color.rgb())[colorsFamily];

    if (names.length >= 1) { return names[0].name; }
}

Esegui il processo di lavoro metadati localmente development-tool

Una volta completato, il codice del processo di lavoro può essere eseguito utilizzando lo strumento di sviluppo Asset compute locale.

Poiché il progetto di Asset compute contiene due processi di lavoro (il precedente rendering circolare e questo processo di lavoro metadata-colors), la definizione del profilo 🔗 dello strumento di sviluppo Asset compute elenca i profili di esecuzione per entrambi i processi di lavoro. La seconda definizione di profilo punta al nuovo processo di lavoro metadata-colors.

Rendering metadati XML

  1. Dalla directory principale del progetto Asset Compute

  2. Esegui aio app run per avviare lo strumento di sviluppo Asset compute

  3. Nel menu a discesa Seleziona un file…, scegli un immagine di esempio da elaborare

  4. Nella seconda configurazione della definizione del profilo, che punta al processo di lavoro metadata-colors, aggiornare "name": "rendition.xml" in quanto il processo di lavoro genera una rappresentazione XMP (XML). Facoltativamente, aggiungere un parametro colorsFamily (valori supportati basic, hex, html, ntc, pantone, roygbiv).

    code language-json
    {
        "renditions": [
            {
                "worker": "...",
                "name": "rendition.xml",
                "colorsFamily": "pantone"
            }
        ]
    }
    
  5. Tocca Esegui e attendi la generazione della rappresentazione XML

    • Poiché entrambi i processi di lavoro sono elencati nella definizione del profilo, verranno generate entrambe le rappresentazioni. Facoltativamente, è possibile eliminare la definizione del profilo superiore che punta al processo di lavoro copia trasformata circolare, per evitare di eseguirla dallo strumento di sviluppo.
  6. La sezione Rendering visualizza in anteprima la rappresentazione generata. Tocca rendition.xml per scaricarlo e aprirlo in VS Code (o nel tuo editor XML/di testo preferito) per rivederlo.

Verifica il lavoratore test

I processi di lavoro dei metadati possono essere testati utilizzando lo stesso framework di test Asset compute delle rappresentazioni binarie. L'unica differenza è che il file rendition.xxx nel test case deve essere il rendering XMP (XML) previsto.

  1. Crea la seguente struttura nel progetto Asset Compute:

    code language-none
    /test/asset-compute/metadata-colors/success-pantone/
    
        file.jpg
        params.json
        rendition.xml
    
  2. Utilizza il file di esempio come file.jpg del test case.

  3. Aggiungi il seguente JSON a params.json.

    code language-none
    {
        "fmt": "xml",
        "colorsFamily": "pantone"
    }
    

    Nota che "fmt": "xml" è necessario per istruire la suite di test a generare una rappresentazione basata su testo di .xml.

  4. Fornire l'XML previsto nel file rendition.xml. Tale risultato può essere ottenuto:

    • Esecuzione del file di input di prova tramite lo strumento di sviluppo e salvataggio della rappresentazione XML (convalidata).
    code language-none
    <?xml version="1.0" encoding="UTF-8"?><rdf:RDF xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#" xmlns:wknd="https://wknd.site/assets/1.0/"><rdf:Description><wknd:colors><rdf:Seq><rdf:li>Silver</rdf:li><rdf:li>Black</rdf:li><rdf:li>Outer Space</rdf:li></rdf:Seq></wknd:colors><wknd:colorsFamily>pantone</wknd:colorsFamily></rdf:Description></rdf:RDF>
    
  5. Eseguire aio app test dalla radice del progetto Asset Compute per eseguire tutte le suite di test.

Distribuire il processo di lavoro in Adobe I/O Runtime deploy

Per richiamare questo nuovo processo di lavoro metadati da AEM Assets, è necessario distribuirlo a Adobe I/O Runtime utilizzando il comando:

$ aio app deploy

distribuzione app aio

Tieni presente che verranno distribuiti tutti i processi di lavoro nel progetto. Rivedi le istruzioni di distribuzione non abbreviate per informazioni su come distribuire nelle aree di lavoro di staging e produzione.

Integrare con i profili di elaborazione dell’AEM processing-profile

Richiama il lavoratore dall’AEM creando un nuovo servizio Profilo di elaborazione personalizzato esistente o modificandone uno esistente che richiama il lavoratore distribuito.

Elaborazione profilo

  1. Accedi al servizio AEM as a Cloud Service Author come Amministratore AEM

  2. Passa a Strumenti > Assets > Profili elaborazione

  3. Crea un profilo di elaborazione nuovo o modifica ed esistente

  4. Tocca la scheda Personalizzato e tocca Aggiungi nuovo

  5. Definisci il nuovo servizio

    • Crea rappresentazione metadati: attiva/disattiva

    • Endpoint: https://...adobeioruntime.net/api/v1/web/wkndAemAssetCompute-0.0.1/metadata-colors

      • URL del processo di lavoro ottenuto durante la distribuzione o utilizzando il comando aio app get-url. Assicurati che l’URL punti nell’area di lavoro corretta in base all’ambiente AEM as a Cloud Service.
    • Parametri del servizio

      • Tocca Aggiungi parametro

        • Chiave: colorFamily
        • Valore: pantone
          • Valori supportati: basic, hex, html, ntc, pantone, roygbiv
    • Tipi MIME

      • Include: image/jpeg, image/png, image/gif, image/svg
        • Questi sono gli unici tipi MIME supportati dai moduli npm di terze parti utilizzati per derivare i colori.
      • Esclusioni: Leave blank
  6. Tocca Salva in alto a destra

  7. Se non lo hai già fatto, applica il profilo di elaborazione a una cartella AEM Assets

Aggiornare lo schema metadati metadata-schema

Per rivedere i metadati dei colori, mappa due nuovi campi nello schema di metadati dell’immagine con le nuove proprietà dei dati metadati che il processo di lavoro compila.

Schema metadati

  1. Nel servizio di creazione AEM, passa a Strumenti > Assets > Schemi di metadati

  2. Passa a default, seleziona e modifica image e aggiungi campi modulo di sola lettura per esporre i metadati colore generati

  3. Aggiungi un testo a riga singola

    • Etichetta campo: Colors Family
    • Mappa sulla proprietà: ./jcr:content/metadata/wknd:colorsFamily
    • Regole > Campo > Disattiva modifica: selezionato
  4. Aggiungi Testo con più valori

    • Etichetta campo: Colors
    • Mappa sulla proprietà: ./jcr:content/metadata/wknd:colors
  5. Tocca Salva in alto a destra

Elaborazione delle risorse

Dettagli risorsa

  1. Nel servizio di creazione AEM, passa a Assets > File
  2. Passa alla cartella o sottocartella a cui viene applicato il profilo di elaborazione
  3. Carica una nuova immagine (JPEG, PNG, GIF o SVG) nella cartella o rielabora le immagini esistenti utilizzando il profilo di elaborazione aggiornato
  4. Al termine dell'elaborazione, seleziona la risorsa e tocca proprietà nella barra delle azioni superiore per visualizzarne i metadati
  5. Esaminare i Colors Family e i Colors campi di metadati per i metadati scritti dal processo di lavoro metadati Asset Compute personalizzato.

Con i metadati del colore scritti nei metadati della risorsa, nella risorsa [dam:Asset]/jcr:content/metadata, questi metadati vengono indicizzati in modo da aumentare la capacità di individuazione della risorsa utilizzando questi termini tramite ricerca e possono anche essere riscritti nel file binario della risorsa se viene richiamato il flusso di lavoro Writeback di metadati DAM.

Rendering dei metadati in AEM Assets

File di rendering metadati AEM Assets

Anche il file XMP effettivo generato da Asset Compute Metadata Worker viene memorizzato come rappresentazione discreta sulla risorsa. Questo file generalmente non viene utilizzato, ma vengono utilizzati i valori applicati al nodo di metadati della risorsa, ma l’output XML non elaborato del processo di lavoro è disponibile in AEM.

codice di lavoro metadati-colori su Github

Il metadata-colors/index.js finale è disponibile su Github all'indirizzo:

La suite di test test/asset-compute/metadata-colors finale è disponibile su Github all'indirizzo:

recommendation-more-help
4859a77c-7971-4ac9-8f5c-4260823c6f69