Les traductions sont fournies par des outils de traduction automatique. En cas de conflit entre le contenu d'une traduction et celui de la version originale en anglais, la version anglaise prévaudra. # Activation de la minimisation des traces de pile JavaScript d'erreurs Lorsque le code JavaScript source de votre application Web est réduit, les traces de la pile d'erreurs peuvent être difficiles à lire. Vous pouvez activer la minimisation des traces de la pile en téléchargeant vos cartes sources sur Amazon S3. CloudWatch RUM récupérera les cartes sources pour faire correspondre les numéros de ligne et de colonne du code source minifié au code source non minifié d'origine. Cela rendra vos suivis d’erreurs plus lisibles et vous aidera à identifier plus facilement l’emplacement de l’erreur dans le code d’origine. ## Exigences et syntaxe Les fichiers de sourçage sont essentiels pour le débogage et le suivi des problèmes dans votre application Web à travers différentes versions. Assurez-vous que chaque version de votre application dispose d’un fichier de sourçage unique. Chaque version doit avoir son propre releaseId unique. Le releaseId doit être une chaîne de 1 à 200 caractères, composée uniquement de lettres, chiffres, traits de soulignement, traits d’union, deux-points, barres obliques et points. Pour ajouter les métadonnées `releaseId` sous forme de métadonnées aux événements RUM, configurez le client Web CloudWatch RUM. Les fichiers de sourçage doivent être des fichiers JSON simples respectant la structure définie dans la [spécification Source Map V3](https://sourcemaps.info/spec.html). Les champs obligatoires sont : `version`, `file`, `sources`, `names` et `mappings`. Assurez-vous que la taille de chaque fichier de sourçage ne dépasse pas 50 Mo. De plus, le service RUM n’extrait au maximum que 50 Mo de fichiers de sourçage par suivi de pile. Si nécessaire, divisez votre code source en plusieurs fragments plus petits. Pour plus d’informations, consultez la section [Fractionnement du code avec WebpackJS](https://webpack.js.org/guides/code-splitting/). **Topics** + [Exigences et syntaxe](#CloudWatch-RUM-RequirementsJavaScriptStackTraceSourceMaps) + [Configuration de votre politique de ressources du compartiment Amazon S3 pour permettre l’accès du service RUM](#CloudWatch-RUM-ConfigureS3) + [Chargement des fichiers de sourçage](#CloudWatch-RUM-UploadSourceMaps) + [Configurez ReleaseID dans votre client Web CloudWatch RUM](#CloudWatch-RUM-ConfigureRumID) + [Activation CloudWatch du moniteur d'applications RUM pour minimiser les traces de stack JavaScript](#CloudWatch-RUM-unminifyjavascript) + [Affichage des suivis de pile déminifiées dans la console RUM](#CloudWatch-RUM-viewunminifiedstacktraces) + [Afficher des traces de pile non minimisées dans les journaux CloudWatch](#CloudWatch-RUM-viewunminifiedstacktracesCWL) + [Résolution des problèmes liés aux fichiers de sourçage](#CloudWatch-RUM-troubleshootsourcemaps) ## Configuration de votre politique de ressources du compartiment Amazon S3 pour permettre l’accès du service RUM Assurez-vous que votre compartiment Amazon S3 se trouve dans la même région que votre appMonitor RUM. Configurez votre compartiment Amazon S3 afin de permettre au service RUM d’extraire les fichiers de sourçage. Incluez les clés de contexte globales de condition `aws:SourceArn` et `aws:SourceAccount` pour limiter les autorisations du service aux ressources concernées. C’est le moyen le plus efficace de se protéger contre le [problème du député confus](https://docs.aws.amazon.com/IAM/latest/UserGuide/confused-deputy.html). L’exemple ci-dessous montre comment utiliser ces clés de contexte globales `aws:SourceArn` et `aws:SourceAccount` dans Amazon S3 pour éviter le problème de confusion d’identité. ------ #### [ JSON ] **** ``` { "Version":"2012-10-17", "Statement": [ { "Sid": "RUM Service S3 Read Permissions", "Effect": "Allow", "Principal": { "Service": "rum.amazonaws.com" }, "Action": [ "s3:GetObject", "s3:ListBucket" ], "Resource": [ "arn:aws:s3:::{{BUCKET_NAME}}", "arn:aws:s3:::{{BUCKET_NAME}}/*" ], "Condition": { "StringEquals": { "aws:SourceAccount": "{{ACCOUNT_ID}}", "aws:SourceArn": "arn:aws:rum:{{REGION}}:{{ACCOUNT_ID}}:appmonitor/{{APP_MONITOR_NAME}}" } } } ] } ``` ------ Si vous utilisez des AWS KMS clés pour chiffrer les données, assurez-vous que la politique de ressources de la clé est configurée de la même manière pour inclure `aws:SourceArn` les clés de contexte de condition `aws:SourceAccount` globale afin de permettre au service RUM d'accéder aux clés pour récupérer les fichiers de carte source. ------ #### [ JSON ] **** ``` { "Version":"2012-10-17", "Statement": [ { "Sid": "RUM Service KMS Read Permissions", "Effect": "Allow", "Principal": { "Service": "rum.amazonaws.com" }, "Action": "kms:Decrypt", "Resource": "arn:aws:kms:{{us-east-1}}:{{123456789012}}:key/{{KEY_ID}}", "Condition": { "StringEquals": { "aws:SourceAccount": "{{123456789012}}", "aws:SourceArn": "arn:aws:rum:{{us-east-1}}:{{123456789012}}/{{APP_MONITOR_NAME}}" } } } ] } ``` ------ ## Chargement des fichiers de sourçage Configurez votre JavaScript bundle pour générer des cartes sources lors de la minification. Lorsque vous créez votre application, le bundle crée un répertoire (par exemple, dist) contenant les JavaScript fichiers minifiés et les cartes sources correspondantes. Vous trouverez un exemple ci-dessous. ``` ./dist |-index.d5a07c87.js |-index.d5a07c87.js.map ``` Chargez les fichiers de sourçage dans votre compartiment Amazon S3. Les fichiers doivent être placés dans un dossier portant le nom du `releaseId`. Par exemple, si le nom de votre compartiment est `my-application-source-maps` et que le `releaseId` est 2.0.0, alors le fichier de sourçage se trouvera à l’emplacement suivant : ``` my-application-source-maps |-2.0.0 |-index.d5a07c87.js.map ``` Pour automatiser le chargement de vos fichiers de sourçage, vous pouvez créer le script bash suivant et l’exécuter dans le cadre de votre processus de compilation. ``` #!/bin/bash # Ensure the script is called with required arguments if [ "$#" -ne 2 ]; then echo "Usage: $0 {{S3_BUCKET_NAME}} {{RELEASE_ID}}" exit 1 fi # Read arguments S3_BUCKET="$1" RELEASE_ID="$2" # Set the path to your build directory BUILD_DIR="./dist" # Upload all .map files recursively if aws s3 cp "$BUILD_DIR" "s3://$S3_BUCKET/$RELEASE_ID/" --recursive --exclude "*" --include "*.map"; then echo "Successfully uploaded all source map files" else echo "Failed to upload source map files" fi ``` ## Configurez ReleaseID dans votre client Web CloudWatch RUM CloudWatch RUM utilise le fichier configuré `releaseId` pour déterminer le dossier dans lequel récupérer les fichiers de carte source. Nommez le `releaseId` avec le même nom que le dossier contenant vos fichiers de sourçage. Si vous avez utilisé le script bash fourni ci-dessus ou un script similaire, le script `releaseId` configuré doit être le même que celui configuré dans votre client Web CloudWatch RUM. Vous devez utiliser la version 1.21.0 ou ultérieure du client Web CloudWatch RUM. ``` import { AwsRum, AwsRumConfig } from "{{aws-rum-web}}"; try { const config: AwsRumConfig = { sessionSampleRate: 1, endpoint: "https://dataplane.rum.us-west-2.amazonaws.com", telemetries: ["performance", "errors", "http"], allowCookies: true, releaseId: "{{RELEASE_ID}}", //Add this }; const APPLICATION_ID: string = "{{APP_MONITOR_ID}}"; const APPLICATION_VERSION: string = "1.0.0"; const APPLICATION_REGION: string = "us-west-2"; new AwsRum(APPLICATION_ID, APPLICATION_VERSION, APPLICATION_REGION, config); } catch (error: any) { // Ignore errors thrown during CloudWatch RUM web client initialization } ``` ## Activation CloudWatch du moniteur d'applications RUM pour minimiser les traces de stack JavaScript Pour minimiser les traces de JavaScript stack, réglez le SourceMap statut du moniteur de l'application sur. `ENABLED` Indiquez l’URI Amazon S3 du compartiment ou du dossier contenant tous les fichiers de sourçage de votre moniteur d’application. Si les fichiers de sourçage sont stockés directement dans le compartiment principal (et non dans un sous-dossier), l’URI Amazon S3 doit être au format `Amazon S3://{{BUCKET_NAME}}`. Dans ce cas, les fichiers de sourçage doivent se trouver à l’emplacement suivant. ``` {{BUCKET_NAME}} |- {{RELEASE_ID}} |-index.d5a07c87.js.map ``` Si le répertoire enfant est la racine, l’URI Amazon S3 doit être au format `Amazon S3://{{BUCKET_NAME}}/{{DIRECTORY}}`. Dans ce cas, les fichiers de sourçage doivent se trouver à l’emplacement suivant. ``` {{BUCKET_NAME}} |- {{DIRECTORY}} |-{{RELEASE_ID}} |-index.d5a07c87.js.map ``` ## Affichage des suivis de pile déminifiées dans la console RUM Après avoir chargé vos cartes sources sur Amazon S3, activé les cartes sources sur le moniteur de votre application RUM et déployé votre application Web avec le client Web `releaseId` configuré dans le client Web CloudWatch RUM, sélectionnez **Events** dans la console RUM. Cet onglet affiche les données brutes des événements RUM. Filtrez selon le type d’événement d’erreur JS et affichez le dernier événement d’erreur JS. Vous verrez le suivi de pile déminifiée dans le nouveau champ `event_details.unminifiedStack`, disponible uniquement pour les événements ingérés après l’activation de cette fonctionnalité. ## Afficher des traces de pile non minimisées dans les journaux CloudWatch Activez le stockage des événements RUM dans CloudWatch les journaux en activant le **stockage des données**. Une fois cette option activée, vous pouvez rechercher le nouveau champ **event\_details.unminifiedStack**. Cela vous permet d'analyser les tendances et de relier les problèmes rencontrés au cours de plusieurs sessions à l'aide de requêtes CloudWatch Logs. ## Résolution des problèmes liés aux fichiers de sourçage CloudWatch RUM fournit des métriques prêtes à l'emploi pour résoudre les problèmes de configuration de votre carte source. Ces métriques sont publiées dans l'espace de noms de métrique nommé `AWS/RUM`. Les métriques suivantes sont publiées avec une dimension application\_name. La valeur de cette dimension est le nom du moniteur d'application. Ces métriques sont également publiées avec une dimension `aws:releaseId`. La valeur de cette dimension est celle `releaseId` associée à l'événement JavaScript d'erreur. | MetricName | Unité | Description | | --- | --- | --- | | UnminifyLineFailureCount | Nombre | Nombre de lignes de suivi de pile dans l’événement d’erreur JS qui n’ont pas pu être déminifiées. Des détails supplémentaires sur l’échec sont ajoutés à la ligne spécifique concernée dans le champ event\_details.unminifiedStack. | | UnminifyLineSuccessCount | Nombre | Nombre de lignes de suivi de pile dans l’événement d’erreur JS qui ont été déminifiées avec succès. | | UnminifyEventFailureCount | Nombre | Nombre d’événements d’erreur JS pour lesquels aucune ligne n’a pu être déminifiée. Des détails supplémentaires sur ces échecs sont ajoutés dans le champ event\_details.unminifiedStack. | | UnminifyEventSuccessCount | Nombre | Nombre d’événements d’erreur JS pour lesquels au moins une ligne de suivi de pile a été déminifiée avec succès. | CloudWatch RUM peut ne pas déminifier une ligne dans le stack trace pour diverses raisons, notamment, mais sans s'y limiter : + Impossible d’extraire le fichier de sourçage correspondant en raison de problèmes d’autorisations. Assurez-vous que la politique de ressources du compartiment est correctement configurée. + Le fichier de sourçage correspondant est introuvable. Assurez-vous que les fichiers de carte source ont été téléchargés dans le compartiment ou le dossier approprié portant le même nom que le ReleaseID configuré dans votre client Web CloudWatch RUM. + Le fichier de sourçage est trop volumineux. Divisez votre code source en fragments plus petits. + 50 Mo de fichiers de sourçage ont déjà été extraits pour le suivi de pile. Réduisez la longueur de suivi de pile, car 50 Mo est la limite imposée par le service. + Le fichier de sourçage est invalide ou n’a pas pu être indexé. Vérifiez qu’il s’agit bien d’un fichier JSON conforme à la spécification Source Map V3, contenant les champs obligatoires suivants : version, fichier, sources, noms et mappages. + Le fichier de sourçage n’a pas permis d’associer le code minifié au suivi de pile déminifiée. Assurez-vous que le fichier de sourçage correspond bien au releaseId indiqué.