[Integração]{class="badge positive"}
Configurar o Asset Insights com a AEM Assets e tags
[AEM Assets as a Cloud Service, AEM Assets 6.5]{class="badge informative"}
Nesta série de vídeos de cinco partes, vamos analisar a instalação e configuração do Asset Insights para Experience Manager implantado por meio de tags.
Parte 1: Visão geral do Asset Insights overview
Visão geral do Asset Insights. Instale os Componentes principais, Componente de imagem de amostra e outros pacotes de conteúdo para preparar seu ambiente.
Diagrama da arquitetura architecture-diagram
O vídeo usa os Componentes principais v2.2.2, que não é a versão mais recente. Certifique-se de usar a versão mais recente antes de prosseguir para a próxima seção.
Parte 2: Ativar o rastreamento do Asset Insights para o componente de imagem de amostra sample-image-component-asset-insights
Aprimoramentos nos Componentes principais e uso do componente proxy (Componente de imagem de amostra) para o Asset Insights. Editar as políticas do modelo da página de conteúdo para ativar o componente de imagem de amostra para o site de referência.
Usos do componente de Imagem principal data-asset-id atributo dentro do pai <div> de uma tag de imagem para ativar/desativar esse recurso. O componente proxy substitui o componente principal pelas alterações a seguir.
- Remove o data-asset-id da div principal de um elemento <img> dentro do image.html
- Adiciona data-aem-asset-id diretamente para o elemento <img> dentro da image.html
- Adiciona data-trackable='true' para o elemento <img> dentro do image.html
- data-aem-asset-id e data-trackable='true' são mantidas no mesmo nível de nó
Parte 3: Adobe Analytics — Criação de um conjunto de relatórios, permitindo a coleta de dados em tempo real e a geração de relatórios do AEM Assets adobe-analytics-asset-insights
O conjunto de relatórios com a coleta de dados em tempo real é criado para o rastreamento de ativos. A configuração do AEM Assets Insights é definida usando credenciais do Adobe Analytics.
Para a configuração do AEM Assets Insights, você precisa das seguintes credenciais
- Centro de dados
- Nome da empresa do Analytics
- Nome de usuário do Analytics
- Segredo compartilhado (pode ser obtido em Adobe Analytics > Administração > Configurações da empresa > Serviço da Web).
- Conjunto de relatórios (certifique-se de selecionar o Conjunto de relatórios correto que é usado para os Relatórios de ativos)
Parte 4: Uso de tags para adicionar a extensão do Adobe Analytics part-using-launch-by-adobe-for-adding-adobe-analytics-extension
Adição de extensão do Adobe Analytics, criação de regras de carregamento de página e integração do AEM com tags à conta técnica do Adobe IMS.
Regra 1: Rastreador de páginas (pagetracker.js) rule-page-tracker-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>
O rastreador de páginas implementa dois retornos de chamada (registrados no código incorporado do ativo)
- <code>assetAnalytics.core.assetLoaded<code> : chamado quando o evento "load" é despachado para o elemento asset-DOM.
- <code>assetAnalytics.core.assetClicked<code> : chamado quando o evento 'click' é despachado para o asset-DOM-element. Isso é relevante somente quando o asset-DOM-element tem uma tag âncora como pai com um atributo 'href' externo válido
Finalmente, o Rastreador de páginas implementa uma função de inicialização como.
- <code>assetAnalytics.dispatcher.init()<code> : chamado para inicializar o componente Rastreador de páginas. Isso DEVE ser chamado antes que qualquer um dos eventos de insights do ativo (impressões e/ou cliques) seja gerado na página da Web.
- <code>assetAnalytics.dispatcher.init()<code> : opcionalmente aceita um objeto do AppMeasurement — se fornecido, ele não tentará criar uma instância do objeto do AppMeasurement.
Regra 2: Rastreador de imagens — Ação 1 (asset-insights.js) rule-image-tracker-action-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);
}
})();
Regra 2: Rastreador de imagens — Ação 2 (image-tracker.js) rule-image-tracker-action-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() : é chamado no carregamento da página concluído e aciona Impressões de ativos para todas as imagens rastreáveis
- Variável do Analytics que carrega a lista de ativos carregada: contextData["c.a.assets.idList"]
- assetAnalytics.core.assetClicked() : é chamado quando o elemento DOM do ativo tem uma tag âncora com valor href válido. Quando um ativo é clicado, um cookie é criado com a ID do ativo clicada como seu valor.(Nome do cookie: a.assets.clickedid)
- Variável do Analytics que carrega a lista de ativos carregada: contextData['c.a.assets.clickedid']
- Origem : contextData['c.a.assets.source']
Instruções de depuração do console console-debug-statements
// Tags build info
_satellite.buildInfo
//Enables debug messages
_satellite.setDebug(true);
//Asset Insight JavaScript Object
assetAnalytics
//List of trackable images
document.querySelectorAll(".cmp-image__image");
Duas extensões de navegador do Google Chrome são mencionadas no vídeo como maneiras de depurar o Analytics. Extensões semelhantes também estão disponíveis para outros navegadores.
Parte 5: Teste de rastreamento analítico e sincronização de dados de insight analytics-tracking-asset-insights
Configuração do agendador de trabalhos de sincronização de relatórios de ativos AEM e do relatório de insights dos ativos