Show Menu
SUJETS×

targetGlobalSettings()

Vous pouvez remplacer les paramètres de la bibliothèque at.js à l’aide de targetGlobalSettings() , au lieu de configurer les paramètres dans l’interface utilisateur de Target Standard/Premium, ou utiliser des API REST.
Dans certains cas d’utilisation, en particulier lorsque at.js est distribué via la Dynamic Tag Management (DTM), il se peut que vous souhaitiez remplacer certains des paramètres.

Paramètres

Vous pouvez remplacer les paramètres suivants :
Paramètres
Type
Valeur par défaut
Description
serverState
Voir "Personnalisation hybride" ci-dessous.
Voir "Personnalisation hybride" ci-dessous.
Voir "Personnalisation hybride" ci-dessous.
clientCode
Chaîne
Valeur définie via l’interface utilisateur
Représente le code client
serverDomain
Chaîne
Valeur définie via l’interface utilisateur
Représente le serveur Target Edge
cookieDomain
Chaîne
Si possible, définissez la valeur sur le domaine de niveau supérieur
Représente le domaine utilisé lors de l’enregistrement de cookies
crossDomain
Chaîne
Valeur définie via l’interface utilisateur
Indique si le suivi interdomaine est activé ou non.
Les valeurs autorisées sont les suivantes :
  • disabled
  • enabled
  • x-uniquement
timeout
Nombre
Valeur définie via l’interface utilisateur
Représente le délai d’expiration de la demande Target Edge
globalMboxAutoCreate
Booléen
Valeur définie via l’interface utilisateur
Indique si la demande de mbox globale doit être déclenchée ou non
visitorApiTimeout
Nombre
2 000 ms = 2 s
Représente le délai d’expiration de la demande de l’API visiteur
enabled
Booléen
true
Lorsqu’elle est activée, une demande de Cible pour récupérer des expériences et la manipulation DOM pour générer les expériences est exécutée automatiquement. En outre, les appels de Cible peuvent être exécutés manuellement via getOffer(s) / applyOffer(s)
Lorsque désactivé, les demandes de Cible ne sont pas exécutées automatiquement ou manuellement.
pageLoadEnabled
Booléen
true
Lorsqu’elle est activée, récupère automatiquement les expériences qui doivent être renvoyées au chargement de la page.
viewsEnabled
Booléen
true
Lorsque cette option est activée, récupère automatiquement les vues qui doivent être renvoyées au chargement de la page. Les Vues sont prises en charge dans at.js 2. x uniquement
defaultContentHiddenStyle
Chaîne
visibility: hidden
Utilisé uniquement pour les mbox d’encapsulation qui font appel à des DIV avec le nom de classe « mboxDefault » et sont exécutées via mboxCreate() , mboxUpdate() , ou mboxDefine() () pour masquer le contenu par défaut
defaultContentVisibleStyle
Chaîne
visibility: visible
Utilisé uniquement pour les mbox d’encapsulation qui font appel à des DIV avec le nom de classe « mboxDefault » et sont exécutées via mboxCreate() , mboxUpdate() ou mboxDefine() pour révéler l’offre appliquée (le cas échéant) ou le contenu par défaut
bodyHiddenStyle
Chaîne
body { opacity: 0 }
Utilisé uniquement lorsque globalMboxAutocreate === true pour minimiser les risques de scintillement.
Pour plus d’informations, voir Gestion du scintillement par at.js .
bodyHidingEnabled
Booléen
true
Utilisé pour contrôler le scintillement lorsque target-global-mbox est utilisé pour diffuser des offres créées dans le composition d’expérience visuelle (également appelées offres visuelles)
imsOrgId
Chaîne
ID d’entreprise IMS
Représente l’ID d’entreprise IMS
secureOnly
Booléen
false
Indique si at.js doit utiliser le protocole HTTPS seulement ou s’il peut permuter entre les protocoles HTTP et HTTPS en fonction du protocole de la page.
overrideMboxEdgeServer
Booléen
vrai (vrai commençant par at.js version 1.6.2)
Indique s’il convient d’utiliser le domaine <clientCode>.tt.omtrdc.net ou le domaine mboxedge<clusterNumber>.tt.omtrdc.net .
Si cette valeur est définie sur vrai, le domaine mboxedge<clusterNumber>.tt.omtrdc.net sera enregistré dans un cookie.. Actuellement, il ne fonctionne pas avec CNAME
overrideMboxEdgeServerTimeout
Nombre
1 860 000 => 31 minutes
Indique la durée de vie du cookie qui contient la valeur mboxedge<clusterNumber>.tt.omtrdc.net .
optoutEnabled
Booléen
false
Indique si Target doit invoquer la fonction isOptedOut() de l’API visiteur. Fait partie de l’activation de Device Graph.
selectorsPollingTimeout
Nombre
5 000 ms = 5 s
Dans at.js 0.9.6, Target présente ce nouveau paramètre qui peut être remplacé via targetGlobalSettings .
selectorsPollingTimeout représente la durée d’attente acceptable du client pour tous les éléments identifiés par les sélecteurs qui s’affichent sur la page.
Les activités créées via le compositeur d’expérience visuelle (VEC) comportent des offres qui contiennent des sélecteurs.
dataProviders
Voir la section Fournisseurs de données ci-dessous.
Voir la section Fournisseurs de données ci-dessous.
Voir la section Fournisseurs de données ci-dessous.
cspScriptNonce
Voir "Stratégie de sécurité de contenu" ci-dessous.
Voir "Stratégie de sécurité de contenu" ci-dessous.
Voir "Stratégie de sécurité de contenu" ci-dessous.
cspStyleNonce
Voir "Stratégie de sécurité de contenu" ci-dessous.
Voir "Stratégie de sécurité de contenu" ci-dessous.
Voir "Stratégie de sécurité de contenu" ci-dessous.

Utilisation

Cette fonction peut être définie avant le chargement du fichier at.js ou dans Configuration > Mise en œuvre > Modifier les paramètres at.js > Paramètres des codes > En-tête de bibliothèque .
Le champ En-tête de bibliothèque vous permet de saisir du code JavaScript de forme libre. Le code de personnalisation doit être similaire au suivant :
window.targetGlobalSettings = {  
   timeout: 200, // using custom timeout  
   visitorApiTimeout: 500, // using custom API timeout  
   enabled: document.location.href.indexOf('https://www.adobe.com') >= 0 // enabled ONLY on adobe.com  
};

Fournisseurs de données

Ce paramètre permet aux clients de collecter des données auprès de fournisseurs de données tiers tels que Demandbase, BlueKai ou des services personnalisés, et de les transmettre à Target sous forme de paramètres mbox dans la requête globale mbox. Cette fonction prend en charge la collecte des données en provenance de fournisseurs multiples via des requêtes synchrones et asynchrones. Cette approche permet de gérer aisément le scintillement du contenu de la page par défaut, tout en incluant des délais d’attente indépendants pour chaque fournisseur afin de limiter l’impact sur les performances de la page
La section Fournisseurs de données doit disposer du fichier at.js 1.3 ou d’une version ultérieure.
Les vidéos suivantes comprennent davantage d’informations :
Vidéo
Description
L’option Fournisseurs de données est une fonctionnalité qui vous permet de transmettre facilement des données provenant de tiers à Target. Un tiers peut être un service météorologique, une plateforme de gestion des données, ou même votre propre service web. Vous pouvez ensuite utiliser ces données pour créer des audiences, cibler du contenu et enrichir le profil du visiteur.
Détails de mise en œuvre et exemples d’utilisation de la fonctionnalité Fournisseurs de données d’Adobe Target pour récupérer les données de fournisseurs de données tiers et les transmettre dans la requête Target.
Le paramètre window.targetGlobalSettings.dataProviders est un tableau de fournisseurs de données.
Chaque fournisseur de données présente la structure suivante :
Clé
Type
Description
name
Chaîne
Nom du fournisseur
version
Chaîne
Version du fournisseur. Cette clé sera utilisée pour l’évolution du fournisseur.
timeout
Nombre
Représente le délai d’attente du fournisseur dans le cas d’une requête réseau. Cette clé est facultative.
provider
Fonction
Fonction qui contient la logique de recherche des données de fournisseur.
La fonction comporte un seul paramètre requis : callback . Le paramètre callback est une fonction qui doit être appelée uniquement lorsque les données ont été recherchées avec succès ou qu’une erreur s’est produite.
Le paramètre callback appelle lui-même deux paramètres :
  • error : indique qu’une erreur s’est produite. Si l’exécution est correcte, ce paramètre doit être défini sur la valeur Null.
  • params : objet JSON représentant les paramètres qui seront envoyés dans une requête Target.
L’exemple suivant illustre l’exécution synchronisée par le fournisseur de données :
var syncDataProvider = { 
  name: "simpleDataProvider", 
  version: "1.0.0", 
  provider: function(callback) { 
    callback(null, {t1: 1}); 
  } 
}; 
  
window.targetGlobalSettings = { 
  dataProviders: [ 
    syncDataProvider 
  ] 
};

Une fois que at.js a traité window.targetGlobalSettings.dataProviders , la requête Target contient un nouveau paramètre : t1=1 .
L’exemple suivant illustre la recherche des paramètres que vous souhaitez ajouter à la requête Target dans un service tiers tel que BlueKai, Demandbase, etc. :
var blueKaiDataProvider = { 
   name: "blueKai", 
   version: "1.0.0", 
   provider: function(callback) { 
      // simulating network request 
     setTimeout(function() { 
       callback(null, {t1: 1, t2: 2, t3: 3}); 
     }, 1000); 
   } 
} 
  
window.targetGlobalSettings = { 
   dataProviders: [ 
      blueKaiDataProvider 
   ] 
};

Une fois que at.js a traité window.targetGlobalSettings.dataProviders , la requête Target contient des paramètres supplémentaires : t1=1 , t2=2 et t3=3 .
L’exemple suivant fait appel à des fournisseurs de données pour collecter des données météorologiques depuis l’API et les envoyer sous forme de paramètres dans une requête Target. La requête Target contiendra des paramètres supplémentaires tels que country et weatherCondition .
var weatherProvider = { 
      name: "weather-api", 
      version: "1.0.0", 
      timeout: 2000, 
      provider: function(callback) { 
        var API_KEY = "caa84fc6f5dc77b6372d2570458b8699"; 
        var lat = 44.426767399999996; 
        var lon = 26.1025384; 
        var url = "//api.openweathermap.org/data/2.5/weather?lang=en"; 
        var data = { 
          lat: lat, 
          lon: lon, 
          appId: API_KEY 
        } 
 
        $.ajax({ 
          type: "GET", 
                url: url, 
          dataType: "json", 
          data: data, 
          success: function(data) { 
            console.log("Weather data", data); 
            callback(null, { 
              country: data.sys.country, 
              weatherCondition: data.weather[0].main 
            }); 
          }, 
          error: function(err) { 
            console.log("Error", err); 
            callback(err); 
          } 
        });         
      } 
    }; 
 
    window.targetGlobalSettings = { 
      dataProviders: [weatherProvider] 
    };

Tenez compte de ce qui suit lors de l’exploitation du paramètre dataProviders  :
  • Si les fournisseurs de données ajoutés à window.targetGlobalSettings.dataProviders sont asynchrones, ils sont exécutés en parallèle. La requête d’API Visitor sera exécutée en parallèle avec des fonctions ajoutées à window.targetGlobalSettings.dataProviders afin de permettre un temps d’attente minimal.
  • at.js ne tentera pas de mettre les données en cache. Si le fournisseur de données extrait les données en une seule fois, il doit s’assurer que les données sont mises en cache et que, lorsque la fonction du fournisseur est appelée, les données du cache sont envoyées pour le second appel.

Content Security Policy

at.js 2.3.0+ prend en charge la définition des nonies de la stratégie de sécurité de contenu sur les balises SCRIPT et STYLE ajoutées au DOM de la page lors de l’application d’offres de Cible distribuées.
Les nonces SCRIPT et STYLE doivent être définies dans targetGlobalSettings.cspScriptNonce et targetGlobalSettings.cspStyleNonce proportionnellement, avant le chargement du fichier at.js 2.3.0+. Consultez un exemple ci-dessous :
...
<head>
 <script nonce="<script_nonce_value>">
window.targetGlobalSettings = {
  cspScriptNonce: "<csp_script_nonce_value>",
  cspStyleNonce: "<csp_style_nonce_value>"
};
 </script>
 <script nonce="<script_nonce_value>" src="at.js"></script>
...
</head>
...

Une fois cspScriptNonce et cspStyleNonce les paramètres spécifiés, at.js 2.3.0+ les définit comme des attributs nonce sur toutes les balises SCRIPT et STYLE qu’il ajoute au modèle DOM lors de l’application d’offres de Cible.

Personnalisation hybride

serverState est un paramètre disponible dans at.js v2.2+ qui peut être utilisé pour optimiser les performances des pages lorsqu’une intégration hybride de Cible est implémentée. L’intégration hybride signifie que vous utilisez at.js v2.2+ côté client et l’API de diffusion ou un SDK de Cible côté serveur pour diffuser des expériences. serverState donne à at.js v2.2+ la possibilité d’appliquer des expériences directement à partir du contenu récupéré côté serveur et renvoyé au client dans le cadre de la page diffusée.

Conditions préalables

Vous devez avoir une intégration hybride de Target.

Exemples de code

Pour mieux comprendre comment cela fonctionne, reportez-vous aux exemples de code ci-dessous que vous trouverez sur votre serveur. Le code suppose que vous utilisez le SDK Node.js de Cible.
// First, we fetch the offers via Target Node.js SDK API, as usual
const targetResponse = await targetClient.getOffers(options);
// A successfull response will contain Target Delivery API request and response objects, which we need to set as serverState
const serverState = {
  request: targetResponse.request,
  response: targetResponse.response
};
// Finally, we should set window.targetGlobalSettings.serverState in the returned page, by replacing it in a page template, for example
const PAGE_TEMPLATE = `
<!doctype html>
<html>
<head>
  ...
  <script>
    window.targetGlobalSettings = {
      overrideMboxEdgeServer: true,
      serverState: ${JSON.stringify(serverState, null, " ")}
    };
  </script>
  <script src="at.js"></script>
</head>
...
</html>
`;
// Return PAGE_TEMPLATE to the client ...

Un exemple d’objet serverState JSON pour la prérécupération de vue se présente comme suit :
{
 "request": {
  "requestId": "076ace1cd3624048bae1ced1f9e0c536",
  "id": {
   "tntId": "08210e2d751a44779b8313e2d2692b96.21_27"
  },
  "context": {
   "channel": "web",
   "timeOffsetInMinutes": 0
  },
  "experienceCloud": {
   "analytics": {
    "logging": "server_side",
    "supplementalDataId": "7D3AA246CC99FD7F-1B3DD2E75595498E"
   }
  },
  "prefetch": {
   "views": [
    {
     "address": {
      "url": "my.testsite.com/"
     }
    }
   ]
  }
 },
 "response": {
  "status": 200,
  "requestId": "076ace1cd3624048bae1ced1f9e0c536",
  "id": {
   "tntId": "08210e2d751a44779b8313e2d2692b96.21_27"
  },
  "client": "testclient",
  "edgeHost": "mboxedge21.tt.omtrdc.net",
  "prefetch": {
   "views": [
    {
     "name": "home",
     "key": "home",
     "options": [
      {
       "type": "actions",
       "content": [
        {
         "type": "setHtml",
         "selector": "#app > DIV.app-container:eq(0) > DIV.page-container:eq(0) > DIV:nth-of-type(2) > SECTION.section:eq(0) > DIV.container:eq(1) > DIV.heading:eq(0) > H1.title:eq(0)",
         "cssSelector": "#app > DIV:nth-of-type(1) > DIV:nth-of-type(1) > DIV:nth-of-type(2) > SECTION:nth-of-type(1) > DIV:nth-of-type(2) > DIV:nth-of-type(1) > H1:nth-of-type(1)",
         "content": "<span style=\"color:#FF0000;\">Latest</span> Products for 2020"
        }
       ],
       "eventToken": "t0FRvoWosOqHmYL5G18QCZNWHtnQtQrJfmRrQugEa2qCnQ9Y9OaLL2gsdrWQTvE54PwSz67rmXWmSnkXpSSS2Q==",
       "responseTokens": {
        "profile.memberlevel": "0",
        "geo.city": "dublin",
        "activity.id": "302740",
        "experience.name": "Experience B",
        "geo.country": "ireland"
       }
      }
     ],
     "state": "J+W1Fq18hxliDDJonTPfV0S+mzxapAO3d14M43EsM9f12A6QaqL+E3XKkRFlmq9U"
    }
   ]
  }
 }
}

Une fois la page chargée dans le navigateur, at.js applique toutes les Target offres depuis serverState immédiatement, sans déclencher d’appel réseau sur le Target bord. En outre, at.js prémasque uniquement les éléments DOM pour lesquels Target des offres sont disponibles dans le contenu récupéré côté serveur, ce qui a une incidence positive sur les performances de chargement de page et sur l’expérience de l’utilisateur final.

Remarques importantes

Consider the following when using serverState :
  • Actuellement, at.js v2.2 ne prend en charge que la diffusion d’expériences via serverState pour :
    • activités créées par le compositeur d’expérience visuelle qui sont exécutées au chargement de la page.
    • vues prérécupérées.
      Dans le cas des applications monopages utilisant Target des Vues et triggerView() dans l’API at.js, at.js v2.2 met en cache le contenu de toutes les Vues prérécupérées côté serveur et les applique dès que chaque Vue est déclenchée par triggerView() l’intermédiaire de, encore une fois sans déclencher d’appels de récupération de contenu supplémentaires à la Cible.
    • Remarque : Actuellement, les mbox récupérées côté serveur ne sont pas prises en charge dans serverState .
  • Lors de l’application d’ serverState offres, at.js prend en compte pageLoadEnabled et viewsEnabled les paramètres ; par exemple, les offres de chargement de page ne seront pas appliquées si le pageLoadEnabled paramètre est false.
    Pour activer ces paramètres, activez la bascule dans Configuration #.

Ressources supplémentaires

Pour en savoir plus sur le serverState fonctionnement, consultez les ressources suivantes :