snippetd'agent tronqué angulaire

Problème

Vous utilisez la méthode copier/coller HTML dans une application Angular version 12, 13 ou 14, mais le snippet de code de l'agent a été tronqué après l'exécution de la build Angular.

Cela peut entraîner un dysfonctionnement de l'application ou des pages concernées en raison d'un JavaScript incorrect contenu dans le code HTML de la page.

Solution

Ce problème est causé par un bug dans une dépendance du système de build Angular CLI. Les versions 12, 13 et 14 de l'Angular CLI utilisent une dépendance qui tronque le script en ligne d'une taille arbitraire, qui peut inclure l'agent New Relic monitoring de navigateurs. Nous avons confirmé que cela a été corrigé avec la version Angular 15 et nous vous recommandons de mettre à niveau votre projet Angular.

Si la mise à niveau d'Angular n'est pas une solution viable, une alternative consiste à placer le snippet de copier/coller de l'agent du navigateur dans un fichier JavaScript séparé et à le référencer à partir du fichier HTML d'index.

1. Créez un nouveau fichier dans votre répertoire src ou assets nommé newrelic.js
2. Copiez le snippet de l'agent de navigateur à partir de la page des paramètres de l'application New Relic Browser
3. Collez snippet de l'agent du navigateur dans ce nouveau fichier
4. Mettez à jour le src/index.html ou votre fichier d'index HTML pour ajouter le code ci-dessous en haut de la section head

   <script src="/newrelic.js"></script>

   Copier
5. Mettez à jour le fichier angular.json à la racine du projet pour ajouter le nouveau fichier à l'éventail assets

   ...
         "architect": {
           "build": {
             "builder": "@angular-devkit/build-angular:browser",
             "options": {
               "outputPath": "dist",
               "index": "src/index.html",
               "main": "src/main.ts",
               "polyfills": "src/polyfills.ts",
               "tsConfig": "tsconfig.app.json",
               "assets": [
                 "src/favicon.ico",
                 "src/assets",
                 "src/newrelic.js"
               ],
               "styles": [
                 "src/styles.css"
               ],
               "scripts": []
             },
   ...

   Copier