Solución de problemas del SDK de JavaScript de Application Insights

En este artículo se describe cómo solucionar diversos problemas relacionados con el SDK de JavaScript de Application Insights. Los temas de este artículo incluyen errores de carga del SDK para aplicaciones web de JavaScript y compatibilidad con mapas de origen para aplicaciones de JavaScript.

Solución de problemas de error de carga del SDK para aplicaciones web de JavaScript

En las secciones siguientes se describen los síntomas, las causas y las soluciones de un escenario específico de error de carga del SDK para aplicaciones web de JavaScript.

Síntomas

En el <elemento principal> de la página web que está supervisando, el fragmento de código de JavaScript (versión 3 o posterior) crea e informa de la siguiente excepción cuando detecta que el script del SDK no se ha descargado ni inicializado:

Error de CARGA del SDK: no se pudo cargar el script del SDK de Application Insights (consulte la pila para obtener más información)

Este mensaje indica que el cliente del usuario (explorador) no puede descargar el SDK de Application Insights ni inicializarse desde la página de hospedaje identificada. Por lo tanto, no ve ningún evento o telemetría.

Azure Portal captura de pantalla de la excepción titulada

Nota:

Esta excepción se admite en todos los exploradores principales que admiten la fetch() API o XMLHttpRequest. Estas versiones del explorador excluyen Microsoft Internet Explorer 8 y versiones anteriores. Por lo tanto, esos exploradores no notificarán este tipo de excepción a menos que el entorno incluya un polyfill de captura.

Azure Portal captura de pantalla de la excepción

Los detalles de la pila incluyen la información básica sobre las direcciones URL que usa el usuario.

Nombre Descripción
<Punto de conexión de CDN> Dirección URL que se usó (y no se pudo) para descargar el SDK.
<Vínculo de ayuda> Dirección URL que se vincula a la documentación de solución de problemas (esta página).
<Host URL> Dirección URL completa de la página que el usuario estaba usando.
<URL de extremo> Dirección URL que se usó para notificar la excepción. Este valor podría ayudar a identificar si la red pública de Internet o una nube privada accedió a la página de hospedaje.

La lista siguiente contiene los motivos más comunes por los que se produce esta excepción:

  • Error intermitente de conectividad de red

  • Interrupción de La red de entrega de contenido (CDN) de Application Insights

  • Error de inicialización del SDK después de cargar el script

  • Bloqueo de la red CDN de JavaScript de Application Insights

El error intermitente de conectividad de red es la razón más común de esta excepción, especialmente en escenarios de itinerancia móvil.

En las secciones siguientes se describe cómo solucionar cada posible causa principal de este error.

Nota:

Algunos de estos pasos suponen que la aplicación tiene control directo del script/>etiqueta de fragmento de código < y su configuración que se devuelve como parte de la página HTML de hospedaje. Si estas condiciones no se aplican al escenario, estos pasos tampoco se aplican.

Causa 1: Error intermitente de conectividad de red

Si el usuario experimenta errores intermitentes de conectividad de red, hay menos soluciones posibles que para otras causas. Sin embargo, este error normalmente se resuelve rápidamente. Por ejemplo, si el usuario actualiza la página para volver a cargar el sitio, los archivos se descargarán y almacenarán en caché localmente hasta el lanzamiento de una versión actualizada.

Solución 1a: Descarga de una versión actualizada del SDK

Para minimizar los errores intermitentes de conectividad de red, hemos implementado Cache-Control encabezados en todos los archivos de la red CDN. Una vez que el explorador del usuario descarga la versión actual del SDK, no tiene que volver a descargarla porque reutiliza la copia obtenida anteriormente. (Vea cómo funciona el almacenamiento en caché). Si se produce un error en la comprobación del almacenamiento en caché o hay una nueva versión disponible, el explorador del usuario tiene que descargar la versión actualizada. Por lo tanto, es posible que vea un nivel de fondo de "ruido" en el escenario de error de comprobación. O bien, es posible que vea un pico temporal cuando se produzca una nueva versión y esté disponible con carácter general (implementado en la red CDN).

Solución 1b: uso de paquetes npm para insertar el SDK junto con la aplicación en una sola agrupación

¿Es persistente la excepción de error de carga del SDK y se produce para muchos usuarios junto con una reducción de la telemetría normal del cliente? En este caso, los problemas intermitentes de conectividad de red probablemente no sean la verdadera causa del problema y debe explorar otras causas posibles.

Nota:

Una indicación común de que este error se produce para varios usuarios es que la excepción se notifica en un nivel rápido y sostenido.

En esta situación, es poco probable que hospedar el SDK en su propia red CDN proporcione o reduzca las repeticiones de esta excepción. El mismo problema afecta a su propia red CDN y también se produce si usa el SDK a través de una solución de paquete npm. El error de este último escenario se produce especialmente si Application Insights se incluye en una agrupación diferente a la de la aplicación que se está supervisando, ya que se garantiza que el error se produzca en al menos una de esas agrupaciones. Desde la perspectiva del usuario, cuando se produce esta excepción, toda la aplicación no se puede cargar o inicializar, no solo el SDK de telemetría (que los usuarios no ven). Por lo tanto, es probable que los usuarios sigan actualizando el sitio hasta que se cargue por completo.

Puede intentar usar paquetes npm para insertar el SDK de Application Insights junto con la aplicación supervisada en una sola agrupación. Aunque podría producirse un error de intermitencia en este escenario, una agrupación combinada ofrece una posibilidad real de solucionar el problema.

Causa 2: Interrupción de la red CDN de Application Insights

Para comprobar que hay una interrupción de la red CDN de Application Insights, intente acceder al punto de conexión de la red CDN directamente desde el explorador desde una ubicación diferente a la de los usuarios. Por ejemplo, puede intentar acceder desde https://js.monitor.azure.com/scripts/b/ai.2.min.js su propio equipo de desarrollo. (Esto supone que su organización no ha bloqueado este dominio).

Solución 2: Creación de una incidencia de soporte técnico

Si comprueba que existe una interrupción, puede crear una nueva incidencia de soporte técnico.

Causa 3: EL SDK no se inicializó después de cargar el script

Si el SDK no se inicializa, el <script /> se sigue descargando correctamente desde la red CDN, pero se produce un error durante la inicialización. Este error se produce debido a dependencias que faltan o no son válidas, o debido a algún tipo de excepción de JavaScript.

Solución 3: Compruebe si hay una descarga correcta del SDK o excepciones de JavaScript, o habilite la depuración del explorador.

Paso 1: Comprobación de una descarga correcta del SDK

Compruebe si el SDK se descargó correctamente. Si no se ha producido ninguna descarga de script, este escenario no es la causa de la excepción de error de carga del SDK. Use un explorador que admita herramientas de desarrollo. Seleccione F12 para ver las herramientas de desarrollo y, a continuación, seleccione la pestaña Red . Compruebe que se ha descargado el script definido en la configuración del fragmento de código src . Para ello, busque código 200 de respuesta (correcto) o 304 (no modificado). Para revisar el tráfico de red, también puede usar una herramienta de depuración web como Fiddler.

Si el SDK no se ha descargado correctamente, revise la tabla siguiente para conocer las distintas opciones de informes.

Escenario Causa Acción
El problema afecta solo a algunos usuarios y a una versión específica del explorador o a un subconjunto de versiones del explorador. (Compruebe los detalles de la excepción notificada). Es probable que el problema solo se produzca si los usuarios o entornos específicos requieren que la aplicación proporcione implementaciones adicionales polyfill . Archivo de un problema en GitHub.
El problema afecta a toda la aplicación y a todos los usuarios. Es un problema relacionado con la versión. Cree una nueva incidencia de soporte técnico.

Si el SDK se descargó correctamente, revise las secciones siguientes para ayudar a corregir el problema de inicialización del SDK.

Paso 2: Comprobación de excepciones de JavaScript

Compruebe si hay excepciones de JavaScript. Use un explorador que admita herramientas de desarrollo. Seleccione F12 para ver las herramientas de desarrollo, cargar la página y, a continuación, comprobar si se produjo alguna excepción. ¿El script del SDK (por ejemplo, en ai.2.min.js) produce excepciones? En este caso, se produjo uno de los siguientes escenarios:

  • La configuración que se pasa al SDK contiene una configuración inesperada.

  • A la configuración que se pasa al SDK le falta una configuración necesaria.

  • Se implementó una versión defectuosa en la red CDN.

Para comprobar si hay una configuración defectuosa, cambie la configuración que se pasa al fragmento de código (si aún no lo ha hecho) para que incluya solo la clave de instrumentación como valor de cadena. En el código siguiente se muestra un cambio de configuración de fragmento de código de ejemplo.

Nota:

La compatibilidad con la ingesta de claves de instrumentación finaliza el 31 de marzo de 2025. La ingesta de claves de instrumentación seguirá funcionando, pero ya no proporcionaremos actualizaciones ni compatibilidad con la característica. Consulte Transición a cadenas de conexión para aprovechar las nuevas funcionalidades.

<script type="text/javascript">
...
src: "https://js.monitor.azure.com/scripts/b/ai.2.min.js",
cfg: {
    instrumentationKey: "<instrumentation-key-guid>"
}});
</script>

Cuando use esta configuración mínima, si sigue viendo una excepción de JavaScript en el script del SDK, cree una nueva incidencia de soporte técnico. Para corregir el problema, debe revertir la compilación defectuosa. Esto se debe a que una versión recién implementada es probablemente la causa del problema.

Si la excepción desaparece, es probable que un error de coincidencia de tipo o un valor inesperado esté causando el problema. Empiece a solucionar problemas restaurando las opciones de configuración una por una y pruebe después de cada cambio hasta que se vuelva a producir la excepción. A continuación, compruebe la documentación del elemento que provoca el problema. Si la documentación no está clara o necesita ayuda, envíe un problema en GitHub.

¿La configuración se implementó y funcionaba anteriormente, pero ahora está notificando esta excepción? En este caso, puede haber un problema que afecte a una versión recién implementada. Compruebe si la excepción afecta solo a un pequeño conjunto de usuarios o exploradores. Puede presentar un problema en GitHub o crear una nueva incidencia de soporte técnico.

Paso 3: Habilitar la depuración de la consola del explorador

Si no se ha producido ninguna excepción, debe habilitar la depuración de consola agregando la configuración loggingLevelConsole a la configuración, como se muestra en el siguiente ejemplo de configuración de fragmento de código. Este cambio envía todos los errores y advertencias de inicialización a la consola del explorador. (Para ver la consola del explorador, seleccione F12 para abrir las herramientas de desarrollo y, a continuación, seleccione la pestaña Consola ). Los errores notificados deben explicarse por sí mismos. Si necesita más ayuda, escriba un problema en GitHub.

<script type="text/javascript">
...
src: "https://js.monitor.azure.com/scripts/b/ai.2.min.js",
cfg: {
    instrumentationKey: "<instrumentation-key-guid>",
    loggingLevelConsole: 2
}});
</script>

Nota:

Durante la inicialización, el SDK realiza algunas comprobaciones básicas de las dependencias principales conocidas. Si el tiempo de ejecución actual no proporciona estas comprobaciones, el tiempo de ejecución notifica los errores como mensajes de advertencia a la consola (pero solo si el loggingLevelConsole valor de configuración es mayor que cero).

Si el SDK todavía no se inicializa, intente habilitar la configuración enableDebug. Después de realizar este cambio, todos los errores internos se producen como excepciones. Esto provoca una pérdida de telemetría. Dado que esta configuración es solo para desarrolladores, probablemente provocará más excepciones debido a comprobaciones internas. Revise cada excepción para determinar qué problema está provocando un error en el SDK. Use la versión sinminificar del script (cambiando la extensión de nombre de archivo de .min.js a solo .js). De lo contrario, las excepciones son ilegibles. El código siguiente muestra los cambios de configuración del fragmento de código de ejemplo.

Advertencia

Esta configuración solo para desarrolladores nunca debe estar habilitada en un entorno de producción completo porque al hacerlo, se pierde la telemetría.

<script type="text/javascript">
...
src: "https://js.monitor.azure.com/scripts/b/ai.2.js",
cfg:{
    instrumentationKey: "<instrumentation-key-guid>",
    enableDebug: true
}});
</script>

Si esta acción sigue sin proporcionar ninguna información, debe presentar un problema en GitHub proporcionando los detalles y un sitio de ejemplo, si usa uno. Incluya la versión del explorador, el sistema operativo y los detalles del marco de JavaScript para ayudar a identificar el problema.

Causa 4: Bloqueo de la red CDN de JavaScript de Application Insights

Es posible bloquear una red CDN si un punto de conexión de CDN del SDK de JavaScript de Application Insights se notifica o se identifica como no seguro. En esta situación, el punto de conexión está bloqueado públicamente y los consumidores de estas listas comienzan a bloquear todo el acceso.

Para resolver este problema, el propietario del punto de conexión de CDN debe trabajar con la entidad de inclusión en la lista de bloqueos que marcó el punto de conexión como no seguro. A continuación, la entidad de lista de bloqueo puede quitar el punto de conexión de la lista pertinente.

Compruebe los siguientes sitios web de seguridad de Internet para saber si identifican el punto de conexión de CDN como no seguro:

Puede tardar mucho tiempo en resolver este problema. Es posible que los usuarios o los departamentos de TI corporativos tengan que forzar una actualización o permitir explícitamente los puntos de conexión de la red CDN. La cantidad total de tiempo necesario para resolver este problema depende de la frecuencia necesaria para que la aplicación, el firewall o el entorno actualicen sus copias locales de las listas.

Si el punto de conexión de CDN se identifica como no seguro, cree una incidencia de soporte técnico para resolver el problema lo antes posible.

En las secciones siguientes se describe más específicamente cómo puede producirse un bloqueo y cómo corregir el bloqueo.

Causa 4a: bloqueo de usuario (explorador, bloqueador instalado o firewall personal)

Compruebe si los usuarios han realizado alguna de las siguientes acciones de configuración:

  • Instalado un complemento del explorador (normalmente en forma de anuncio, malware o bloqueador de elementos emergentes)

  • Bloqueados o no permitidos los puntos de conexión de la red CDN de Application Insights en su explorador o proxy

  • Se ha configurado una regla de firewall que provoca un bloqueo del dominio de CDN para el SDK (o un error al resolver la entrada DNS).

Solución 4a: Agregar excepciones de lista de bloqueos para puntos de conexión de CDN

Si los usuarios han tomado alguna de las acciones de configuración enumeradas, trabaje con ellas (o proporcione documentación) para permitir los puntos de conexión de la red CDN.

Es posible que los usuarios hayan instalado complementos que usen la lista de bloqueo pública. Si no es así, probablemente usen otra solución configurada manualmente o los complementos usen una lista de bloqueos de dominio privado.

Indique a los usuarios que permitan la descarga de scripts desde los puntos de conexión de la red CDN de Application Insights mediante la inclusión de los puntos de conexión en la lista de excepciones de regla de firewall o complemento de su explorador. Estas listas varían en función del entorno de usuario.

Este es un ejemplo de esta situación que muestra cómo configurar Google Chrome para permitir o bloquear el acceso a sitios web.

Causa 4b: bloqueo del firewall corporativo

Si los usuarios están en una red corporativa, es probable que el firewall corporativo sea el origen de la obstrucción de la red CDN. El departamento de TI corporativo probablemente ha implementado algún tipo de sistema de filtrado de Internet.

Solución 4b1: Adición de excepciones para puntos de conexión de CDN para empresas

Importante

¿Los usuarios usan una nube privada y no tienen acceso a la red pública de Internet? En este caso, debe usar los paquetes npm de Application Insights para insertar el SDK o hospedar el SDK de Application Insights en su propia red CDN.

Trabaje con el departamento de TI de su empresa para permitir las reglas necesarias para los usuarios. Esta solución es similar a agregar excepciones para los usuarios. Pida al departamento de TI que configure los puntos de conexión de la red CDN de Application Insights para su descarga incluyéndolos (o quitándolos) en cualquier servicio de lista de bloqueos de dominios o de listas de permitidos.

Solución 4b2: hospedar el SDK en su propia red CDN

En lugar de hacer que los usuarios descarguen el SDK de Application Insights desde la red CDN pública, puede hospedar el SDK de Application Insights en su propio punto de conexión de CDN. Se recomienda usar una versión específica (ai.2.#.#.min.js) del SDK para facilitar la identificación de la versión que usa. Además, actualice el SDK periódicamente a la versión actual (ai.2.min.js) para que pueda usar las correcciones de errores y las nuevas características que estén disponibles.

Solución 4b3: Uso de paquetes npm para insertar el SDK de Application Insights

En lugar de usar el fragmento de código y agregar puntos de conexión de RED CDN públicos, puede usar los paquetes npm para incluir el SDK como parte de sus propios archivos de JavaScript. El SDK se convierte en otro paquete dentro de sus propios scripts. Para obtener más información, consulte la sección de configuración basada en npm de la página gitHub del SDK de JavaScript de Application Insights.

Nota:

Se recomienda que, cuando use paquetes npm, también use algún tipo de agrupación de JavaScript para ayudarle a realizar la división y minificación de código.

Al igual que con el fragmento de código, los mismos problemas de bloqueo que aparecen aquí pueden afectar a sus propios scripts (con o sin usar los paquetes npm del SDK). En función de la aplicación, los usuarios y el marco de trabajo, es posible que considere la posibilidad de implementar algo similar a la lógica del fragmento de código para detectar y notificar estos problemas.

Solución de problemas de compatibilidad con mapas de origen para aplicaciones JavaScript

En la tabla siguiente se explican determinados problemas que implican compatibilidad con mapas de origen para aplicaciones JavaScript y se ofrecen estrategias para ayudar a corregir estos problemas.

Problema Descripción
Configuración necesaria del control de acceso basado en rol de Azure (RBAC de Azure) en el contenedor de blobs A cualquier usuario del portal que use esta característica se le debe asignar al menos un rol lector de datos de Storage Blob para el contenedor de blobs. Debe asignar este rol a cualquier persona que quiera usar los mapas de origen a través de esta característica. En función de cómo se haya creado el contenedor, es posible que este rol no se haya asignado automáticamente a usted ni a su equipo.
Mapa de origen no encontrado Para corregir este problema, realice las siguientes acciones:
  1. Compruebe que el mapa de origen correspondiente se carga en el contenedor de blobs correcto.
  2. Compruebe que el archivo de mapa de origen obtiene su nombre del archivo JavaScript al que se asigna y que tiene una extensión de nombre de archivo .map . Por ejemplo, /static/js/main.4e2ca5fa.chunk.js busca el blob denominado main.4e2ca5fa.chunk.js.map.
  3. Compruebe la consola del explorador para saber si está registrando algún error. Incluya esta salida en cualquier vale de soporte técnico.

Corrección de la advertencia "Click Event rows with no parentId value" (Hacer clic en filas de eventos sin ningún valor parentId)

Al usar Application Insights y el complemento Click Analytics Auto-Collection en la aplicación, es posible que aparezca la siguiente advertencia de telemetría en el libro de Application Insights: "Haga clic en Filas de eventos sin ningún valor parentId".

Causa

Este problema puede producirse si el identificador primario no se especifica en el elemento HTML primario. Esta condición hace que el evento se desencadene en todos sus elementos primarios.

Solución

Para corregir este problema, agregue el data-parentid atributo o data-<customPrefix>-parentid al elemento HTML primario. Este es un ejemplo del código HTML:

<div data-heart-id="demo Header" data-heart-parentid="demo.Header" data-heart-parent-group="demo.Header.Group">

Pasos siguientes

Aviso de declinación de responsabilidades sobre la información de terceros

Los productos de otros fabricantes que se mencionan en este artículo han sido creados por compañías independientes de Microsoft. Microsoft no ofrece ninguna garantía, ya sea implícita o de otro tipo, sobre la confiabilidad o el rendimiento de dichos productos.

Ponte en contacto con nosotros para obtener ayuda

Si tiene preguntas o necesita ayuda, cree una solicitud de soporte o busque consejo en la comunidad de Azure. También puede enviar comentarios sobre el producto con los comentarios de la comunidad de Azure.