Validar implementações do SDK da Web com o Experience Platform Debugger
Saiba como validar a implementação do SDK da web da Adobe Experience Platform com o Adobe Experience Platform Debugger.
O Experience Platform Debugger é uma extensão disponível para os navegadores Chrome e Firefox, que ajuda a visualizar a tecnologia de Adobe implementada nas páginas da Web. Baixe a versão do seu navegador de preferência:
Se você nunca usou o depurador antes, assista a este vídeo de visão geral de cinco minutos:
Nesta lição, você usa o extensão do Adobe Experience Platform Debugger para substituir a propriedade de tag codificada na Site de demonstração Luma com sua própria propriedade.
Essa técnica é chamada de alternação de ambiente e será útil posteriormente, ao trabalhar com tags em seu próprio site. Ele permite carregar o site de produção em seu navegador, mas com seus desenvolvimento biblioteca de tags. Essa capacidade permite fazer e validar de forma segura as alterações nas tags independentemente das suas versões de código normais. Afinal, essa separação das versões de tag de marketing das versões regulares de código é um dos principais motivos pelos quais os clientes usam tags!
Objetivos de aprendizagem
No final desta lição, você poderá usar o depurador para:
- Carregar uma biblioteca de tags alternativa
- Validar se o evento XDM do lado do cliente está capturando e enviando dados conforme esperado para o Edge Network da plataforma
- Habilitar o Edge Trace para exibir solicitações do lado do servidor enviadas pelo Platform Edge Network
Pré-requisitos
Você está familiarizado com as tags de Coleção de dados e a Site de demonstração Luma e concluíram as lições anteriores no tutorial:
Carregar bibliotecas de tags alternativas com o Debugger
O depurador de Experience Platform tem um recurso interessante que permite substituir uma biblioteca de tags existente por outra. Essa técnica é útil para validação e permite ignorar muitas etapas de implementação neste tutorial.
-
Verifique se você tem o Site de demonstração da Luma abra e selecione o ícone da extensão do Experience Platform Debugger
-
O Debugger abrirá e mostrará alguns detalhes da implementação codificada (talvez seja necessário recarregar o site Luma depois de abrir o Debugger)
-
Confirme se o Debugger é "Conectado ao Luma" como mostrado abaixo e selecione o "bloquear" para bloquear o Debugger no site Luma.
-
Selecione o Conectar e faça logon no Adobe Experience Cloud usando sua ID de Adobe.
-
Agora, vá para Tags do Experience Platform na navegação à esquerda
-
Selecione o Configuração guia
-
À direita de onde ele mostra a Códigos incorporados de página, abra o Ações e selecione Substituir
-
Como você está autenticado, o Debugger extrairá suas propriedades e ambientes de tag disponíveis. Selecione sua propriedade
-
Selecione o
Developmentambiente -
Selecione o Aplicar botão
-
O site Luma será recarregado agora com sua própria propriedade de tag.
À medida que você prossegue no tutorial, usa essa técnica de mapear o site Luma para sua própria propriedade de tag para validar a implementação do SDK da Web da Platform. Ao usar tags em seu próprio site, você pode usar essa mesma técnica para validar bibliotecas de tags de desenvolvimento em seu site de produção.
Validar solicitações de rede do lado do cliente com o Experience Platform Debugger
Você pode usar o Debugger para validar beacons do lado do cliente acionados a partir da implementação do SDK da Web da Platform para exibir os dados enviados para a Rede de borda da Platform:
-
Ir para Resumo na navegação à esquerda, para ver os detalhes da propriedade da tag
-
Agora, vá para Experience Platform Web SDK na navegação à esquerda para ver o Solicitações de rede
-
Abra o events linha
-
Observe como você pode ver a
web.webpagedetails.pageViewtipo de evento que você especificou em seu Atualizar variável e outras variáveis prontas para uso que seguem aAEP Web SDK ExperienceEventgrupo de campos
-
Role para baixo até
webobjeto, selecione para abri-lo e inspecionar owebPageDetails.name,webPageDetails.server, ewebPageDetails.siteSection. Eles devem corresponder aosdigitalDatavariáveis de camada de dados na página inicial
digitalData camada de dados na página inicial:- Na página inicial do Luma, abra as ferramentas de desenvolvedor do navegador. No caso do Chrome, selecione o botão
F12no teclado - Selecione o Console guia
- Enter
digitalDatae selecioneEnterno teclado para exibir os valores da camada de dados
Também é possível validar os detalhes do Mapa de identidade:
-
Faça logon no site Luma usando as credenciais
test@adobe.com/test -
Retorne à página inicial do Luma
-
Abra o Experience Platform Web SDK na navegação à esquerda
-
Selecione o events linha para abrir detalhes em um pop-up
-
Procure por identityMap na janela pop-up. Aqui você deve ver
lumaCrmIdcom três chaves de authenticatedState, id e primary:
Validar solicitações do lado do cliente com ferramentas de desenvolvimento do navegador
Esses tipos de detalhes da solicitação também estão visíveis nas ferramentas do desenvolvedor da Web do navegador Rede (supondo que o site esteja carregando a biblioteca de tags).
-
Abra as ferramentas do desenvolvedor da Web do navegador. Rede e recarregue a página. Filtrar chamadas com
/eepara localizar a chamada, selecione-a e procure no Cabeçalhos e Carga guia
-
Vá para a Resposta e observe como o valor ECID é incluído na resposta.
note note NOTE O valor da ECID está visível na resposta da rede. Ela não está incluída no identityMapparte da solicitação de rede, nem é armazenada nesse formato em um cookie.
Validar solicitações de rede do lado do servidor com o Experience Platform Debugger
Como você aprendeu na Configurar um fluxo de dados lição, o SDK da Web da Platform envia primeiro os dados da propriedade digital para o Platform Edge Network. Em seguida, o Platform Edge Network faz solicitações adicionais do lado do servidor para os serviços correspondentes ativados no fluxo de dados. Você pode validar as solicitações do lado do servidor feitas pelo Platform Edge Network usando o Rastreamento de borda no Debugger.
Ativar o Edge Trace
Para ativar o Edge Trace:
-
Na navegação à esquerda de Experience Platform Debugger selecionar Logs
-
Selecione o Edge e selecione Conectar
-
Está vazio por enquanto
-
Atualize o Página inicial da Luma e verificar Experience Platform Debugger novamente, para ver os dados aparecerem.
Nesse ponto, não é possível visualizar solicitações de Edge Network da Platform indo para aplicativos Adobe porque você não ativou nenhuma no fluxo de dados. Em lições futuras, você usa o Edge Trace para visualizar as solicitações do lado do servidor de saída para aplicativos Adobe e encaminhamento de eventos. Mas, primeiro, conheça outra ferramenta para validar as solicitações do lado do servidor feitas pelo Platform Edge Network — Adobe Experience Platform Assurance!