DocumentationGuide du développeur de Target

Fonctionnement d’at.js

Dernière mise à jour : 19 mai 2026

Créé pour :

  • {"id":"ff6a42d2-313e-452e-93a6-792e4fad9ff8"}

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 d’implémenter ou de migrer vers la dernière version d’at.js.

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

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

Quelle est la différence entre les diagrammes de workflow 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 2.O à partir de 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’est pas conscient de ce concept.

Diagrammes at.js 2.x

Les diagrammes suivants vous aident à comprendre le workflow d’at.js 2.x avec Vues et comment il améliore l’intégration de la 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 l’agrandir sur toute la largeur.)

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

Étape
Détails
1
L’appel renvoie l’Experience Cloud ID si l’utilisateur est authentifié ; un autre appel synchronise l’ID 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 un fragment de code de masquage préalable facultatif 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 intégrés au magasin de profils. La Store demande des audiences qualifiées à partir de la bibliothèque d’audiences (par exemple, les audiences partagées à partir de Adobe Analytics, Audience Manager, etc.).
Les attributs du client sont envoyés à la banque de profils dans un processus par lots.
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 aux serveurs collecte de données.
8
Les données ciblées sont mises en correspondance avec les données Analytics via le SDID et sont traitées dans le stockage de rapports Analytics.
Analytics Les données peuvent ensuite être affichées dans Analytics et Target via les rapports (A4T).

Désormais, partout où triggerView() est implémenté sur votre SPA, les vues et actions sont récupérées du cache et affichées pour 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 l’agrandir sur toute la largeur.)

Flux cible at.js 2.x triggerView {modal="regular"}

Étape
Détails
1
triggerView() est appelé dans la SPA pour effectuer le rendu de la Vue et appliquer des 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 Target magasin de profils pour comptabiliser le visiteur dans l’activité et incrémenter les mesures.
5
Analytics les données envoyées aux serveurs de collecte de données.
6
Target données sont mises en correspondance avec les données Analytics via le SDID et sont traitées dans le stockage de rapports Analytics. Analytics données peuvent ensuite être affichées dans 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&learn=on

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 workflow d’at.js 1.x.

(Cliquez sur l’image pour l’agrandir sur toute la largeur.)

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

Étape
Description
L’appel
Description
1
L’appel renvoie l’Experience Cloud ID (MCID) si l’utilisateur est authentifié ; un autre appel synchronise l’ID 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. La boutique demande des audiences qualifiées à la bibliothèque d’audiences (par exemple, les audiences partagées à partir d’Adobe Analytics, d’Audience Manager, etc.).
Les attributs du client sont envoyés à la boutique de profils dans un processus par lots.
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 cibles sont associées aux données Analytics via le SDID et traitées dans le stockage de rapports Analytics.
Les données d’Analytics peuvent ensuite être affichées dans Analytics et Target via les 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 « Office Hours », une initiative menée par l’équipe de l’Assistance clientèle ​.

  • 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&learn=on

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
target-dev-help-dev