DocumentationGuide du développeur de Target

Fonctionnement d’at.js

Last update: Thu Jul 27 2023 00:00:00 GMT+0000 (Coordinated Universal Time)

Créé pour :

  • Developer

Pour implémenter Adobe Target côté client, vous devez utiliser la bibliothèque JavaScript at.js.

Dans une implémentation côté client de Adobe Target, Target fournit les expériences associées directement à une activité dans le navigateur client. Le navigateur décide de l’expérience à afficher et l’affiche. Avec une implémentation côté client, vous pouvez utiliser un éditeur WYSIWYG, le compositeur d’expérience visuelle (VEC) ou une interface non visuelle, le compositeur d’expérience basé sur les formulaires, pour créer vos expériences de test et de personnalisation.

Qu’est-ce qu’at.js ?

La bibliothèque at.js est la bibliothèque d’implémentation pour l’implémentation côté client de Adobe Target. La bibliothèque at.js réduit les délais de chargement des pages pour les implémentations web et offre des options d’implémentation optimisées pour les applications d’une seule page. at.js est la bibliothèque d’implémentation recommandée. Elle est régulièrement mise à jour avec de nouvelles fonctionnalités. Nous recommandons à tous les clients de mettre en œuvre la dernière version d’ at.js ou d’effectuer la migration vers cette dernière.

Pour plus d’informations, voir Bibliothèques JavaScript Target.

Dans le Targetimplémentation illustrée ci-dessous, les solutions Adobe Experience Cloud suivantes sont mises en oeuvre : Analytics, Target et Audience Manager. En outre, les éléments suivants Experience Cloud Les services principaux sont implémentés : Adobe Experience Platform, Audiences, et Service d’identification des visiteurs.

Quelle différence y a-t-il entre les diagrammes de wordkflow at.js 1.x et at.js 2.x ?

Voir Mise à niveau d’at.js 1.x vers at.js 2.x pour plus d’informations sur les différences introduites dans la version 2.0 depuis 1.x.

D’un point de vu général, il y a quelques différences entre les deux versions :

  • at.js 2.x n’a pas de concept de requête de mbox globale, mais plutôt une requête de chargement de page. Une requête de chargement de page peut être vue comme une requête pour récupérer le contenu qui doit être appliqué au chargement initial de la page de votre site Web.
  • at.js 2.x gère les concepts appelés Vues, qui sont utilisés pour les applications d’une seule page (SPA). at.js 1.x n’a pas conscience de ce concept.

Diagrammes at.js 2.x

Les diagrammes suivants vous aident à comprendre le processus d’at.js 2.x avec Vues et comment cela améliore l’intégration SPA. Pour une meilleure présentation des concepts utilisés dans at.js 2.x, voir Implémentation d’applications monopage.

(Cliquez sur l’image pour agrandir l’image en largeur réelle.)

Flux Target avec at.js 2.x {modal="regular"}

Étape
Détails
1
L’appel renvoie la variable Identifiant Experience Cloud si l’utilisateur est authentifié ; un autre appel synchronise l’ID de client.
2
La bibliothèque at.js se charge de manière synchrone et masque le corps du document.
at.js peut également être chargé de manière asynchrone avec en option un extrait de code pré-masquant, implémenté sur la page.
3
Une demande de chargement de page est faite, incluant tous les paramètres configurés (MCID, SDID et ID client).
4
Les scripts de profil s’exécutent, puis sont introduits dans la variable Boutique de profils. Le Store demande des audiences qualifiées auprès de la fonction Bibliothèque d’audiences (par exemple, les audiences partagées depuis Adobe Analytics, Audience Manager, etc.).
Les attributs du client sont envoyés par lot dans le magasin de profils.
5
Selon les paramètres de requête d’URL et les données de profil, Target décidez quelles activités et expériences renvoyer au visiteur pour la page active et les futures vues.
6
Le contenu ciblé est renvoyé à la page, comprenant, éventuellement, les valeurs de profil pour une personnalisation plus poussée.
Le contenu ciblé sur la page actuelle est affiché aussi rapidement que possible, sans scintillement du contenu par défaut.
Contenu ciblé pour les vues présentées à la suite d’actions de l’utilisateur dans une application d’une seule page cache dans le navigateur, afin qu’elles puissent être appliquées instantanément sans appel au serveur supplémentaire lorsque les vues sont déclenchées triggerView().
7
Les données Analytics sont envoyées à Collecte de données serveurs.
8
Les données ciblées sont associées aux données Analytics via le SDID et sont traitées dans la variable Analytics stockage des rapports.
Analytics les données peuvent être vues dans Analytics et dans Target par l’intermédiaire des rapports (A4T) de .

Désormais, là où triggerView() est mis en œuvre sur votre application monopage, les actions et les affichages sont récupérés depuis le cache et présentés à l’utilisateur sans appel au serveur. triggerView() envoie également une demande de notification au serveur dorsal de Target afin d’incrémenter et d’enregistrer le nombre d’impressions. Pour plus d’informations sur at.js pour les applications monopages avec vues, voir Implémentation d’application monopage.

(Cliquez sur l’image pour agrandir l’image en largeur réelle.)

Déclencheur d’affichage at.js 2.x du flux Target {modal="regular"}

Étape
Détails
1
triggerView()​ est appelée dans l’application d’une seule page pour afficher les vues et appliquer les actions pour modifier les éléments visuels.
2
Le contenu ciblé pour la vue est lu à partir du cache.
3
Le contenu ciblé s’affiche aussi rapidement que possible, sans scintillement du contenu par défaut.
4
La demande de notification est envoyée au magasin de profils Target pour compter le visiteur dans l’activité et incrémenter les mesures.
5
Analytics données envoyées à Serveurs de collecte de données.
6
Les données Target sont associées aux données Analytics par l’intermédiaire du SDID et sont traitées dans le magasin de rapports Analytics. Analytics Les données peuvent ensuite être visualisées dans les deux Analytics et Target via les rapports A4T.

Vidéo : diagramme architectural d’at.js 2.x

at.js 2.x améliore la prise en charge d’applications monopages par Adobe Target et s’intègre aux autres solutions d’Experience Cloud. Cette vidéo explique comment tout se connecte.

https://video.tv.adobe.com/v/26250/?quality=12

Pour plus d’informations, consultez la page Fonctionnement d’at.js 2.x.

Diagramme at.js 1.x

Les diagrammes suivants vous aident à comprendre le processus d’at.js 1.x.

(Cliquez sur l’image pour agrandir l’image en largeur réelle.)

Flux Target : at.js 1.x {modal="regular"}

Étape
Description
L’appel
Description
1
L’appel renvoie l’ID d’Experience Cloud (MCID) si l’utilisateur est authentifié ; un autre appel synchronise l’ID de client.
2
La bibliothèque at.js se charge de manière synchrone et masque le corps du document.
3
Une demande de mbox globale, incluant tous les paramètres configurés (MCID, SDID et ID de client (facultatif)), est envoyée.
4
Les scripts de profil s’exécutent, puis sont introduits dans le magasin de profils. Le magasin demande des audiences qualifiées auprès de la bibliothèque d’audiences (par exemple, audiences partagées depuis Adobe Analytics, Audience Manager, etc.).
Les attributs du client sont envoyés par lot dans le magasin de profils.
5
En fonction de l’URL, des paramètres de mbox et des données de profil, Target décide quelles activités et expériences renvoyer au visiteur.
6
Le contenu ciblé est renvoyé à la page, y compris, éventuellement, les valeurs de profil pour une personnalisation plus poussée.
L’expérience est affichée aussi rapidement que possible, sans scintillement du contenu par défaut.
7
Les données Analytics sont envoyées aux serveurs de collecte de données.
8
Les données Target sont associées aux données Analytics par l’intermédiaire du SDID et sont traitées dans le magasin de rapports Analytics.Il est alors possible de consulter les données
Analytics dans Analytics et dans Target par l’intermédiaire des rapports Analytics for Target (A4T).

Vidéo : Heures de bureau, conseils et présentation d’at.js (26 juin 2019)

Cette vidéo est un enregistrement de "Heures d'ouverture", une initiative menée par Adobe de l’assistance clientèle l'équipe.

  • Avantages de l’utilisation d’at.js
  • Paramètres d’at.js
  • Gestion du scintillement
  • Débogage d’at.js
  • Problèmes connus
  • FAQ

https://video.tv.adobe.com/v/27959/?quality=12

Comment at.js effectue le rendu des offres avec du contenu HTML

Lors du rendu des offres avec du contenu HTML, at.js applique l’algorithme suivant :

  1. Les images sont préchargées (s’il existe des balises <img> dans le contenu HTML).

  2. Le contenu HTML est attaché au nœud DOM.

  3. Les scripts intégrés sont exécutés (code inclus dans les balises <script>).

  4. Les scripts distants sont chargés de manière asynchrone et exécutés (<script> balises avec les attributs src).

Remarques importantes :

  • at.js ne fournit aucune garantie quant à l’ordre d’exécution des scripts distants, car ceux-ci sont chargés de manière asynchrone.
  • Les scripts intégrés ne doivent pas avoir de dépendances sur les scripts distants, car ils sont chargés et exécutés plus tard.
recommendation-more-help
6906415f-169c-422b-89d3-7118e147c4e3