Configuración de Asset Insights con AEM Assets y Adobe Experience Platform Launch

En esta serie de vídeos de 5 partes, analizamos la configuración de Asset Insights para el Experience Manager implementado mediante Adobe Launch.

Parte 1: Información general sobre Asset Insights

Información general sobre Asset Insights Instale los componentes principales, el componente de imagen de muestra y otros paquetes de contenido para preparar su entorno.

Diagrama de arquitectura

El vídeo utiliza los componentes principales v2.2.2, que ya no son la última versión; asegúrese de utilizar la versión más reciente antes de continuar con la siguiente sección.

• Descargar Contenido de imagen de muestra de Asset Insights
• Descargar los últimos componentes principales de WCM AEM

Parte 2 : Habilitar el seguimiento de Asset Insights para el componente de imagen de ejemplo

Mejoras en los componentes principales y uso del componente proxy (componente de imagen de muestra) para Asset Insights. Edición de las políticas de plantilla de página de contenido para habilitar el componente de imagen de muestra para el sitio de referencia.

Los componentes de la imagen principal utilizan data-asset-id dentro del atributo principal <div> de una etiqueta de imagen para habilitar/deshabilitar esta función. El componente Proxy anula el componente principal con los cambios siguientes.

• Quita la variable data-asset-id desde el div principal de un <img> elemento dentro de image.html
• Agrega data-aem-asset-id directamente al <img> elemento dentro de image.html
• Agrega data-trackable='true' al <img> elemento dentro de image.html
• data-aem-asset-id y data-trackable='true' se mantienen en el mismo nivel de nodo

Parte 3: Adobe Analytics: Creación de un grupo de informes, que permite la recopilación de datos en tiempo real y los informes de AEM Assets

El grupo de informes con recopilación de datos en tiempo real se crea para el seguimiento de recursos. La configuración de AEM Assets Insights se configura con credenciales de Adobe Analytics.

Para la configuración de AEM Assets Insights necesita las siguientes credenciales

• Centro de datos
• Nombre de la empresa de Analytics
• Nombre de usuario de Analytics
• Secreto compartido (se puede obtener de Adobe Analytics > Administración > Configuración de la empresa > Servicio web).
• Grupo de informes (asegúrese de seleccionar el grupo de informes correcto que se utiliza para los informes de recursos)

Parte 4: Uso de Adobe Experience Platform Launch para añadir la extensión de Adobe Analytics

Añadir la extensión de Adobe Analytics, crear reglas de carga de página e integrar AEM con la cuenta técnica de Adobe IMS de Launch.

Regla 1 : Rastreador de páginas (pagetracker.js)

//For AEM 6.3
<script type="text/javascript" src="http://localhost:4503/etc/clientlibs/foundation/assetinsights/pagetracker.js"></script>

//For AEM 6.4
<script type="text/javascript" src="http://localhost:4503/etc.clientlibs/dam/clientlibs/assetinsights/pagetracker.js"></script>

El rastreador de páginas implementa dos llamadas de retorno (registradas en asset-embed-code)

• &lt;code>assetAnalytics.core.assetLoaded&lt;code> : se llama cuando se envía el evento "load" para el elemento asset-DOM.
• &lt;code>assetAnalytics.core.assetClicked&lt;code> : cuando se envía el evento "click" para el elemento asset-DOM, esto solo es relevante cuando el elemento asset-DOM tiene una etiqueta delimitadora como elemento principal con un atributo "href" externo válido

Finalmente, Pagetracker implementa una función de inicialización como.

• &lt;code>assetAnalytics.dispatcher.init()&lt;code> : llamado para inicializar el componente Pagetracker. Esto DEBE invocarse antes de que cualquiera de los eventos de asset-insights-events (Impresiones y/o Clicks) se genere desde la página web.
• &lt;code>assetAnalytics.dispatcher.init()&lt;code> : opcionalmente, acepta un objeto AppMeasurement; si se proporciona, no intenta crear una nueva instancia del objeto AppMeasurement.

Artículo 2: Rastreador de imágenes — Acción 1 (asset-insights.js)

/*
 * AEM Asset Insights
 */

var sObj = window.s;
_satellite.notify('in assetAnalytics customInit');
(function initializeAssetAnalytics() {
 if ((!!window.assetAnalytics) && (!!assetAnalytics.dispatcher)) {
 _satellite.notify('assetAnalytics ready');
 /** NOTE:
  Copy over the call to 'assetAnalytics.dispatcher.init()' from Assets Pagetracker
  Be mindful about changing the AppMeasurement object as retrieved above.
  */
 assetAnalytics.dispatcher.init(
                                "",  /** RSID to send tracking-call to */
                                "",  /** Tracking Server to send tracking-call to */
                                "",  /** Visitor Namespace to send tracking-call to */
                                "",  /** listVar to put comma-separated-list of Asset IDs for Asset Impression Events in tracking-call, e.g. 'listVar1' */
                                "",  /** eVar to put Asset ID for Asset Click Events in, e.g. 'eVar3' */
                                "",  /** event to include in tracking-calls for Asset Impression Events, e.g. 'event8' */
                                "",  /** event to include in tracking-calls for Asset Click Events, e.g. 'event7' */
                                sObj  /** [OPTIONAL] if the webpage already has an AppMeasurement object, please include the object here. If unspecified, Pagetracker Core shall create its own AppMeasurement object */
                                );
 sObj.usePlugins = true;
 sObj.doPlugins = assetAnalytics.core.updateContextData;
}
 else {
 _satellite.notify('assetAnalytics not available. Consider updating the Custom Page Code', 4);
 }
})();

Artículo 2: Rastreador de imágenes — Acción 2 (image-tracker.js)

/*
 * AEM Asset Insights
 */

document.querySelectorAll('[data-aem-asset-id]').forEach(function(element) {
    assetAnalytics.core.assetLoaded(element);
    var parent = element.parentElement;
    if (parent.nodeName == "A") {
        parent.addEventListener("click", function() {
            assetAnalytics.core.assetClicked(this)
        });
    }
});

• assetAnalytics.core.assetLoaded() : se invoca al completar la carga de la página y es Impresiones de recursos de déclencheur para todas las imágenes a las que se puede realizar un seguimiento
• Variable de Analytics que lleva la lista de activos cargados: contextData['c.a.assets.idList']
• assetAnalytics.core.assetClicked() : se invoca cuando el elemento DOM del recurso tiene una etiqueta delimitadora con un valor href válido. Cuando se hace clic en un recurso, se crea una cookie con el ID del recurso en el que se hizo clic como su valor.(Nombre de la cookie: a.assets.clickedid)
• Variable de Analytics que lleva la lista de activos cargados: contextData['c.a.assets.clickedid']
• Fuente de origen : contextData['c.a.assets.source']

Instrucciones de depuración de la consola

//Launch Build Info
_satellite.buildInfo

//Enables debug messages
_satellite.setDebug(true);

//Asset Insight JS Object
assetAnalytics

//List of trackable images
document.querySelectorAll(".cmp-image__image");

En el vídeo se hace referencia a dos extensiones del explorador Google Chrome como formas de depurar Analytics. También hay extensiones similares disponibles para otros exploradores.

• Extensión de Launch Switch Chrome
• Adobe Experience Cloud Debugger

También es posible cambiar la DTM al modo de depuración con la siguiente extensión de Chrome: Conmutador de Launch y DTM. Esto facilita la visualización de si hay algún error relacionado con la implementación de DTM. Además, puede cambiar manualmente el DTM al modo de depuración a través de cualquier explorador herramientas para desarrolladores -> consola JS añadiendo el siguiente fragmento de código:

Parte 5 : Prueba del seguimiento de Analytics y sincronización de datos de Insight

Configuración de AEM Asset Reporting Sincronizar el Programador de trabajos y el Informe de perspectivas de recursos

Recursos de Business.Adobe.com

Auto Text Summarization Content As A Service Dynamic Media Headless Cms Digital Asset Management Digital Signage