Simple Log Service:Utiliser le plug-in STS du SDK Web Tracking pour JavaScript afin de téléverser des journaux

Contexte

Sans autorisation temporaire via STS, vous devez activer la fonctionnalité Web Tracking pour le Logstore, ce qui permet les écritures anonymes depuis les navigateurs et peut générer des données incorrectes. Les étapes suivantes décrivent le processus de téléversement des journaux par le plug-in STS :

1. Un navigateur demande un identifiant temporaire (jeton STS) à un serveur métier.

2. Le serveur de service demande un jeton STS au service STS.

   1. Une paire AccessKey de l'utilisateur RAM (Resource Access Management) est configurée sur le serveur et la politique AliyunSTSAssumeRoleAccess est attachée à l'utilisateur RAM.

   2. Le serveur utilise la paire AccessKey de l'utilisateur RAM pour appeler l'opération AssumeRole de STS afin d'obtenir le jeton STS du rôle RAM. Vous pouvez utiliser le paramètre Policy de AssumeRole pour restreindre les autorisations des différents jetons STS en fonction de l'utilisateur ou de l'appareil.

3. STS renvoie un jeton STS au serveur métier.

4. Le serveur de service renvoie un jeton STS au navigateur.

5. Le navigateur utilise le jeton STS obtenu pour endosser le rôle RAM et téléverse les journaux collectés depuis le navigateur vers le Logstore.

6. Simple Log Service renvoie une réponse au navigateur après le téléversement du journal.

Prérequis

• L'utilisateur RAM est créé et la politique AliyunSTSAssumeRoleAccess lui est attachée. Pour plus d'informations, consultez la rubrique Créer un utilisateur RAM.

• Pour savoir comment configurer la paire AccessKey de l'utilisateur RAM dans les variables d'environnement du serveur métier, consultez la rubrique Configurer les variables d'environnement sous Linux, macOS et Windows.

• Vous avez créé un rôle RAM pour un compte Alibaba Cloud de confiance et accordé à ce rôle l'autorisation d'écrire des données dans le projet spécifié. Pour plus d'informations, consultez les rubriques Créer un rôle RAM pour un compte Alibaba Cloud de confiance et Exemples de politiques personnalisées RAM.

  {
    "Version": "1",
    "Statement": [
      {
        "Action": [
          "log:Post*"
        ],
        "Resource": "acs:log:*:*:project/<The name of the specified project.>/*",
        "Effect": "Allow"
      }
    ]
  }

Étape 1 : Installer et configurer le SDK

1. Installez Node.js.

2. Exécutez la commande suivante sur le serveur métier pour installer les dépendances.

   npm install --save @aliyun-sls/web-track-browser
   npm install --save @aliyun-sls/web-sts-plugin

3. Ajoutez le code suivant à votre programme pour configurer le SDK.

   import SlsTracker from '@aliyun-sls/web-track-browser'
   import createStsPlugin from '@aliyun-sls/web-sts-plugin'
   
   const opts = {
     host: '${host}', // The Simple Log Service endpoint for the region. Example: cn-hangzhou.log.aliyuncs.com.
     project: '${project}', // The name of the project. 
     logstore: '${logstore}', // The name of the Logstore. 
     time: 10, // The interval at which logs are sent. Default value: 10. Unit: seconds. 
     count: 10, // The maximum number of logs that can be sent in each request. Default value: 10. 
     topic: 'topic',// The custom topic of logs. 
     source: 'source',
     tags: {
       tags: 'tags',
     },
   }
   
   const stsOpt = {
     accessKeyId: '',
     accessKeySecret: '',
     securityToken: '',
     // The following is a simple example of an STS token refresh function.
     refreshSTSToken: () =>
       new Promise((resolve, reject) => {
         const xhr = new window.XMLHttpRequest()
           xhr.open('GET', 'localhost:7000/test/sts', true)
           xhr.send()
           xhr.onreadystatechange = () => {
             if (xhr.readyState === 4) {
               if (xhr.status === 200) {
                 let credential = JSON.parse(xhr.response)
                 // The purpose of the function is to configure the temporary key and token of stsOpt. 
                 stsOpt.accessKeyId = credential.AccessKeyId
                 stsOpt.accessKeySecret = credential.AccessKeySecret
                 stsOpt.securityToken = credential.SecurityToken
                 resolve()
               } else {
                 reject('Wrong status code.')
               }
             }
           }
         }),
     // refreshSTSTokenInterval: 300000,
     // stsTokenFreshTime: undefined,
   }
   
   // Create a tracker.
   const tracker = new SlsTracker(opts)
   // Create the STS plug-in.
   const stsPlugin = createStsPlugin(stsOpt)
   // Use the STS plug-in.
   tracker.useStsPlugin(stsPlugin)
   
   // Assume that you want to upload a single log.
   tracker.send({
     eventType:'view_product',
     productName: 'Tablet',
     price: 500
   })
   

   Le tableau suivant décrit les paramètres Web Tracking.

   Paramètre	Obligatoire	Description
   host	Oui	L'endpoint de la région où réside Simple Log Service. Dans cet exemple, l'endpoint Simple Log Service de la région Chine (Hangzhou) est utilisé. Remplacez la valeur du paramètre par l'endpoint réel. Pour plus d'informations, consultez la rubrique Endpoint.
   project	Oui	Le nom du projet.
   logstore	Oui	Le nom du Logstore.
   time	Non	L'intervalle d'envoi des journaux. Valeur par défaut : 10. Unité : secondes.
   count	Non	Le nombre maximal de journaux pouvant être envoyés dans chaque requête. Valeur par défaut : 10.
   topic	Non	Le sujet des journaux. Spécifiez une valeur personnalisée pour identifier les journaux.
   source	Non	La source des journaux. Spécifiez une valeur personnalisée pour identifier les journaux.
   tags	Non	Des tags personnalisés pour identifier les journaux.

   Le tableau suivant décrit les paramètres STS.

   Paramètre	Obligatoire	Description
   accessKeyId accessKeySecret securityToken	Oui	Le serveur métier utilise la paire AccessKey de l'utilisateur RAM pour appeler l'opération AssumeRole. Les paramètres de réponse incluent AccessKeySecret, AccessKeyId et SecurityToken. Dans les paramètres d'entrée de l'opération AssumeRole, DurationSeconds spécifie la période de validité du jeton et Policy spécifie l'étendue des autorisations du jeton.
   refreshSTSToken	Oui	Une fonction qui obtient périodiquement de nouveaux jetons STS pour mettre à jour les champs d'identifiants. Prend en charge les fonctions Promise et async.
   refreshSTSTokenInterval	Non	L'intervalle de rafraîchissement des jetons, en millisecondes. Valeur par défaut : 300 000 (5 minutes).
   stsTokenFreshTime	Non	L'horodatage de l'acquisition la plus récente du jeton. Il n'est pas nécessaire de définir ce paramètre.

Références

• Cette rubrique utilise le SDK Web Tracking pour JavaScript afin de collecter les journaux de site web. Pour plus d'informations sur l'utilisation du SDK Web Tracking pour JavaScript afin de collecter les journaux de mini-programmes, consultez la rubrique SDK WebTracking JavaScript pour mini-programmes.

FAQ

• Le SDK démarre sans erreur, mais lors de l'envoi des journaux, il signale l'erreur TypeError: Cannot read properties of undefined (reading 'sigBytes'). Que faire ?

  Cause possible : un problème de chiffrement CryptoJS. Étant donné que le package tiers est difficile à modifier, nous recommandons d'utiliser Web Tracking pour les écritures non authentifiées. Pour plus d'informations, consultez la rubrique Collecter des journaux côté client avec WebTracking.