Application Insights para páginas webApplication Insights for web pages

Obtenga información sobre el rendimiento y la utilización de su página web o aplicación.Find out about the performance and usage of your web page or app. Si agrega Application Insights al script de la página, obtendrá los intervalos de carga de la página y de las llamadas AJAX, recuentos y detalles sobre las excepciones del explorador y los errores de AJAX, así como usuarios y recuentos de sesiones.If you add Application Insights to your page script, you get timings of page loads and AJAX calls, counts, and details of browser exceptions and AJAX failures, as well as users and session counts. Todos estos datos se pueden segmentar por página, sistema operativo del cliente y versión del explorador, geolocalización y otras dimensiones.All these can be segmented by page, client OS and browser version, geo location, and other dimensions. Puede establecer alertas sobre recuentos de errores o sobre cargas de página lentas.You can set alerts on failure counts or slow page loading. Y mediante la inserción de llamadas de seguimiento en el código de JavaScript, puede controlar cómo se utilizan las distintas características de la aplicación de la página web.And by inserting trace calls in your JavaScript code, you can track how the different features of your web page application are used.

Puede utilizar Application Insights con cualquier página web, solo tiene que agregar un pequeño fragmento de JavaScript.Application Insights can be used with any web pages - you just add a short piece of JavaScript. Si el servicio web es Java o ASP.NET, puede usar los SDK del lado servidor junto con el SDK de JavaScript del lado cliente para obtener una descripción completa del rendimiento de la aplicación.If your web service is Java or ASP.NET, you can use the server-side SDKs in conjunction with the client-side JavaScript SDK to get an end-to-end understanding of your app's performance.

Adición del SDK de JavaScriptAdding the JavaScript SDK

  1. En primer lugar, necesita un recurso de Application Insights.First you need an Application Insights resource. Si aún no tiene un recurso y una clave de instrumentación, siga las instrucciones para crear un nuevo recurso.If you don't already have a resource and instrumentation key, follow the create a new resource instructions.
  2. Copie la clave de instrumentación (también conocida como "iKey") del recurso al que desea que se envíe la telemetría de JavaScript (del paso 1). Lo agregará al valor instrumentationKey del SDK de JavaScript de Application Insights.Copy the instrumentation key (also known as "iKey") for the resource where you want your JavaScript telemetry to be sent (from step 1.) You will add it to the instrumentationKey setting of the Application Insights JavaScript SDK.
  3. Agregue el SDK de JavaScript de Application Insights a su página web o aplicación mediante una de las dos opciones siguientes:Add the Application Insights JavaScript SDK to your web page or app via one of the following two options:

Importante

Use solo un método para agregar el SDK de JavaScript a la aplicación.Only use one method to add the JavaScript SDK to your application. Si usa el programa de instalación de NPM, no use el fragmento de código y viceversa.If you use the NPM Setup, don't use the Snippet and vice versa.

Nota

El programa de instalación de NPM instala el SDK de JavaScript como una dependencia del proyecto, habilitando IntelliSense, mientras que el fragmento de código captura el SDK en tiempo de ejecución.NPM Setup installs the JavaScript SDK as a dependency to your project, enabling IntelliSense, whereas the Snippet fetches the SDK at runtime. Ambos admiten las mismas características.Both support the same features. Sin embargo, los desarrolladores que desean más eventos y configuración personalizados normalmente optan por el programa de instalación de NPM, mientras que los usuarios que buscan una habilitación rápida del análisis web integrado optan por el fragmento de código.However, developers who desire more custom events and configuration generally opt for NPM Setup whereas users looking for quick enablement of out-of-the-box web analytics opt for the Snippet.

Configuración basada en npmnpm based setup

Instale a través de NPM.Install via NPM.

npm i --save @microsoft/applicationinsights-web

Nota

Con este paquete se incluyen typings, por lo que no necesita instalar un paquete de typings independiente.Typings are included with this package, so you do not need to install a separate typings package.

import { ApplicationInsights } from '@microsoft/applicationinsights-web'

const appInsights = new ApplicationInsights({ config: {
  instrumentationKey: 'YOUR_INSTRUMENTATION_KEY_GOES_HERE'
  /* ...Other Configuration Options... */
} });
appInsights.loadAppInsights();
appInsights.trackPageView(); // Manually call trackPageView to establish the current user/session/pageview

Configuración basada en fragmento de códigoSnippet based setup

Si su aplicación no usa npm, puede instrumentar directamente las páginas web con Application Insights pegando este fragmento de código en la parte superior de cada una de las páginas.If your app does not use npm, you can directly instrument your webpages with Application Insights by pasting this snippet at the top of each your pages. Preferiblemente, debe ser el primer script de la sección <head> para que pueda supervisar cualquier posible problema con todas las dependencias y, opcionalmente, cualquier error de JavaScript.Preferably, it should be the first script in your <head> section so that it can monitor any potential issues with all of your dependencies and optionally any JavaScript errors. Si usa una aplicación de servidor de Blazor, agregue el fragmento de código en la parte superior del archivo _Host.cshtml en la sección <head>.If you are using Blazor Server App, add the snippet at the top of the file _Host.cshtml in the <head> section.

Para ayudar a realizar un seguimiento de la versión del fragmento de código que la aplicación usa, a partir de la versión 2.5.5, el evento de vista de página incluirá una nueva etiqueta "ai.internal.snippet" que contendrá la versión de fragmento de código identificada.To assist with tracking which version of the snippet your application is using, starting from version 2.5.5 the page view event will include a new tag "ai.internal.snippet" that will contain the identified snippet version.

El fragmento de código actual (que se muestra a continuación) se identificará como la versión "3".The current Snippet (listed below) will be identified as version "3".

<script type="text/javascript">
!function(T,l,y){var S=T.location,u="script",k="instrumentationKey",D="ingestionendpoint",C="disableExceptionTracking",E="ai.device.",I="toLowerCase",b="crossOrigin",w="POST",e="appInsightsSDK",t=y.name||"appInsights";(y.name||T[e])&&(T[e]=t);var n=T[t]||function(d){var g=!1,f=!1,m={initialize:!0,queue:[],sv:"4",version:2,config:d};function v(e,t){var n={},a="Browser";return n[E+"id"]=a[I](),n[E+"type"]=a,n["ai.operation.name"]=S&&S.pathname||"_unknown_",n["ai.internal.sdkVersion"]="javascript:snippet_"+(m.sv||m.version),{time:function(){var e=new Date;function t(e){var t=""+e;return 1===t.length&&(t="0"+t),t}return e.getUTCFullYear()+"-"+t(1+e.getUTCMonth())+"-"+t(e.getUTCDate())+"T"+t(e.getUTCHours())+":"+t(e.getUTCMinutes())+":"+t(e.getUTCSeconds())+"."+((e.getUTCMilliseconds()/1e3).toFixed(3)+"").slice(2,5)+"Z"}(),iKey:e,name:"Microsoft.ApplicationInsights."+e.replace(/-/g,"")+"."+t,sampleRate:100,tags:n,data:{baseData:{ver:2}}}}var h=d.url||y.src;if(h){function a(e){var t,n,a,i,r,o,s,c,p,l,u;g=!0,m.queue=[],f||(f=!0,t=h,s=function(){var e={},t=d.connectionString;if(t)for(var n=t.split(";"),a=0;a<n.length;a++){var i=n[a].split("=");2===i.length&&(e[i[0][I]()]=i[1])}if(!e[D]){var r=e.endpointsuffix,o=r?e.location:null;e[D]="https://"+(o?o+".":"")+"dc."+(r||"services.visualstudio.com")}return e}(),c=s[k]||d[k]||"",p=s[D],l=p?p+"/v2/track":config.endpointUrl,(u=[]).push((n="SDK LOAD Failure: Failed to load Application Insights SDK script (See stack for details)",a=t,i=l,(o=(r=v(c,"Exception")).data).baseType="ExceptionData",o.baseData.exceptions=[{typeName:"SDKLoadFailed",message:n.replace(/\./g,"-"),hasFullStack:!1,stack:n+"\nSnippet failed to load ["+a+"] -- Telemetry is disabled\nHelp Link: https://go.microsoft.com/fwlink/?linkid=2128109\nHost: "+(S&&S.pathname||"_unknown_")+"\nEndpoint: "+i,parsedStack:[]}],r)),u.push(function(e,t,n,a){var i=v(c,"Message"),r=i.data;r.baseType="MessageData";var o=r.baseData;return o.message='AI (Internal): 99 message:"'+("SDK LOAD Failure: Failed to load Application Insights SDK script (See stack for details) ("+n+")").replace(/\"/g,"")+'"',o.properties={endpoint:a},i}(0,0,t,l)),function(e,t){if(JSON){var n=T.fetch;if(n&&!y.useXhr)n(t,{method:w,body:JSON.stringify(e),mode:"cors"});else if(XMLHttpRequest){var a=new XMLHttpRequest;a.open(w,t),a.setRequestHeader("Content-type","application/json"),a.send(JSON.stringify(e))}}}(u,l))}function i(e,t){f||setTimeout(function(){!t&&m.core||a()},500)}var e=function(){var n=l.createElement(u);n.src=h;var e=y[b];return!e&&""!==e||"undefined"==n[b]||(n[b]=e),n.onload=i,n.onerror=a,n.onreadystatechange=function(e,t){"loaded"!==n.readyState&&"complete"!==n.readyState||i(0,t)},n}();y.ld<0?l.getElementsByTagName("head")[0].appendChild(e):setTimeout(function(){l.getElementsByTagName(u)[0].parentNode.appendChild(e)},y.ld||0)}try{m.cookie=l.cookie}catch(p){}function t(e){for(;e.length;)!function(t){m[t]=function(){var e=arguments;g||m.queue.push(function(){m[t].apply(m,e)})}}(e.pop())}var n="track",r="TrackPage",o="TrackEvent";t([n+"Event",n+"PageView",n+"Exception",n+"Trace",n+"DependencyData",n+"Metric",n+"PageViewPerformance","start"+r,"stop"+r,"start"+o,"stop"+o,"addTelemetryInitializer","setAuthenticatedUserContext","clearAuthenticatedUserContext","flush"]),m.SeverityLevel={Verbose:0,Information:1,Warning:2,Error:3,Critical:4};var s=(d.extensionConfig||{}).ApplicationInsightsAnalytics||{};if(!0!==d[C]&&!0!==s[C]){method="onerror",t(["_"+method]);var c=T[method];T[method]=function(e,t,n,a,i){var r=c&&c(e,t,n,a,i);return!0!==r&&m["_"+method]({message:e,url:t,lineNumber:n,columnNumber:a,error:i}),r},d.autoExceptionInstrumented=!0}return m}(y.cfg);(T[t]=n).queue&&0===n.queue.length&&n.trackPageView({})}(window,document,{
src: "https://az416426.vo.msecnd.net/scripts/b/ai.2.min.js", // The SDK URL Source
//name: "appInsights", // Global SDK Instance name defaults to "appInsights" when not supplied
//ld: 0, // Defines the load delay (in ms) before attempting to load the sdk. -1 = block page load and add to head. (default) = 0ms load after timeout,
//useXhr: 1, // Use XHR instead of fetch to report failures (if available),
//crossOrigin: "anonymous", // When supplied this will add the provided value as the cross origin attribute on the script tag 
cfg: { // Application Insights Configuration
    instrumentationKey: "YOUR_INSTRUMENTATION_KEY_GOES_HERE"
    /* ...Other Configuration Options... */
}});
</script>

Nota

Para mejorar la legibilidad y reducir errores potenciales de JavaScript, todas las opciones de configuración posibles se muestran en una nueva línea en el código del fragmento de código anterior. Si no desea cambiar el valor de una línea comentada, se puede quitar.For readability and to reduce possible JavaScript errors, all of the possible configuration options are listed on a new line in snippet code above, if you don't want to change the value of a commented line it can be removed.

Informes de errores de carga de scriptReporting Script load failures

Esta versión del fragmento detecta errores e informa de ellos al cargar el SDK desde la red CDN como una excepción en el portal de Azure Monitor (en errores > excepciones > explorador). Esta excepción proporciona visibilidad en los errores de este tipo para que tenga en cuenta que la aplicación no informa de la telemetría (u otras excepciones) según lo esperado.This version of the snippet detects and reports failures when loading the SDK from the CDN as an exception to the Azure Monitor portal (under the failures > exceptions > browser), this exception provides visibility into failures of this type so that you are aware that your application is not reporting telemetry (or other exceptions) as expected. Esta señal es una medida importante para comprender que ha perdido la telemetría porque el SDK no se cargó o se inicializó, lo que puede dar lugar a:This signal is an important measurement in understanding that you have lost telemetry because the SDK did not load or initialize which can lead to:

  • Informes incompletos del uso que los usuarios están haciendo (o intentan hacer ) del sitio;Under-reporting of how users are using (or trying to use) your site;
  • Falta de telemetría sobre el modo en que los usuarios finales usan su sitio;Missing telemetry on how your end users are using your site;
  • Ausencia de errores de JavaScript que podrían estar impidiendo que los usuarios finales usaran el sitio correctamente.Missing JavaScript errors that could potentially be blocking your end users from successfully using your site.

Para obtener detalles sobre esta excepción, vea la página de solución de problemas Error de carga del SDK.For details on this exception see the SDK load failure troubleshooting page.

Los informes de este error como una excepción en el portal no usan la opción de configuración disableExceptionTracking de la configuración de Application Insights y, por tanto, si se produce este error, el fragmento de código siempre lo notificará, aunque la compatibilidad con window.onerror esté deshabilitada.Reporting of this failure as an exception to the portal does not use the configuration option disableExceptionTracking from the application insights configuration and therefore if this failure occurs it will always be reported by the snippet, even when the window.onerror support is disabled.

Los informes de errores de carga del SDK NO se admiten específicamente en IE 8 (o versiones inferiores).Reporting of SDK load failures is specifically NOT supported on IE 8 (or less). Esto ayuda a disminuir el tamaño reducido del fragmento de código suponiendo que la mayoría de los entornos no usan exclusivamente IE 8 o una versión inferior.This assists with reducing the minified size of the snippet by assuming that most environments are not exclusively IE 8 or less. Si tiene este requisito y desea recibir estas excepciones, deberá incluir un polyfill de fetch o crear su propia versión de fragmento de código que use XDomainRequest en lugar de XMLHttpRequest. Se recomienda usar el código fuente del fragmento de código proporcionado como punto de partida.If you have this requirement and you wish to receive these exceptions, you will need to either include a fetch poly fill or create you own snippet version that uses XDomainRequest instead of XMLHttpRequest, it is recommended that you use the provided snippet source code as a starting point.

Nota

Si usa una versión anterior del fragmento de código, se recomienda encarecidamente que actualice a la versión más reciente para que reciba estos problemas no notificados previamente.If you are using a previous version of the snippet, it is highly recommended that you update to the latest version so that you will receive these previously unreported issues.

Opciones de configuración del fragmento de códigoSnippet configuration options

Ahora, todas las opciones de configuración se han trasladado al final del script para evitar la introducción accidental de errores de JavaScript que no solo harían que el SDK no pudiera cargarse, sino que también deshabilitaría la notificación del error.All configuration options have now been move towards the end of the script to help avoid accidentally introducing JavaScript errors that would not just cause the SDK to fail to load, but also it would disable the reporting of the failure.

Cada opción de configuración se muestra arriba en una nueva línea. Si no desea invalidar el valor predeterminado de un elemento mostrado como [opcional], puede quitar esa línea para minimizar el tamaño resultante de la página devuelta.Each configuration option is shown above on a new line, if you don't wish to override the default value of an item listed as [optional] you can remove that line to minimize the resulting size of your returned page.

Las opciones de configuración disponibles son las siguientes:The available configuration options are

NombreName TipoType DescripciónDescription
srcsrc string [obligatorio]string [required] Dirección URL completa desde la que se va a cargar el SDK.The full URL for where to load the SDK from. Este valor se usa para el atributo "src" de una etiqueta <script /> agregada dinámicamente.This value is used for the "src" attribute of a dynamically added <script /> tag. Puede usar la ubicación de la red CDN pública o la suya propia hospedada de forma privada.You can use the public CDN location or your own privately hosted one.
namename cadena [opcional]string [optional] El nombre global del SDK inicializado. El valor predeterminado es appInsights.The global name for the initialized SDK, defaults to appInsights. Por lo tanto, window.appInsights será una referencia a la instancia inicializada.So window.appInsights will be a reference to the initialized instance. Nota: Si proporciona un valor de nombre o una instancia anterior parece estar asignada (mediante el nombre global appInsightsSDK), este valor de nombre también se definirá en el espacio de nombres global como window.appInsightsSDK=<name value>. El código de inicialización del SDK requiere todo esto para asegurarse de que está inicializando y actualizando los métodos de proxy y esqueleto del fragmento de código correctos.Note: if you provide a name value or a previous instance appears to be assigned (via the global name appInsightsSDK) then this name value will also be defined in the global namespace as window.appInsightsSDK=<name value>, this is required by the SDK initialization code to ensure it's initializing and updating the correct snippet skeleton and proxy methods.
ldld número en ms [opcional]number in ms [optional] Define el retraso de carga que se debe esperar antes de intentar cargar el SDK.Defines the load delay to wait before attempting to load the SDK. El valor predeterminado es 0 ms y cualquier valor negativo agregará una etiqueta de script inmediatamente a la región <head> de la página, que luego bloqueará el evento de carga de la página hasta que se cargue el script (o se produzca un error).Default value is 0ms and any negative value will immediately add a script tag to the <head> region of the page, which will then block the page load event until to script is loaded (or fails).
useXhruseXhr booleano [opcional]boolean [optional] Este valor solo se usa para notificar errores de carga del SDK.This setting is used only for reporting SDK load failures. Los informes intentarán primero usar fetch() si está disponible y luego recurrirán a XHR. Si establece este valor en true, simplemente se omitirá la comprobación de fetch.Reporting will first attempt to use fetch() if available and then fallback to XHR, setting this value to true just bypasses the fetch check. El uso de este valor solo es necesario si la aplicación se usa en un entorno en el que fetch no enviaría los eventos de error.Use of this value is only be required if your application is being used in an environment where fetch would fail to send the failure events.
crossOrigincrossOrigin cadena [opcional]string [optional] Al incluir este valor, la etiqueta de script agregada para descargar el SDK incluirá el atributo crossOrigin con este valor de cadena.By including this setting, the script tag added to download the SDK will include the crossOrigin attribute with this string value. Cuando no se define (que es la opción predeterminada), no se agrega ningún atributo crossOrigin.When not defined (the default) no crossOrigin attribute is added. Los valores recomendados no se definen (que es la opción predeterminada); ""; o "anonymous" (para todos los valores válidos, consulte la documentación Atributo HTML: crossorigin)Recommended values are not defined (the default); ""; or "anonymous" (For all valid values see HTML attribute: crossorigin documentation)
cfgcfg objeto [obligatorio]object [required] Se trata de la configuración pasada al SDK de Application Insights durante la inicialización.The configuration passed to the Application Insights SDK during initialization.

Envío de telemetría a Azure PortalSending telemetry to the Azure portal

De forma predeterminada, el SDK de JavaScript de Application Insights recopila automáticamente un número de elementos de telemetría que son útiles para determinar el estado de la aplicación y la experiencia del usuario subyacente.By default the Application Insights JavaScript SDK autocollects a number of telemetry items that are helpful in determining the health of your application and the underlying user experience. Entre ellas se incluyen las siguientes:These include:

  • Excepciones no detectadas en la aplicación, incluida información sobre lo siguiente:Uncaught exceptions in your app, including information on
    • Seguimiento de la pilaStack trace
    • Detalles de la excepción y mensaje que acompaña al errorException details and message accompanying the error
    • Número de línea y columna del errorLine & column number of error
    • Dirección URL en la que se produjo el errorURL where error was raised
  • Solicitudes de dependencia de red realizadas por las solicitudes XHR and Fetch (la recopilación de capturas está deshabilitada de forma predeterminada) de la aplicación, incluida información sobre lo siguiente:Network Dependency Requests made by your app XHR and Fetch (fetch collection is disabled by default) requests, include information on
    • Dirección URL del origen de dependenciaUrl of dependency source
    • Comando y método usado para solicitar la dependenciaCommand & Method used to request the dependency
    • Duración de la solicitudDuration of the request
    • Código de resultado y estado correcto de la solicitudResult code and success status of the request
    • Identificador (si existe) del usuario que realiza la solicitudID (if any) of user making the request
    • Contexto de correlación (si existe) en el que se realiza la solicitudCorrelation context (if any) where request is made
  • Información del usuario (por ejemplo, ubicación, red, IP)User information (for example, Location, network, IP)
  • Información del dispositivo (por ejemplo, explorador, sistema operativo, versión, idioma, modelo)Device information (for example, Browser, OS, version, language, model)
  • Información de la sesiónSession information

Inicializadores de telemetríaTelemetry initializers

Los inicializadores de telemetría se usan para modificar el contenido de la telemetría recopilada antes de enviarla desde el explorador del usuario.Telemetry initializers are used to modify the contents of collected telemetry before being sent from the user's browser. También se pueden usar para impedir que se envíen determinados datos de telemetría, devolviendo false.They can also be used to prevent certain telemetry from being sent, by returning false. Se pueden agregar varios inicializadores de telemetría a la instancia de Application Insights, que se ejecutarán en el orden en el que se han agregado.Multiple telemetry initializers can be added to your Application Insights instance, and they are executed in order of adding them.

El argumento de entrada en addTelemetryInitializer es una devolución de llamada que toma ITelemetryItem como argumento y devuelve boolean o void.The input argument to addTelemetryInitializer is a callback that takes a ITelemetryItem as an argument and returns a boolean or void. Si devuelve false, no se envía el elemento de telemetría, sino que pasa al siguiente inicializador de telemetría, si existe, o se envía al punto de conexión de recopilación de telemetría.If returning false, the telemetry item is not sent, else it proceeds to the next telemetry initializer, if any, or is sent to the telemetry collection endpoint.

Ejemplo de uso de inicializadores de telemetría:An example of using telemetry initializers:

var telemetryInitializer = (envelope) => {
  envelope.data.someField = 'This item passed through my telemetry initializer';
};
appInsights.addTelemetryInitializer(telemetryInitializer);
appInsights.trackTrace({message: 'This message will use a telemetry initializer'});

appInsights.addTelemetryInitializer(() => false); // Nothing is sent after this is executed
appInsights.trackTrace({message: 'this message will not be sent'}); // Not sent

ConfiguraciónConfiguration

La mayoría de los campos de configuración tienen un nombre que permite establecer false como valor predeterminado.Most configuration fields are named such that they can be defaulted to false. Todos los campos son opcionales, excepto instrumentationKey.All fields are optional except for instrumentationKey.

NombreName Valor predeterminadoDefault DescripciónDescription
instrumentationKeyinstrumentationKey nullnull ObligatorioRequired
La clave de instrumentación que ha obtenido en Azure Portal.Instrumentation key that you obtained from the Azure portal.
accountIdaccountId nullnull Un identificador de cuenta opcional, si su aplicación agrupa a los usuarios en cuentas.An optional account ID, if your app groups users into accounts. Sin espacios, comas, puntos y comas, signos igual o barras verticales.No spaces, commas, semicolons, equals, or vertical bars
sessionRenewalMssessionRenewalMs 18000001800000 Se registra una sesión si el usuario está inactivo durante este período de tiempo en milisegundos.A session is logged if the user is inactive for this amount of time in milliseconds. El valor predeterminado es 30 minutos.Default is 30 minutes
sessionExpirationMssessionExpirationMs 8640000086400000 Se registra una sesión si ha continuado durante este período de tiempo en milisegundos.A session is logged if it has continued for this amount of time in milliseconds. El valor predeterminado es 24 horas.Default is 24 hours
maxBatchSizeInBytesmaxBatchSizeInBytes 1000010000 Tamaño máximo del lote de telemetría.Max size of telemetry batch. Si un lote supera este límite, se envía inmediatamente y se inicia un nuevo lote.If a batch exceeds this limit, it is immediately sent and a new batch is started
maxBatchIntervalmaxBatchInterval 1500015000 Cuánto tiempo deben recopilar datos de telemetría en lote antes de enviarlos (milisegundos).How long to batch telemetry for before sending (milliseconds)
disableExceptionTrackingdisableExceptionTracking falsefalse Si es true, las excepciones no se recopilan automáticamente.If true, exceptions are no autocollected. El valor predeterminado es False.Default is false.
disableTelemetrydisableTelemetry falsefalse Si es true, no se recopila ni se envía la telemetría.If true, telemetry is not collected or sent. El valor predeterminado es False.Default is false.
enableDebugenableDebug falsefalse Si es true, los datos de depuración internos se devuelven como una excepción en lugar de registrarse, independientemente de la configuración de registro del SDK.If true, internal debugging data is thrown as an exception instead of being logged, regardless of SDK logging settings. El valor predeterminado es False.Default is false.
Nota: Si se habilita este valor, se descartará la telemetría siempre que se produzca un error interno.Note: Enabling this setting will result in dropped telemetry whenever an internal error occurs. Esto puede ser útil para identificar rápidamente problemas con la configuración o el uso del SDK.This can be useful for quickly identifying issues with your configuration or usage of the SDK. Si no desea perder telemetría durante la depuración, considere la posibilidad de usar consoleLoggingLevel o telemetryLoggingLevel en lugar de enableDebug.If you do not want to lose telemetry while debugging, consider using consoleLoggingLevel or telemetryLoggingLevel instead of enableDebug.
loggingLevelConsoleloggingLevelConsole 00 Registra errores internos de Application Insights en la consola.Logs internal Application Insights errors to console.
0: desactivado0: off,
1: solo errores críticos1: Critical errors only,
2: todo (errores y advertencias)2: Everything (errors & warnings)
loggingLevelTelemetryloggingLevelTelemetry 11 Envía errores internos de Application Insights como telemetría.Sends internal Application Insights errors as telemetry.
0: desactivado0: off,
1: solo errores críticos1: Critical errors only,
2: todo (errores y advertencias)2: Everything (errors & warnings)
diagnosticLogIntervaldiagnosticLogInterval 1000010000 (interno) Intervalo de sondeo (en milisegundos) para la cola de registro interno(internal) Polling interval (in ms) for internal logging queue
samplingPercentagesamplingPercentage 100100 Porcentaje de eventos que se enviarán.Percentage of events that will be sent. El valor predeterminado es 100, lo que significa que se envían todos los eventos.Default is 100, meaning all events are sent. Establézcalo si desea conservar el límite de datos para aplicaciones a gran escala.Set this if you wish to preserve your data cap for large-scale applications.
autoTrackPageVisitTimeautoTrackPageVisitTime falsefalse Si es true, en una vista de página, se realiza un seguimiento del tiempo de visualización de la página instrumentada anterior, que se envía como telemetría, y se inicia un nuevo temporizador para la vista de página actual.If true, on a pageview, the previous instrumented page's view time is tracked and sent as telemetry and a new timer is started for the current pageview. El valor predeterminado es False.Default is false.
disableAjaxTrackingdisableAjaxTracking falsefalse Si es true, las llamadas Ajax no se recopilan automáticamente.If true, Ajax calls are not autocollected. El valor predeterminado es False.Default is false.
disableFetchTrackingdisableFetchTracking truetrue Si es true, las solicitudes Fetch no se recopilan automáticamente.If true, Fetch requests are not autocollected. El valor predeterminado es true.Default is true
overridePageViewDurationoverridePageViewDuration falsefalse Si es true, el comportamiento predeterminado de trackPageView se cambia para registrar el final del intervalo de duración de la vista de página cuando se llama a trackPageView.If true, default behavior of trackPageView is changed to record end of page view duration interval when trackPageView is called. Si es false y no se proporciona ninguna duración personalizada a trackPageView, el rendimiento de la vista de página se calcula mediante la API de tiempos de navegación.If false and no custom duration is provided to trackPageView, the page view performance is calculated using the navigation timing API. El valor predeterminado es False.Default is false.
maxAjaxCallsPerViewmaxAjaxCallsPerView 500500 El valor predeterminado es 500: controla cuántas llamadas AJAX se supervisarán por vista de página.Default 500 - controls how many Ajax calls will be monitored per page view. Establézcalo en -1 para supervisar todas las llamadas AJAX (ilimitadas) en la página.Set to -1 to monitor all (unlimited) Ajax calls on the page.
disableDataLossAnalysisdisableDataLossAnalysis truetrue Si es false, se comprobará al inicio en los búferes del remitente de telemetría interna si hay elementos que todavía no se hayan enviado.If false, internal telemetry sender buffers will be checked at startup for items not yet sent.
disableCorrelationHeadersdisableCorrelationHeaders falsefalse Si es false, el SDK agregará dos encabezados ("Request-Id" y "Request-Context") a todas las solicitudes de dependencia para correlacionarlas con las solicitudes correspondientes en el lado servidor.If false, the SDK will add two headers ('Request-Id' and 'Request-Context') to all dependency requests to correlate them with corresponding requests on the server side. El valor predeterminado es False.Default is false.
correlationHeaderExcludedDomainscorrelationHeaderExcludedDomains Deshabilite encabezados de correlación para dominios específicos.Disable correlation headers for specific domains
correlationHeaderDomainscorrelationHeaderDomains Habilite encabezados de correlación para dominios específicos.Enable correlation headers for specific domains
disableFlushOnBeforeUnloaddisableFlushOnBeforeUnload falsefalse El valor predeterminado es false.Default false. Si es true, no se llamará al método Flush cuando se desencadene un evento onBeforeUnload.If true, flush method will not be called when onBeforeUnload event triggers
enableSessionStorageBufferenableSessionStorageBuffer truetrue El valor predeterminado es true.Default true. Si es true, el búfer con toda la telemetría no enviada se guarda en el almacenamiento de la sesión.If true, the buffer with all unsent telemetry is stored in session storage. El búfer se restaura al cargar la página.The buffer is restored on page load
isCookieUseDisabledisCookieUseDisabled falsefalse El valor predeterminado es false.Default false. Si es true, el SDK no almacenará ni leerá ningún dato de las cookies.If true, the SDK will not store or read any data from cookies.
cookieDomaincookieDomain nullnull Dominio de cookies personalizado.Custom cookie domain. Resulta útil si desea compartir cookies de Application Insights entre subdominios.This is helpful if you want to share Application Insights cookies across subdomains.
isRetryDisabledisRetryDisabled falsefalse El valor predeterminado es false.Default false. Si es false, se produce un reintento con los errores 206 (parcialmente correcto), 408 (tiempo de espera), 429 (demasiadas solicitudes), 500 (error interno del servidor), 503 (servicio no disponible) y 0 (sin conexión, solo si se detecta).If false, retry on 206 (partial success), 408 (timeout), 429 (too many requests), 500 (internal server error), 503 (service unavailable), and 0 (offline, only if detected)
isStorageUseDisabledisStorageUseDisabled falsefalse Si es true, el SDK no almacenará ni leerá ningún dato del almacenamiento local o de la sesión.If true, the SDK will not store or read any data from local and session storage. El valor predeterminado es False.Default is false.
isBeaconApiDisabledisBeaconApiDisabled truetrue Si es false, el SDK enviará toda la telemetría mediante Beacon API.If false, the SDK will send all telemetry using the Beacon API
onunloadDisableBeacononunloadDisableBeacon falsefalse El valor predeterminado es false.Default false. Si la pestaña está cerrada, el SDK enviará la telemetría restante mediante la API Beacon .when tab is closed, the SDK will send all remaining telemetry using the Beacon API
sdkExtensionsdkExtension nullnull Establece el nombre de la extensión del SDK.Sets the sdk extension name. Solo puede contener caracteres alfabéticos.Only alphabetic characters are allowed. El nombre de la extensión se agrega como prefijo a la etiqueta "ai.internal.sdkVersion" (por ejemplo, "ext_javascript:2.0.0").The extension name is added as a prefix to the 'ai.internal.sdkVersion' tag (for example, 'ext_javascript:2.0.0'). El valor predeterminado es null.Default is null.
isBrowserLinkTrackingEnabledisBrowserLinkTrackingEnabled falsefalse El valor predeterminado es False.Default is false. Si es true, el SDK realizará un seguimiento de todas las solicitudes de Vínculo con exploradores.If true, the SDK will track all Browser Link requests.
appIdappId nullnull AppId se utiliza para la correlación entre las dependencias AJAX que se producen en el lado cliente con las solicitudes del lado servidor.AppId is used for the correlation between AJAX dependencies happening on the client-side with the server-side requests. Cuando Beacon API está habilitada, no se puede usar automáticamente, pero se puede establecer manualmente en la configuración.When Beacon API is enabled, it cannot be used automatically, but can be set manually in the configuration. El valor predeterminado es null.Default is null
enableCorsCorrelationenableCorsCorrelation falsefalse Si es true, el SDK agregará dos encabezados ("Request-Id" y "Request-Context") a todas las solicitudes CORS para correlacionar dependencias AJAX salientes con las solicitudes correspondientes en el lado servidor.If true, the SDK will add two headers ('Request-Id' and 'Request-Context') to all CORS requests to correlate outgoing AJAX dependencies with corresponding requests on the server side. El valor predeterminado es false.Default is false
namePrefixnamePrefix no definidoundefined Un valor opcional que se usará como sufijo de nombre para el nombre de cookies y localStorage.An optional value that will be used as name postfix for localStorage and cookie name.
enableAutoRouteTrackingenableAutoRouteTracking falsefalse Realice un seguimiento automático de los cambios de ruta en aplicaciones de página única (SPA).Automatically track route changes in Single Page Applications (SPA). Si es true, cada cambio de ruta enviará una nueva vista de página a Application Insights.If true, each route change will send a new Pageview to Application Insights. Los cambios de ruta hash (example.com/foo#bar) también se registran como nuevas vistas de página.Hash route changes (example.com/foo#bar) are also recorded as new page views.
enableRequestHeaderTrackingenableRequestHeaderTracking falsefalse Si es true, se realiza un seguimiento de los encabezados de solicitud AJAX y Fetch. El valor predeterminado es false.If true, AJAX & Fetch request headers is tracked, default is false.
enableResponseHeaderTrackingenableResponseHeaderTracking falsefalse Si es true, se realiza un seguimiento de los encabezados de respuesta de solicitud AJAX y Fetch. El valor predeterminado es false.If true, AJAX & Fetch request's response headers is tracked, default is false.
distributedTracingModedistributedTracingMode DistributedTracingModes.AI Establece del modo de seguimiento distribuido.Sets the distributed tracing mode. Si se establece el modo AI_AND_W3C o el modo W3C, se generarán los encabezados de contexto de seguimiento W3C (traceparent/tracestate) y se incluirán en todas las solicitudes salientes.If AI_AND_W3C mode or W3C mode is set, W3C trace context headers (traceparent/tracestate) will be generated and included in all outgoing requests. AI_AND_W3C se proporciona para la compatibilidad con versiones anteriores de cualquier servicio instrumentado de Application Insights heredado.AI_AND_W3C is provided for back-compatibility with any legacy Application Insights instrumented services. Consulte el ejemplo aquí.See example here.
enableAjaxErrorStatusTextenableAjaxErrorStatusText falsefalse El valor predeterminado es false.Default false. Si es true, incluye el texto de datos de error de respuesta en el evento de dependencia en solicitudes AJAX erróneas.If true, include response error data text in dependency event on failed AJAX requests.
enableAjaxPerfTrackingenableAjaxPerfTracking falsefalse El valor predeterminado es false.Default false. Marca para habilitar la búsqueda y la inclusión de intervalos de window.performance de explorador adicionales en las métricas notificadas de ajax (XHR y Fetch).Flag to enable looking up and including additional browser window.performance timings in the reported ajax (XHR and fetch) reported metrics.
maxAjaxPerfLookupAttemptsmaxAjaxPerfLookupAttempts 33 El valor predeterminado es 3.Defaults to 3. Número máximo de veces que se deben buscar los intervalos de window.performance (si están disponibles). Esto es necesario, ya que no todos los exploradores rellenan window.performance antes de notificar el final de la solicitud de XHR y para las solicitudes de fetch se agregan después de su terminación.The maximum number of times to look for the window.performance timings (if available), this is required as not all browsers populate the window.performance before reporting the end of the XHR request and for fetch requests this is added after its complete.
ajaxPerfLookupDelayajaxPerfLookupDelay 2525 Su valor predeterminado es 25 ms.Defaults to 25 ms. Cantidad de tiempo que hay que esperar antes de volver a intentar encontrar los intervalos de windows.performance para una solicitud ajax. El tiempo se da en milisegundos y se pasa directamente a setTimeout().The amount of time to wait before re-attempting to find the windows.performance timings for an ajax request, time is in milliseconds and is passed directly to setTimeout().
enableUnhandledPromiseRejectionTrackingenableUnhandledPromiseRejectionTracking falsefalse Si es true, los rechazos de promise no controlados se recopilarán automáticamente y se notificarán como un error de JavaScript.If true, unhandled promise rejections will be autocollected and reported as a JavaScript error. Cuando disableExceptionTracking es true (no realizar seguimiento de excepciones), el valor de configuración se omite y los rechazos de promise no controlados no se notifican.When disableExceptionTracking is true (don't track exceptions), the config value will be ignored and unhandled promise rejections will not be reported.

Habilitar el seguimiento del tiempo en la páginaEnable time-on-page tracking

Al establecer autoTrackPageVisitTime: true, se realiza un seguimiento del tiempo que un usuario permanece en cada página.By setting autoTrackPageVisitTime: true, the time a user spends on each page is tracked. En cada instancia nueva de PageView, el tiempo que pasó el usuario en la página anterior (previous) se envía como una métrica personalizada denominada PageVisitTime.On each new PageView, the duration the user spent on the previous page is sent as a custom metric named PageVisitTime. Esta métrica personalizada es visible en el Explorador de métricas como "Métricas basadas en registros".This custom metric is viewable in the Metrics Explorer as a "log-based metric".

Habilitar la correlaciónEnable Correlation

La correlación genera y envía datos que habilitan el seguimiento distribuido y alimenta la asignación de la aplicación, la vista de transacciones de un extremo a otro y otras herramientas de diagnóstico.Correlation generates and sends data that enables distributed tracing and powers the application map, end-to-end transaction view, and other diagnostic tools.

En el ejemplo siguiente se muestran todas las configuraciones posibles necesarias para habilitar la correlación, con las notas específicas del escenario siguiente:The following example shows all possible configurations required to enable correlation, with scenario-specific notes below:

// excerpt of the config section of the JavaScript SDK snippet with correlation
// between client-side AJAX and server requests enabled.
cfg: { // Application Insights Configuration
    instrumentationKey: "YOUR_INSTRUMENTATION_KEY_GOES_HERE"
    disableFetchTracking: false,
    enableCorsCorrelation: true,
    enableRequestHeaderTracking: true,
    enableResponseHeaderTracking: true,
    correlationHeaderExcludedDomains: ['myapp.azurewebsites.net', '*.queue.core.windows.net']
    /* ...Other Configuration Options... */
}});
</script>

Si alguno de los servidores de terceros con los que se comunica el cliente no puede aceptar los encabezados Request-Id y Request-Context, y no es posible actualizar su configuración, deberá colocarlos en una lista de exclusión a través de la propiedad de configuración correlationHeaderExcludeDomains.If any of your third-party servers that the client communicates with cannot accept the Request-Id and Request-Context headers, and you cannot update their configuration, then you'll need to put them into an exclude list via the correlationHeaderExcludeDomains configuration property. Esta propiedad admite caracteres comodín.This property supports wildcards.

El lado servidor debe ser capaz de aceptar conexiones que cuenten con los encabezados que se detallan.The server-side needs to be able to accept connections with those headers present. En función de la configuración de Access-Control-Allow-Headers en el lado servidor, a menudo es necesario extender la lista del lado servidor mediante la adición manual de Request-Id y Request-Context.Depending on the Access-Control-Allow-Headers configuration on the server-side it is often necessary to extend the server-side list by manually adding Request-Id and Request-Context.

Access-Control-Allow-Headers: Request-Id, Request-Context, <your header>Access-Control-Allow-Headers: Request-Id, Request-Context, <your header>

Nota

Si usa los SDK de OpenTelemtry o Application Insights publicados en 2020 o posteriores, es recomendable usar WC3 TraceContext.If you are using OpenTelemtry or Application Insights SDKs released in 2020 or later, we recommend using WC3 TraceContext. Consulte la guía de configuración aquí.See configuration guidance here.

Aplicaciones de página únicaSingle Page Applications

De forma predeterminada, este SDK no controlará el cambio de ruta basado en el estado que se produce en las aplicaciones de página única.By default, this SDK will not handle state-based route changing that occurs in single page applications. Para habilitar el seguimiento automático de cambios de ruta para una aplicación de página única, puede agregar enableAutoRouteTracking: true a la configuración de instalación.To enable automatic route change tracking for your single page application, you can add enableAutoRouteTracking: true to your setup configuration.

Actualmente, ofrecemos un complemento React independiente que puede inicializarse con este SDK.Currently, we offer a separate React plugin, which you can initialize with this SDK. También llevará a cabo el seguimiento de cambios de ruta, así como la recopilación de otros datos de telemetría específicos de React.It will also accomplish route change tracking for you, as well as collect other React specific telemetry.

Nota

Use enableAutoRouteTracking: true solo si no está usando el complemento React.Use enableAutoRouteTracking: true only if you are not using the React plugin. Ambos pueden enviar nuevos valores PageView cuando cambia la ruta.Both are capable of sending new PageViews when the route changes. Si ambos están habilitados, es posible que se envíen valores de PageView duplicados.If both are enabled, duplicate PageViews may be sent.

ExtensionesExtensions

ExtensionesExtensions
ReactReact
React NativeReact Native
AngularAngular

Exploración de datos del explorador o del lado clienteExplore browser/client-side data

Para ver datos del explorador o del lado cliente, vaya a Métricas y agregue métricas individuales que le interesen:Browser/client-side data can be viewed by going to Metrics and adding individual metrics you are interested in:

Captura de pantalla de la página Métricas de Application Insights que muestra presentaciones gráficas de los datos de métricas de una aplicación web.

También puede ver los datos desde el SDK de JavaScript mediante la experiencia de explorador en el portal.You can also view your data from the JavaScript SDK via the Browser experience in the portal.

Seleccione Explorador y, a continuación, elija Errores o Rendimiento.Select Browser and then choose Failures or Performance.

Captura de pantalla de la página Explorador de Application Insights que muestra cómo agregar errores del explorador o el rendimiento del explorador a las métricas que se pueden ver de la aplicación web.

RendimientoPerformance

Captura de pantalla de la página Rendimiento de Application Insights muestra representaciones gráficas de las métricas Operaciones de una aplicación web.

DependenciasDependencies

Captura de pantalla de la página Rendimiento de Application Insights muestra representaciones gráficas de las métricas Dependencia de una aplicación web.

AnálisisAnalytics

Para consultar la telemetría recopilada por el SDK de JavaScript, seleccione el botón Ver en registros (Analytics) .To query your telemetry collected by the JavaScript SDK, select the View in Logs (Analytics) button. Al agregar una instrucción where de client_Type == "Browser", solo verá los datos del SDK de JavaScript y se excluirán todos los datos de telemetría del lado servidor recopilados por otros SDK.By adding a where statement of client_Type == "Browser", you will only see data from the JavaScript SDK and any server-side telemetry collected by other SDKs will be excluded.

// average pageView duration by name
let timeGrain=5m;
let dataset=pageViews
// additional filters can be applied here
| where timestamp > ago(1d)
| where client_Type == "Browser" ;
// calculate average pageView duration for all pageViews
dataset
| summarize avg(duration) by bin(timestamp, timeGrain)
| extend pageView='Overall'
// render result in a chart
| render timechart

Compatibilidad con mapa de origenSource Map Support

La pila de llamadas compactada de los datos de telemetría de las excepciones se puede descompactar en Azure Portal.The minified callstack of your exception telemetry can be unminified in the Azure portal. Todas las integraciones existentes en el panel Detalles de la excepción funcionarán con la pila de llamadas recién descompactada.All existing integrations on the Exception Details panel will work with the newly unminified callstack.

Puede vincular su recurso de Application Insights a su propio contenedor de Azure Blob Storage para desminificar las pilas de llamadas automáticamente.You can link your Application Insights resource to your own Azure Blob Storage container to automatically unminify call stacks. Para empezar, consulte el artículo sobre la compatibilidad con mapa de origen automático.To get started, see automatic source map support.

Arrastrar y colocarDrag and drop

  1. Seleccione un elemento de telemetría de excepciones en Azure Portal para ver sus detalles de transacción completa.Select an Exception Telemetry item in the Azure portal to view its "End-to-end transaction details"
  2. Identifique qué mapas de origen corresponden a esta pila de llamadas.Identify which source maps correspond to this call stack. El mapa de origen debe coincidir con el archivo de origen de un marco de pila, pero con el sufijo .map.The source map must match a stack frame's source file, but suffixed with .map
  3. Arrastre y coloque los mapas de origen en la pila de llamadas en Azure Portal Imagen animada que muestra cómo arrastrar y colocar archivos del mapa de origen de una carpeta de compilación a la ventana Pila de llamadas de Azure Portal.Drag and drop the source maps onto the call stack in the Azure portal An animated image showing how to drag and drop source map files from a build folder into the Call Stack window in the Azure portal.

Versión web básica de Application InsightsApplication Insights Web Basic

Para una experiencia ligera, puede instalar la versión básica de Application Insights.For a lightweight experience, you can instead install the basic version of Application Insights

npm i --save @microsoft/applicationinsights-web-basic

Esta versión incluye las características y funcionalidades mínimas, que puede ir ampliando como desee.This version comes with the bare minimum number of features and functionalities and relies on you to build it up as you see fit. Por ejemplo, no realiza ninguna recopilación automática (excepciones no detectadas, AJAX, etc.).For example, it performs no autocollection (uncaught exceptions, AJAX, etc.). En esta versión no se incluyen las API para enviar determinados tipos de telemetría, como trackTrace, trackException, etc., por lo que tendrá que proporcionar su propio contenedor.The APIs to send certain telemetry types, like trackTrace, trackException, etc., are not included in this version, so you will need to provide your own wrapper. La única API disponible es track.The only API that is available is track. Aquí tiene un ejemplo.A sample is located here.

EjemplosExamples

Para ver ejemplos ejecutables, consulte Ejemplos del SDK de Application Insights para JavaScript.For runnable examples, see Application Insights JavaScript SDK Samples.

Actualizar desde la versión anterior de Application InsightsUpgrading from the old version of Application Insights

Cambios importantes en la versión del SDK V2:Breaking changes in the SDK V2 version:

  • Para permitir mejores firmas de API, se han actualizado algunas de las llamadas API, como trackPageView o trackException.To allow for better API signatures, some of the API calls, such as trackPageView and trackException, have been updated. No se admite la ejecución en Internet Explorer 8 o en versiones anteriores del explorador.Running in Internet Explorer 8 and earlier versions of the browser is not supported.
  • El sobre de telemetría presenta cambios en el nombre y la estructura del campo debido a actualizaciones del esquema de datos.The telemetry envelope has field name and structure changes due to data schema updates.
  • context.operation se ha trasladado a context.telemetryTrace.Moved context.operation to context.telemetryTrace. También se han cambiado algunos campos (operation.id --> telemetryTrace.traceID).Some fields were also changed (operation.id --> telemetryTrace.traceID).
    • Para actualizar manualmente el identificador de la vista de página actual (por ejemplo, en las aplicaciones SPA), puede hacerlo con appInsights.properties.context.telemetryTrace.traceID = Util.generateW3CId().To manually refresh the current pageview ID (for example, in SPA apps), use appInsights.properties.context.telemetryTrace.traceID = Util.generateW3CId().

      Nota

      Para mantener el identificador de seguimiento único, donde usó anteriormente Util.newId(), ahora use Util.generateW3CId().To keep the trace ID unique, where you previously used Util.newId(), now use Util.generateW3CId(). En última instancia, terminan siendo el identificador de la operación.Both ultimately end up being the operation ID.

Si usa el SDK de producción de Application Insights actual (1.0.20) y desea ver si el nuevo SDK funciona en tiempo de ejecución, actualice la dirección URL en función de su escenario de carga de SDK actual.If you're using the current application insights PRODUCTION SDK (1.0.20) and want to see if the new SDK works in runtime, update the URL depending on your current SDK loading scenario.

  • Descarga mediante el escenario de CDN: actualice el fragmento de código que usa actualmente para que apunte a la dirección URL siguiente:Download via CDN scenario: Update the code snippet that you currently use to point to the following URL:

    "https://az416426.vo.msecnd.net/scripts/b/ai.2.min.js"
    
  • Escenario de npm: llame a downloadAndSetup para descargar el script ApplicationInsights completo de la red CDN e inicialícelo con la clave de instrumentación:npm scenario: Call downloadAndSetup to download the full ApplicationInsights script from CDN and initialize it with instrumentation key:

    appInsights.downloadAndSetup({
       instrumentationKey: "xxxxxxxx-xxxx-xxxx-xxxx-xxxxxxxx",
       url: "https://az416426.vo.msecnd.net/scripts/b/ai.2.min.js"
       });
    

Pruebe en el entorno interno para comprobar que la telemetría de supervisión funciona según lo esperado.Test in internal environment to verify monitoring telemetry is working as expected. Si todo funciona, actualice las firmas de API correctamente a la versión del SDK V2 y realice la implementación en los entornos de producción.If all works, update your API signatures appropriately to SDK V2 version and deploy in your production environments.

Rendimiento y sobrecarga del SDKSDK performance/overhead

Gracias a su tamaño comprimido con gzip de 36 KB y a los aproximadamente 15 ms que tarda en inicializarse, Application Insights agrega una cantidad insignificante de tiempo de carga a su sitio web.At just 36 KB gzipped, and taking only ~15 ms to initialize, Application Insights adds a negligible amount of loadtime to your website. Con el fragmento de código, los componentes mínimos de la biblioteca se cargan rápidamente.By using the snippet, minimal components of the library are quickly loaded. Mientras tanto, el script completo se descarga en segundo plano.In the meantime, the full script is downloaded in the background.

Mientras el script se descarga de la red CDN, todo el seguimiento de la página se pone en cola.While the script is downloading from the CDN, all tracking of your page is queued. Una vez que se completa la inicialización asincrónica del script descargado, se realiza un seguimiento de todos los eventos que se pusieron en cola.Once the downloaded script finishes asynchronously initializing, all events that were queued are tracked. Como resultado, no perderá telemetría durante todo el ciclo de vida de la página.As a result, you will not lose any telemetry during the entire life cycle of your page. Este proceso de instalación proporciona a la página un sistema de análisis sin interrupciones, invisible para los usuarios.This setup process provides your page with a seamless analytics system, invisible to your users.

Resumen:Summary:

  • versión de npm
  • tamaño comprimido con gzip
  • Tiempo de inicialización total de 15 ms15 ms overall initialization time
  • Cero datos de telemetría perdidos durante el ciclo de vida de la páginaZero tracking missed during life cycle of page

Compatibilidad con exploradoresBrowser support

Chrome Firefox IE Opera Safari
Chrome (última versión) ✔Chrome Latest ✔ Firefox (última versión) ✔Firefox Latest ✔ Internet Explorer 9 (y posteriores) y Edge ✔IE 9+ & Edge ✔
Compatible con IE 8IE 8- Compatible
Opera (última versión) ✔Opera Latest ✔ Safari (última versión) ✔Safari Latest ✔

Compatibilidad con ES3/IE8ES3/IE8 Compatibility

Como un SDK, hay numerosos usuarios que no pueden controlar los exploradores que sus clientes usan.As an SDK there are numerous users that cannot control the browsers that their customers use. Por lo tanto, es necesario asegurarse de que este SDK continúa "funcionando" y no interrumpe la ejecución de JS cuando lo carga un explorador más antiguo.As such we need to ensure that this SDK continues to "work" and does not break the JS execution when loaded by an older browser. Aunque resultaría idóneo no admitir IE8 ni los exploradores de generaciones anteriores (ES3), hay numerosos usuarios y clientes de gran tamaño que siguen requiriendo que las páginas "funcionen" y, como se comentó, pueden o no controlar el explorador que sus usuarios finales deciden usar.While it would be ideal to not support IE8 and older generation (ES3) browsers, there are numerous large customers/users that continue to require pages to "work" and as noted they may or cannot control which browser that their end users choose to use.

Esto NO significa que solamente se admita el conjunto común más bajo de características; simplemente indica que necesitamos mantener la compatibilidad con el código de ES3 y, al agregar nuevas características, deberá hacerse de manera que no interrumpan el análisis de JavaScript para ES3 y se agregarán como una característica opcional.This does NOT mean that we will only support the lowest common set of features, just that we need to maintain ES3 code compatibility and when adding new features they will need to be added in a manner that would not break ES3 JavaScript parsing and added as an optional feature.

Consulte GitHub para obtener todos los detalles sobre la compatibilidad con IE8See GitHub for full details on IE8 support

SDK de código abiertoOpen-source SDK

El SDK de JavaScript de Application Insights es de código abierto. Para ver el código fuente o para contribuir al proyecto, visite el repositorio de GitHub oficial.The Application Insights JavaScript SDK is open-source to view the source code or to contribute to the project visit the official GitHub repository.

Para obtener las actualizaciones y correcciones de errores más recientes, consulte las notas de la versión.For the latest updates and bug fixes consult the release notes.

Pasos siguientesNext steps