Surveillance des hooks pour le SDK Web

Le SDK Web de Adobe Experience Platform comprend des hooks de surveillance que vous pouvez utiliser pour surveiller divers événements système. Ces outils sont utiles pour développer vos propres outils de débogage et pour capturer les journaux du SDK Web.

Le SDK Web déclenche les fonctions de surveillance que vous ayez activé ou non le débogage.

onInstanceCreated onInstanceCreated

Cette fonction de rappel est déclenchée lorsque vous avez créé une instance SDK Web. Consultez l’exemple ci-dessous pour plus d’informations sur les paramètres de la fonction.

onInstanceCreated(data) {
    // data.instanceName
    // data.instance
}

onInstanceConfigured onInstanceConfigured

Cette fonction de rappel est déclenchée par le SDK Web lorsque la commande configure est résolue. Consultez l’exemple ci-dessous pour plus d’informations sur les paramètres de la fonction.

 onInstanceConfigured(data) {
     // data.instanceName
     // data.config
 }

onBeforeCommand onBeforeCommand

Cette fonction de rappel est déclenchée par le SDK Web avant toute autre commande. Vous pouvez utiliser cette fonction pour récupérer les options de configuration d’une commande spécifique. Consultez l’exemple ci-dessous pour plus d’informations sur les paramètres de la fonction.

onBeforeCommand(data) {
    // data.instanceName
    // data.commandName
    // data.options
}

onCommandResolved onCommandResolved

Cette fonction de rappel est déclenchée lors de la résolution des promesses de commande. Vous pouvez utiliser cette fonction pour afficher les options de commande et le résultat. Consultez l’exemple ci-dessous pour plus d’informations sur les paramètres de la fonction.

onCommandResolved(data) {
    // data.instanceName
    // data.commandName
    // data.options
    // data.result
},

onCommandRejected onCommandRejected

Cette fonction de rappel est déclenchée avant qu’une promesse de commande ne soit rejetée et contient des informations sur la raison pour laquelle la commande a été rejetée. Consultez l’exemple ci-dessous pour plus d’informations sur les paramètres de la fonction.

onCommandRejected(data) {
    // data.instanceName
    // data.commandName
    // data.options
    // data.error
}

onBeforeNetworkRequest onBeforeNetworkRequest

Cette fonction de rappel est déclenchée avant l’exécution d’une requête réseau. Consultez l’exemple ci-dessous pour plus d’informations sur les paramètres de la fonction.

onBeforeNetworkRequest(data) {
    // data.instanceName
    // data.requestId
    // data.url
    // data.payload
}

onNetworkResponse onNetworkResponse

Cette fonction de rappel est déclenchée lorsque le navigateur reçoit une réponse. Consultez l’exemple ci-dessous pour plus d’informations sur les paramètres de la fonction.

onNetworkResponse(data) {
    // data.instanceName
    // data.requestId
    // data.url
    // data.payload
    // data.body
    // data.parsedBody
    // data.status
    // data.retriesAttempted
}

onNetworkError onNetworkError

Cette fonction de rappel est déclenchée en cas d’échec de la requête réseau. Consultez l’exemple ci-dessous pour plus d’informations sur les paramètres de la fonction.

onNetworkError(data) {
    // data.instanceName
    // data.requestId
    // data.url
    // data.payload
    // data.error
},

onBeforeLog onBeforeLog

Cette fonction de rappel est déclenchée avant que le SDK Web ne consigne quoi que ce soit dans la console. Consultez l’exemple ci-dessous pour plus d’informations sur les paramètres de la fonction.

onBeforeLog(data) {
    // data.instanceName
    // data.componentName
    // data.level
    // data.arguments
}

onContentRendering onContentRendering

Cette fonction de rappel est déclenchée par le composant personalization à différentes étapes de rendu. La charge utile peut varier, selon le paramètre status . Consultez l’exemple ci-dessous pour plus d’informations sur les paramètres de la fonction.

 onContentRendering(data) {
     // data.instanceName
     // data.componentName
     // data.payload
     // data.status
}

onContentHiding onContentHiding

Cette fonction de rappel est déclenchée lorsqu’un style de masquage préalable est appliqué ou supprimé.

onContentHiding(data) {
    // data.instanceName
    // data.componentName
    // data.status
}

Comment spécifier des hooks de surveillance lors de l’utilisation du package NPM specify-monitoris-npm

Si vous utilisez le SDK Web via le package NPM, vous pouvez spécifier des hooks de surveillance dans la fonction createInstasnce, comme illustré ci-dessous.

var monitor = {
  onBeforeCommand(data) {
    console.log(data);
  },
  ...
};
var alloyLibrary = require("@adobe/alloy");
var alloy = alloyLibrary.createInstance({ name: "alloy", monitors: [monitor] });
alloy("config", { ... });
alloy("sendEvent", { ... });

Exemple example

Le SDK Web recherche un tableau d’objets dans une variable globale appelée __alloyMonitors.

Pour capturer tous les événements du SDK Web, vous devez définir vos hooks de surveillance avant que le code du SDK Web ne soit chargé sur votre page. Chaque méthode de surveillance capture un événement SDK Web.

Vous pouvez définir des hooks de surveillance après le chargement du code du SDK Web sur votre page, mais tous les hooks qui ont été déclenchés avant le chargement de la page seront non capturés.

Lorsque vous définissez votre objet de point d’extension de surveillance, il vous suffit de définir les méthodes pour lesquelles vous souhaitez définir une logique spéciale.
Par exemple, si vous vous souciez uniquement de onContentRendering, vous pouvez simplement définir cette méthode. Vous n’avez pas besoin d’utiliser tous les hooks de surveillance à la fois.

Vous pouvez définir plusieurs objets de point d’extension de surveillance. Tous les objets avec la méthode donnée sont appelés lorsque l’événement correspondant est déclenché.

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>Title</title>
  <script>
    window.__alloyMonitors = window.__alloyMonitors || [];
    window.__alloyMonitors.push({
      onInstanceCreated(data) {
        // data.instanceName
        // data.instance
      },
      onInstanceConfigured(data) {
        // data.instanceName
        // data.config
      },
      onBeforeCommand(data) {
        // data.instanceName
        // data.commandName
        // data.options
      },
      // Added in version 2.4.0
      onCommandResolved(data) {
        // data.instanceName
        // data.commandName
        // data.options
        // data.result
      },
      // Added in version 2.4.0
      onCommandRejected(data) {
        // data.instanceName
        // data.commandName
        // data.options
        // data.error
      },
      onBeforeNetworkRequest(data) {
        // data.instanceName
        // data.requestId
        // data.url
        // data.payload
      },
      onNetworkResponse(data) {
        // data.instanceName
        // data.requestId
        // data.url
        // data.payload
        // data.body
        // data.parsedBody
        // data.status
        // data.retriesAttempted
      },
      onNetworkError(data) {
        // data.instanceName
        // data.requestId
        // data.url
        // data.payload
        // data.error
      },
      onBeforeLog(data) {
        // data.instanceName
        // data.componentName
        // data.level
        // data.arguments
      }
      onContentRendering(data) {
        // data.instanceName
        // data.componentName
        // data.payload
        // data.status
      },
      onContentHiding(data) {
        // data.instanceName
        // data.componentName
        // data.status
      }
    });
  </script>
  <script>
      !function(n,o){o.forEach(function(o){n[o]||((n.__alloyNS=n.__alloyNS||
      []).push(o),n[o]=function(){var u=arguments;return new Promise(
      function(i,l){n[o].q.push([i,l,u])})},n[o].q=[])})}
      (window,["alloy"]);
    </script>
    <script src="alloy.js" async></script>
</head>
<body>
  <h1>Monitor Test</h1>
</body>
</html>