Application Insights für WebseitenApplication Insights for web pages

Informieren Sie sich über die Leistung und Nutzung Ihrer Webseite oder App.Find out about the performance and usage of your web page or app. Wenn Sie Application Insights Ihrem Seitenskript hinzufügen, erhalten Sie Zeitangaben zu Seitenladevorgängen und AJAX-Aufrufen, Anzahl und Details von Browserausnahmen und AJAX-Fehlern sowie die Anzahl von Benutzern und Sitzungen.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. Diese Informationen können jeweils nach Seite, Clientbetriebssystem und Browserversion, geografischer Position und anderen Dimensionen segmentiert werden.All these can be segmented by page, client OS and browser version, geo location, and other dimensions. Sie können Warnungen für die Fehleranzahl oder das langsame Laden von Seiten festlegen.You can set alerts on failure counts or slow page loading. Und indem Sie Ablaufverfolgungsaufrufe in JavaScript-Code einfügen, können Sie nachverfolgen, wie die verschiedenen Funktionen Ihre Webseitenanwendung genutzt werden.And by inserting trace calls in your JavaScript code, you can track how the different features of your web page application are used.

Application Insights kann mit allen Webseiten verwendet werden. Hierfür müssen Sie lediglich einen kurzen JavaScript-Codeabschnitt hinzufügen.Application Insights can be used with any web pages - you just add a short piece of JavaScript. Wenn Ihr Webdienst Java oder ASP.NET ist, können Sie die serverseitigen SDKs zusammen mit dem clientseitigen JavaScript SDK verwenden, um die Leistung Ihrer App vollständig zu verstehen.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.

Hinzufügen des JavaScript SDKAdding the JavaScript SDK

  1. Zuerst benötigen Sie eine Application Insights-Ressource.First you need an Application Insights resource. Wenn Sie noch keine Ressource und keinen Instrumentierungsschlüssel haben, folgen Sie den Anweisungen unter Erstellen einer neuen Ressource.If you don't already have a resource and instrumentation key, follow the create a new resource instructions.
  2. Kopieren Sie den Instrumentierungsschlüssel (auch „iKey“ genannt) der Ressource, an die Ihre JavaScript-Telemetriedaten (aus Schritt 1) gesendet werden sollen. Sie fügen sie der Einstellung instrumentationKey des Application Insights JavaScript SDK hinzu.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. Fügen Sie die Application Insights JavaScript SDK Ihrer Webseite oder App über eine der beiden folgenden Optionen hinzu:Add the Application Insights JavaScript SDK to your web page or app via one of the following two options:

Wichtig

Verwenden Sie nur eine Methode, um Ihrer Anwendung das JavaScript SDK hinzuzufügen.Only use one method to add the JavaScript SDK to your application. Wenn Sie das NPM-Setup verwenden, verwenden Sie nicht den Codeausschnitt und umgekehrt.If you use the NPM Setup, don't use the Snippet and vice versa.

Hinweis

Beim NPM-Setup wird das JavaScript SDK als eine Abhängigkeit in Ihrem Projekt installiert, wodurch IntelliSense aktiviert wird, während mit dem Codeausschnitt das SDK zur Laufzeit abgerufen wird.NPM Setup installs the JavaScript SDK as a dependency to your project, enabling IntelliSense, whereas the Snippet fetches the SDK at runtime. Beide unterstützen die gleichen Funktionen.Both support the same features. Entwickler, die weitere benutzerdefinierte Ereignisse und Konfigurationen wünschen, entscheiden sich in der Regel für das NPM-Setup, während sich Benutzer, die eine schnelle Aktivierung der standardmäßig verfügbaren Webanalyse wünschen, für den Codeausschnitt entscheiden.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.

npm-basiertes Setupnpm based setup

Führen Sie die Installation über NPM aus.Install via NPM.

npm i --save @microsoft/applicationinsights-web

Hinweis

Dieses Paket enthält Typisierungen. Sie müssen daher kein separates Typisierungspaket installieren.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

Ausschnittbasiertes SetupSnippet based setup

Wenn Ihre App npm nicht verwendet, können Sie Ihre Webseiten mit Application Insights direkt instrumentieren, indem Sie diesen Codeausschnitt am Anfang jeder Ihrer Seiten einfügen.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. Vorzugsweise sollte es das erste Skript in Ihrem <head>-Abschnitt sein, damit potenzielle Probleme mit allen Ihren Abhängigkeiten und optional auch alle JavaScript-Fehler überwacht werden können.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. Wenn Sie die Blazor-Server-App verwenden, fügen Sie den Codeausschnitt am Anfang der Datei _Host.cshtml im Abschnitt <head> ein.If you are using Blazor Server App, add the snippet at the top of the file _Host.cshtml in the <head> section.

Ab Version 2.5.5 enthält das Seitenansichtsereignis das neue Tag „ai.internal.snippet“, das wiederum die erkannte Version des Ausschnitts enthält. So können Sie leichter nachverfolgen, welche Version des Ausschnitts von Ihrer App verwendet wird.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.

Der aktuelle (folgende) Ausschnitt wird als zur Version 3 zugehörig erkannt.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>

Hinweis

Für eine bessere Lesbarkeit und zur Reduzierung möglicher JavaScript-Fehler werden alle möglichen Konfigurationsoptionen im Codeausschnitt oben in einer eigenen Zeile aufgeführt. Wenn Sie den Wert einer kommentierten Zeile nicht ändern möchten, kann diese entfernt werden.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.

Melden von SkriptladefehlernReporting Script load failures

Mit dieser Version des Ausschnitts werden Fehler erkannt und gemeldet, die beim Laden des SDK aus dem CDN auftreten. Diese Fehler werden dem Azure Monitor-Portal (unter „Fehler“ > „Ausnahmen“ > „Browser“) als Ausnahme gemeldet. Diese Ausnahme bietet Ihnen Einblicke in die Fehler dieses Typs, damit Sie wissen, dass Ihre Anwendung Telemetriedaten (oder andere Ausnahmen) nicht wie erwartet meldet.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. Dieses Signal ist wichtig, denn es informiert Sie darüber, dass Sie aufgrund eines Fehlers beim Laden oder Initialisieren des SDK Telemetriedaten verlieren. Dies kann zu folgenden Problemen führen: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:

  • Unzureichende Berichterstattung darüber, wie Benutzer Ihre Website verwenden (oder versuchen, dies zu tun)Under-reporting of how users are using (or trying to use) your site;
  • Fehlende Telemetriedaten dazu, wie Ihre Endbenutzer Ihre Website verwendenMissing telemetry on how your end users are using your site;
  • Fehlende JavaScript-Fehler, die unter Umständen verhindern, dass Ihre Endbenutzer Ihre Website erfolgreich nutzen könnenMissing JavaScript errors that could potentially be blocking your end users from successfully using your site.

Weitere Informationen zu dieser Ausnahme finden Sie unter Behandlung von SDK-Ladefehlern für JavaScript-Web-Apps.For details on this exception see the SDK load failure troubleshooting page.

Wenn dieser Fehler als Ausnahme an das Portal gemeldet wird, geschieht dies nicht mithilfe der Konfigurationsoption disableExceptionTracking aus der Application Insights-Konfiguration. Tritt dieser Fehler auf, wird er immer vom Codeausschnitt gemeldet, selbst wenn die Unterstützung für „window.onerror“ deaktiviert ist.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.

Die Berichterstattung über SDK-Ladefehler wird von Internet Explorer 8 (oder niedriger) NICHT unterstützt.Reporting of SDK load failures is specifically NOT supported on IE 8 (or less). Dies trägt dazu bei, die heruntergesetzte Größe des Ausschnitts zu reduzieren, indem davon ausgegangen wird, dass in den meisten Umgebungen nicht ausschließlich Internet Explorer 8 oder niedriger eingesetzt wird.This assists with reducing the minified size of the snippet by assuming that most environments are not exclusively IE 8 or less. Wenn diese Anforderung für Sie gilt und Sie diese Ausnahmen erhalten möchten, müssen Sie entweder einen fetch-Polyfill in den Code schreiben oder eine Version des Codeausschnitts erstellen, in der XDomainRequest anstelle von XMLHttpRequest eingesetzt wird. Es wird empfohlen, den bereitgestellten Quellcodeausschnitt als Ausgangspunkt zu verwenden.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.

Hinweis

Wenn Sie eine vorherige Version des Ausschnitts nutzen, wird dringend empfohlen, ein Update auf die neueste Version auszuführen, damit Sie über diese bisher nicht gemeldeten Probleme informiert werden.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.

Option für die Konfiguration des AusschnittsSnippet configuration options

Alle Konfigurationsoptionen wurden an das Ende des Skripts verlagert, damit nicht aus Versehen JavaScript-Fehler eingeführt werden, die nicht nur einen Ladefehler des SDK hervorrufen, sondern auch die Berichterstattung über diesen Fehler deaktivieren.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.

Jede Konfigurationsoption ist im Codeausschnitt oben in einer eigenen Zeile aufgeführt. Wenn Sie den Standardwert einer als „[optional]“ gelisteten Konfigurationsoption nicht überschreiben möchten, können Sie die Zeile entfernen, um die Größe der zurückgegebenen Zeile zu verringern.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.

Folgende Konfigurationsoptionen stehen zur Verfügung:The available configuration options are

NameName TypType BESCHREIBUNGDescription
srcsrc Zeichenfolge [erforderlich]string [required] Die vollständige URL, von der das SDK geladen werden soll.The full URL for where to load the SDK from. Dieser Wert wird für das Attribut „src“ eines dynamisch hinzugefügten <script />-Tags verwendet.This value is used for the "src" attribute of a dynamically added <script /> tag. Sie können die öffentliche CDN-Adresse oder eine privat gehostete nehmen.You can use the public CDN location or your own privately hosted one.
namename Zeichenfolge [optional]string [optional] Der globale Name des initialisierten SDK. Der Standardwert ist appInsights.The global name for the initialized SDK, defaults to appInsights. window.appInsights ist daher ein Verweis auf die initialisierte Instanz.So window.appInsights will be a reference to the initialized instance. Hinweis: Wenn Sie einen Namenswert angeben oder es scheint, als sei eine frühere Instanz (über den globalen Namen „appInsightsSDK“) zugewiesen, wird dieser Namenswert ebenfalls im globalen Namespace als window.appInsightsSDK=<name value> definiert. Dies wird durch den Initialisierungscode des SDK erzwungen, um sicherzustellen, dass die richtigen Methoden für das Ausschnittsgerüst und den Proxy initialisiert und aktualisiert werden.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 Nummer in ms [optional]number in ms [optional] Gibt die Lastverzögerungsdauer an, die gewartet werden muss, bevor versucht werden kann, dass SDK zu laden.Defines the load delay to wait before attempting to load the SDK. Der Standardwert sind 0 ms. Durch jeden negativen Wert wird dem <head>-Bereich der Seite umgehend ein Skripttag hinzugefügt. Das Skripttag blockiert das Seitenladeereignis, bis das Skript geladen ist (oder das Laden des Skripts fehlgeschlagen ist).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 boolesch [optional]boolean [optional] Diese Einstellung wird nur für die Berichterstattung über SDK-Ladefehler verwendet.This setting is used only for reporting SDK load failures. Bei der Berichterstattung wird zunächst auf die fetch()-Methode zurückgegriffen, falls diese verfügbar ist. Anschließend wird ein Fallback auf Xhr ausgeführt. Wenn Sie diesen Wert auf TRUE festlegen, wird schlicht die fetch-Überprüfung umgangen.Reporting will first attempt to use fetch() if available and then fallback to XHR, setting this value to true just bypasses the fetch check. Dieser Wert muss nur verwendet werden, wenn Ihre Anwendung in einer Umgebung ausgeführt wird, in der die fetch-Methode keine Fehlerereignisse senden kann.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 Zeichenfolge [optional]string [optional] Wenn Sie diese Einstellung aufnehmen, enthält das Skripttag, das für den SDK-Download hinzugefügt wurde, das Attribut „crossOrigin“ mit diesem Zeichenfolgenwert.By including this setting, the script tag added to download the SDK will include the crossOrigin attribute with this string value. Ist diese Einstellung nicht konfiguriert (Standardeinstellung), wird kein crossOrigin-Attribut hinzugefügt.When not defined (the default) no crossOrigin attribute is added. Es wird empfohlen, keinen Wert zu definieren (Standardeinstellung) oder die Werte "" oder "anonymous" (anonym) zu verwenden. (Eine vollständige Liste der zulässigen Werte finden Sie in der Dokumentation zum HTML-Attribut crossorigin)Recommended values are not defined (the default); ""; or "anonymous" (For all valid values see HTML attribute: crossorigin documentation)
cfgcfg Objekt [erforderlich]object [required] Die bei der Initialisierung an das Application Insights SDK übergebene Konfiguration.The configuration passed to the Application Insights SDK during initialization.

Senden von Telemetriedaten an das Azure-PortalSending telemetry to the Azure portal

Standardmäßig sammelt das Application Insights JavaScript SDK automatisch eine Reihe von Telemetrieelementen, die bei der Ermittlung der Integrität Ihrer Anwendung und der zugrunde liegenden Benutzeroberfläche hilfreich sind.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. Dazu gehören:These include:

  • Nicht abgefangene Ausnahmen in Ihrer App, einschließlich Informationen zuUncaught exceptions in your app, including information on
    • StapelüberwachungStack trace
    • Ausnahmedetails und Meldung, die den Fehler begleitetException details and message accompanying the error
    • Zeilen- und Spaltennummer des FehlersLine & column number of error
    • URL, bei der der Fehler ausgelöst wurdeURL where error was raised
  • Anforderungen an die Netzwerkabhängigkeit, die von den XHR und Fetch-Anforderungen Ihrer App ausgegeben werden (die Abrufsammlung ist standardmäßig deaktiviert), einschließlich Informationen zuNetwork Dependency Requests made by your app XHR and Fetch (fetch collection is disabled by default) requests, include information on
    • URL der AbhängigkeitsquelleUrl of dependency source
    • Befehl und Methode, der bzw. die zum Anfordern der Abhängigkeit verwendet wirdCommand & Method used to request the dependency
    • Dauer der AnforderungDuration of the request
    • Ergebniscode und Erfolgsstatus der AnforderungResult code and success status of the request
    • ID (sofern vorhanden) des Benutzers, der die Anforderung sendetID (if any) of user making the request
    • Korrelationskontext (falls vorhanden), in dem die Anforderung ausgegeben wirdCorrelation context (if any) where request is made
  • Benutzerinformationen (z.B. Speicherort, Netzwerk, IP)User information (for example, Location, network, IP)
  • Geräteinformationen (z. B. Browser, Betriebssystem, Version, Sprache, Modell)Device information (for example, Browser, OS, version, language, model)
  • SitzungsinformationenSession information

TelemetrieinitialisiererTelemetry initializers

Telemetrieinitialisierer werden verwendet, um den Inhalt der gesammelten Telemetriedaten zu ändern, bevor sie vom Browser des Benutzers gesendet werden.Telemetry initializers are used to modify the contents of collected telemetry before being sent from the user's browser. Sie können auch verwendet werden, um zu verhindern, dass bestimmte Telemetriedaten gesendet werden, indem sie false zurückgeben.They can also be used to prevent certain telemetry from being sent, by returning false. Ihrer Application Insights-Instanz können mehrere Telemetrieinitialisierer hinzugefügt werden, und sie werden ausgeführt, um sie hinzuzufügen.Multiple telemetry initializers can be added to your Application Insights instance, and they are executed in order of adding them.

Das Eingabeargument für addTelemetryInitializer ist ein Rückruf, der ein ITelemetryItem als Argument verwendet und ein boolean oder voidzurückgibt.The input argument to addTelemetryInitializer is a callback that takes a ITelemetryItem as an argument and returns a boolean or void. Bei Rückgabe von false wird das Telemetrieelement nicht gesendet. Andernfalls fährt es mit dem nächsten Telemetrieinitialisierer (falls vorhanden) fort, oder es wird an den Endpunkt der Telemetriedatensammlung gesendet.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.

Ein Beispiel für die Verwendung von Telemetrieinitialisierern: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

KonfigurationConfiguration

Die meisten Konfigurationsfelder werden so benannt, dass sie standardmäßig auf „false“ festgelegt werden können.Most configuration fields are named such that they can be defaulted to false. Alle Felder mit Ausnahme von instrumentationKey sind optional.All fields are optional except for instrumentationKey.

NameName StandardDefault BESCHREIBUNGDescription
instrumentationKeyinstrumentationKey NULLnull ErforderlichRequired
Instrumentierungsschlüssel, den Sie aus dem Azure-Portal abgerufen haben.Instrumentation key that you obtained from the Azure portal.
accountIdaccountId NULLnull Eine optionale Konto-ID, wenn Ihre App Benutzer in Konten gruppiert.An optional account ID, if your app groups users into accounts. Keine Leerzeichen, Kommas, Semikolons, Gleichheitszeichen oder senkrechten StricheNo spaces, commas, semicolons, equals, or vertical bars
sessionRenewalMssessionRenewalMs 18000001800000 Eine Sitzung wird protokolliert, wenn der Benutzer während dieser Zeitspanne (in Millisekunden) inaktiv ist.A session is logged if the user is inactive for this amount of time in milliseconds. Die Standardeinstellung ist „30 Minuten“.Default is 30 minutes
sessionExpirationMssessionExpirationMs 8640000086400000 Eine Sitzung wird protokolliert, wenn sie während dieser Zeitspanne (in Millisekunden) fortgesetzt wurde.A session is logged if it has continued for this amount of time in milliseconds. Die Standardeinstellung ist „24 Stunden“.Default is 24 hours
maxBatchSizeInBytesmaxBatchSizeInBytes 1000010000 Maximale Größe des Telemetriedatenbatches.Max size of telemetry batch. Wenn ein Batch diesen Grenzwert überschreitet, wird er sofort gesendet, und ein neuer Batch wird gestartet.If a batch exceeds this limit, it is immediately sent and a new batch is started
maxBatchIntervalmaxBatchInterval 1500015000 Dauer der Batchverarbeitung von Telemetriedaten vor dem Senden (Millisekunden)How long to batch telemetry for before sending (milliseconds)
disableExceptionTrackingdisableExceptionTracking falsefalse Bei „true“ werden Ausnahmen nicht automatisch gesammelt.If true, exceptions are no autocollected. Der Standardwert ist "false".Default is false.
disableTelemetrydisableTelemetry falsefalse Bei „true“ werden Telemetriedaten nicht gesammelt oder gesendet.If true, telemetry is not collected or sent. Der Standardwert ist "false".Default is false.
enableDebugenableDebug falsefalse Bei „true“ werden interne Debugdaten als eine Ausnahme ausgelöst statt protokolliert zu werden. Dies geschieht unabhängig von den SDK-Protokollierungseinstellungen.If true, internal debugging data is thrown as an exception instead of being logged, regardless of SDK logging settings. Der Standardwert ist "false".Default is false.
Hinweis: Wenn Sie diese Einstellung aktivieren, werden die Telemetriedaten beim Auftreten eines internen Fehlers verworfen.Note: Enabling this setting will result in dropped telemetry whenever an internal error occurs. Dies kann hilfreich sein, um Probleme mit Ihrer Konfiguration oder der Nutzung des SDK schnell zu identifizieren.This can be useful for quickly identifying issues with your configuration or usage of the SDK. Wenn beim Debuggen keine Telemetriedaten verloren gehen sollen, empfiehlt es sich, consoleLoggingLevel oder telemetryLoggingLevel statt enableDebug zu verwenden.If you do not want to lose telemetry while debugging, consider using consoleLoggingLevel or telemetryLoggingLevel instead of enableDebug.
loggingLevelConsoleloggingLevelConsole 00 Protokolliert interne Application Insights-Fehler in der Konsole.Logs internal Application Insights errors to console.
0: aus,0: off,
1: Nur schwerwiegende Fehler,1: Critical errors only,
2: Alles (Fehler und Warnungen)2: Everything (errors & warnings)
loggingLevelTelemetryloggingLevelTelemetry 11 Sendet interne Application Insights-Fehler als Telemetriedaten.Sends internal Application Insights errors as telemetry.
0: aus,0: off,
1: Nur schwerwiegende Fehler,1: Critical errors only,
2: Alles (Fehler und Warnungen)2: Everything (errors & warnings)
diagnosticLogIntervaldiagnosticLogInterval 1000010000 (intern) Abrufintervall (in ms) für interne Protokollierungswarteschlange(internal) Polling interval (in ms) for internal logging queue
samplingPercentagesamplingPercentage 100100 Prozentsatz der Ereignisse, die gesendet werden.Percentage of events that will be sent. Die Standardeinstellung ist „100“. Dies bedeutet, dass alle Ereignisse gesendet werden.Default is 100, meaning all events are sent. Legen Sie diesen Wert fest, wenn Sie Ihre Datenobergrenze für umfangreiche Anwendungen beibehalten möchten.Set this if you wish to preserve your data cap for large-scale applications.
autoTrackPageVisitTimeautoTrackPageVisitTime falsefalse Bei „true“ wird in einem Seitenaufruf die vorherige Ansichtszeit der instrumentierten Seite nachverfolgt und in Form von Telemetriedaten gesendet. Außerdem wird ein neuer Zeitgeber für den aktuellen Seitenaufruf gestartet.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. Der Standardwert ist "false".Default is false.
disableAjaxTrackingdisableAjaxTracking falsefalse Bei „true“ werden AJAX-Aufrufe nicht automatisch gesammelt.If true, Ajax calls are not autocollected. Der Standardwert ist "false".Default is false.
disableFetchTrackingdisableFetchTracking truetrue Bei „true“ werden Anforderungen zum Abrufen nicht automatisch gesammelt.If true, Fetch requests are not autocollected. Die Standardeinstellung ist „true“.Default is true
overridePageViewDurationoverridePageViewDuration falsefalse Bei „true“ wird das Standardverhalten von „trackPageView“ geändert, um bei dessen Aufruf das Ende des Intervalls für die Seitenaufrufdauer aufzuzeichnen.If true, default behavior of trackPageView is changed to record end of page view duration interval when trackPageView is called. Bei „false“ ohne Angabe eines benutzerdefinierten Zeitraums für „trackPageView“ wird die Seitenaufrufleistung mithilfe der Navigationszeit-API berechnet.If false and no custom duration is provided to trackPageView, the page view performance is calculated using the navigation timing API. Der Standardwert ist "false".Default is false.
maxAjaxCallsPerViewmaxAjaxCallsPerView 500500 Mit der Standardeinstellung „500“ wird gesteuert, wie viele Ajax-Aufrufe pro Seitenaufruf überwacht werden.Default 500 - controls how many Ajax calls will be monitored per page view. Legen Sie „–1“ fest, wenn alle (unbegrenzt) Ajax-Aufrufe auf der Seite überwacht werden sollen.Set to -1 to monitor all (unlimited) Ajax calls on the page.
disableDataLossAnalysisdisableDataLossAnalysis truetrue Bei „false“ werden interne Absenderpuffer für Telemetriedaten beim Start auf noch nicht gesendete Elemente überprüft.If false, internal telemetry sender buffers will be checked at startup for items not yet sent.
disableCorrelationHeadersdisableCorrelationHeaders falsefalse Bei „false“ fügt das SDK allen Abhängigkeitsanforderungen zwei Kopfzeilen (‚Request-Id‘ und ‚Request-Context‘) hinzu, um sie mit entsprechenden serverseitigen Anforderungen zu korrelieren.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. Der Standardwert ist "false".Default is false.
correlationHeaderExcludedDomainscorrelationHeaderExcludedDomains Korrelations-Header für bestimmte Domänen deaktivierenDisable correlation headers for specific domains
correlationHeaderDomainscorrelationHeaderDomains Korrelations-Header für bestimmte Domänen aktivierenEnable correlation headers for specific domains
disableFlushOnBeforeUnloaddisableFlushOnBeforeUnload falsefalse Die Standardeinstellung ist „false“.Default false. Bei „true“ wird die Methode „Flush“ (Leeren) beim Auslösen eines „onBeforeUnload“-Ereignisses nicht aufgerufen.If true, flush method will not be called when onBeforeUnload event triggers
enableSessionStorageBufferenableSessionStorageBuffer truetrue Die Standardeinstellung ist „true“.Default true. Bei „true“ wird der Puffer mit allen nicht gesendeten Telemetriedaten im Sitzungsspeicher gespeichert.If true, the buffer with all unsent telemetry is stored in session storage. Der Puffer wird beim Laden der Seite wiederhergestellt.The buffer is restored on page load
isCookieUseDisabledisCookieUseDisabled falsefalse Die Standardeinstellung ist „false“.Default false. Bei „true“ speichert oder liest das SDK keine Daten aus Cookies.If true, the SDK will not store or read any data from cookies.
cookieDomaincookieDomain NULLnull Benutzerdefinierte Cookiedomäne.Custom cookie domain. Diese ist hilfreich, wenn Sie Application Insights-Cookies über untergeordnete Domänen hinweg freigeben möchten.This is helpful if you want to share Application Insights cookies across subdomains.
isRetryDisabledisRetryDisabled falsefalse Die Standardeinstellung ist „false“.Default false. Bei „false“ wiederholen Sie den Vorgang für 206 (teilweise erfolgreich), 408 (Timeout), 429 (zu viele Anforderungen), 500 (interner Serverfehler), 503 (Dienst nicht verfügbar) und 0 (offline, nur wenn erkannt).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 Bei „true“ speichert und liest das SDK keine Daten aus dem lokalen Speicher und dem Sitzungsspeicher.If true, the SDK will not store or read any data from local and session storage. Der Standardwert ist "false".Default is false.
isBeaconApiDisabledisBeaconApiDisabled truetrue Bei „false“ sendet das SDK alle Telemetriedaten mithilfe der Beacon-API.If false, the SDK will send all telemetry using the Beacon API
onunloadDisableBeacononunloadDisableBeacon falsefalse Die Standardeinstellung ist „false“.Default false. Wenn die Registerkarte geschlossen ist, sendet das SDK alle verbleibenden Telemetriedaten mithilfe der Beacon-API.when tab is closed, the SDK will send all remaining telemetry using the Beacon API
sdkExtensionsdkExtension NULLnull Legt den Erweiterungsnamen „sdk“ fest.Sets the sdk extension name. Hierbei sind nur alphabetische Zeichen zulässig.Only alphabetic characters are allowed. Der Erweiterungsname wird dem Tag ‚ai.internal.sdkVersion‘ als Präfix hinzugefügt (z.B. ‚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'). Der Standardwert lautet null.Default is null.
isBrowserLinkTrackingEnabledisBrowserLinkTrackingEnabled falsefalse Der Standardwert ist "false".Default is false. Bei „true“ wird das SDK alle Anforderungen vom Typ Browserverknüpfung nachverfolgen.If true, the SDK will track all Browser Link requests.
appIdappId NULLnull „AppId“ wird für die Korrelation zwischen AJAX-Abhängigkeiten verwendet, die clientseitig mit den serverseitigen Anforderungen erfolgt.AppId is used for the correlation between AJAX dependencies happening on the client-side with the server-side requests. Wenn die Beacon-API aktiviert ist, kann sie nicht automatisch verwendet werden. Sie kann aber in der Konfiguration manuell festgelegt werden.When Beacon API is enabled, it cannot be used automatically, but can be set manually in the configuration. Die Standardeinstellung ist „null“.Default is null
enableCorsCorrelationenableCorsCorrelation falsefalse Bei „true“ fügt das SDK allen CORS-Anforderungen zwei Kopfzeilen (‚Request-Id‘ und ‚Request-Context‘) hinzu, um ausgehende AJAX-Abhängigkeiten mit entsprechenden serverseitigen Anforderungen zu korrelieren.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. Die Standardeinstellung ist „false“.Default is false
namePrefixnamePrefix nicht definiertundefined Ein optionaler Wert, der als „name“-Postfix für „localStorage“ und den Cookienamen verwendet wird.An optional value that will be used as name postfix for localStorage and cookie name.
enableAutoRouteTrackingenableAutoRouteTracking falsefalse Routenänderungen in Single-Page-Webanwendungen (Single Page Applications, SPA) automatisch nachverfolgen.Automatically track route changes in Single Page Applications (SPA). Bei „true“ sendet jede Routenänderung einen neuen Seitenaufruf an Application Insights.If true, each route change will send a new Pageview to Application Insights. Hashroutenänderungen (example.com/foo#bar) werden ebenfalls als neue Seitenaufrufe aufgezeichnet.Hash route changes (example.com/foo#bar) are also recorded as new page views.
enableRequestHeaderTrackingenableRequestHeaderTracking falsefalse Bei „true“ werden AJAX- und Fetch-Anforderungsheader nachverfolgt.Der Standardwert ist „false“.If true, AJAX & Fetch request headers is tracked, default is false.
enableResponseHeaderTrackingenableResponseHeaderTracking falsefalse Bei „true“ werden Antwortheader für AJAX- und Fetch-Anforderungen nachverfolgt.Der Standardwert ist „false“.If true, AJAX & Fetch request's response headers is tracked, default is false.
distributedTracingModedistributedTracingMode DistributedTracingModes.AI Legt den Modus für verteilte Ablaufverfolgung fest.Sets the distributed tracing mode. Wenn der AI_AND_W3C-Modus oder der W3C-Modus festgelegt ist, werden Kontextheader für die W3C-Ablaufverfolgung (traceparent/tracestate) generiert und in alle ausgehenden Anforderungen eingeschlossen.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 wird für Abwärtskompatibilität mit beliebigen mit älteren Application Insights-Versionen instrumentierten Diensten bereitgestellt.AI_AND_W3C is provided for back-compatibility with any legacy Application Insights instrumented services. Ein Beispiel finden Sie hier.See example here.
enableAjaxErrorStatusTextenableAjaxErrorStatusText falsefalse Die Standardeinstellung ist „false“.Default false. Bei TRUE wird der Text zu Antwortfehlerdaten im Abhängigkeitsereignis für fehlerhafte AJAX-Anforderungen aufgeführt.If true, include response error data text in dependency event on failed AJAX requests.
enableAjaxPerfTrackingenableAjaxPerfTracking falsefalse Die Standardeinstellung ist „false“.Default false. Flag, das die Suche nach und das Aufnehmen von zusätzlichen „window.performance“-Timings von Browsern in gemeldeten ajax-Metriken (XHR und fetch) ermöglicht.Flag to enable looking up and including additional browser window.performance timings in the reported ajax (XHR and fetch) reported metrics.
maxAjaxPerfLookupAttemptsmaxAjaxPerfLookupAttempts 33 Der Standardwert ist 3.Defaults to 3. Die maximale Anzahl von Malen, die nach „window.performance“-Timings gesucht werden kann (falls vorhanden). Dies ist erforderlich, weil nicht alle Browser „window.performance“ befüllen, bevor das Ende der XHR-Anforderung gemeldet wird. Bei fetch-Anforderungen wird dies nach der Fertigstellung hinzugefügt.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 Der Standardwert lautet 25 ms.Defaults to 25 ms. Die Zeitdauer, die gewartet werden muss, bevor noch einmal versucht werden kann, die „windows.performance“-Timings für eine ajax-Anforderung zu suchen. Die Zeit wird in Millisekunden angegeben und direkt an setTimeout() übergeben.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 Bei TRUE werden unverarbeitete Ablehnungen von Zusagen automatisch erfasst und als JavaScript-Fehler gemeldet.If true, unhandled promise rejections will be autocollected and reported as a JavaScript error. Wenn disableExceptionTracking TRUE ist (Ausnahmen werden nicht nachverfolgt), wird der Konfigurationswert ignoriert, und unverarbeitete Ablehnungen von Zusagen werden nicht gemeldet.When disableExceptionTracking is true (don't track exceptions), the config value will be ignored and unhandled promise rejections will not be reported.

Aktivieren der Nachverfolgung der Verweildauer auf der SeiteEnable time-on-page tracking

Wenn Sie autoTrackPageVisitTime: true festlegen, wird die Zeit nachverfolgt, die ein Benutzer auf jeder Seite verbringt.By setting autoTrackPageVisitTime: true, the time a user spends on each page is tracked. Bei jedem neuen Seitenaufruf wird die Zeitdauer, die der Benutzer auf der vorherigen Seite verbracht hat, als benutzerdefinierte Metrik mit dem Namen PageVisitTimegesendet.On each new PageView, the duration the user spent on the previous page is sent as a custom metric named PageVisitTime. Diese benutzerdefinierte Metrik kann im Metrik-Explorer als eine „protokollbasierte Metrik“ angezeigt werden.This custom metric is viewable in the Metrics Explorer as a "log-based metric".

Aktivieren der KorrelationEnable Correlation

Die Korrelation generiert und sendet Daten, die die verteilte Ablaufverfolgung, die Anwendungsübersicht, die Ansicht der End-to-End-Transaktion und andere Diagnosetools unterstützen.Correlation generates and sends data that enables distributed tracing and powers the application map, end-to-end transaction view, and other diagnostic tools.

Das folgende Beispiel zeigt alle möglichen Konfigurationen, die zum Aktivieren der Korrelation erforderlich sind, und gibt Hinweise zu den einzelnen Szenarien: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>

Wenn einer Ihrer Server von Drittanbietern, mit denen der Client kommuniziert, die Header Request-Id und Request-Context nicht akzeptieren kann und Sie die Konfiguration nicht aktualisieren können, müssen Sie sie über die Konfigurationseigenschaft correlationHeaderExcludeDomains in eine Ausschlussliste einfügen.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. Diese Eigenschaft unterstützt Platzhalter.This property supports wildcards.

Auf Serverseite müssen Verbindungen mit diesen Headern akzeptiert werden können.The server-side needs to be able to accept connections with those headers present. Je nach serverseitiger Konfiguration von Access-Control-Allow-Headers ist es häufig erforderlich, die serverseitige Liste zu erweitern, indem Request-Id und Request-Context manuell hinzugefügt werden.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>

Hinweis

Wenn Sie OpenTelemtry- oder Application Insights-SDKs verwenden, die 2020 oder später veröffentlicht wurden, empfiehlt es sich, WC3 TraceContext zu verwenden.If you are using OpenTelemtry or Application Insights SDKs released in 2020 or later, we recommend using WC3 TraceContext. Weitere Informationen finden Sie im Konfigurationsleitfaden.See configuration guidance here.

Single-Page-WebanwendungenSingle Page Applications

Standardmäßig verarbeitet dieses SDK keine statusbasierte Routenänderung, die in Single-Page-Webanwendungen erfolgt.By default, this SDK will not handle state-based route changing that occurs in single page applications. Um das automatische Nachverfolgen von Routenänderungen für Ihre Single-Page-Webanwendung zu aktivieren, können Sie Ihrer Setupkonfiguration enableAutoRouteTracking: true hinzufügen.To enable automatic route change tracking for your single page application, you can add enableAutoRouteTracking: true to your setup configuration.

Wir bieten derzeit ein separates React-Plug-In an, das Sie mit diesem SDK initialisieren können.Currently, we offer a separate React plugin, which you can initialize with this SDK. Es wird auch die Nachverfolgung von Routenänderungen automatisch ausführen sowie weitere React-spezifische Telemetriedaten sammeln.It will also accomplish route change tracking for you, as well as collect other React specific telemetry.

Hinweis

Verwenden Sie enableAutoRouteTracking: true nur, wenn Sie das React-Plug-In nicht verwenden.Use enableAutoRouteTracking: true only if you are not using the React plugin. Beide können bei Routenänderungen neue Seitenaufrufe senden.Both are capable of sending new PageViews when the route changes. Wenn beide aktiviert sind, werden möglicherweise doppelte Seitenaufrufe gesendet.If both are enabled, duplicate PageViews may be sent.

ErweiterungenExtensions

ErweiterungenExtensions
ReactReact
React NativeReact Native
AngularAngular

Browser-/clientseitige Daten erkundenExplore browser/client-side data

Browser-/clientseitige Daten können angezeigt werden, indem Sie zu Metriken navigieren und einzelne Metriken hinzufügen, an denen Sie interessiert sind:Browser/client-side data can be viewed by going to Metrics and adding individual metrics you are interested in:

Screenshot der Seite „Metriken“ in Application Insights mit grafischen Darstellungen von Metrikdaten für eine Webanwendung.

Sie können Ihre Daten auch aus dem JavaScript SDK über die Browseroberfläche im Portal anzeigen.You can also view your data from the JavaScript SDK via the Browser experience in the portal.

Wählen Sie Browser und dann Fehler oder Leistung aus.Select Browser and then choose Failures or Performance.

Screenshot der Seite „Browser“ in Application Insights, der zeigt, wie Sie den Metriken, die Sie für Ihre Webanwendung anzeigen können, Browserfehler oder Browserleistung hinzufügen können.

LeistungPerformance

Screenshot der Seite „Leistung“ in Application Insights mit grafischen Darstellungen von Vorgangsmetriken für eine Webanwendung.

AbhängigkeitenDependencies

Screenshot der Seite „Leistung“ in Application Insights mit grafischen Darstellungen von Abhängigkeitsmetriken für eine Webanwendung.

AnalyticsAnalytics

Wenn Sie Ihre vom JavaScript SDK gesammelten Telemetriedaten abfragen möchten, wählen Sie die Schaltfläche In Protokollen anzeigen (Analytics) aus.To query your telemetry collected by the JavaScript SDK, select the View in Logs (Analytics) button. Wenn Sie eine where-Anweisung von client_Type == "Browser"hinzufügen, werden nur Daten aus dem JavaScript SDK angezeigt, und alle von anderen SDKs gesammelten serverseitigen Telemetriedaten werden ausgeschlossen.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

Unterstützung für die QuellzuordnungsdateiSource Map Support

Die Minimierung der minimierten Aufrufliste Ihrer Ausnahmetelemetriedaten kann im Azure-Portal nicht aufgehoben werden.The minified callstack of your exception telemetry can be unminified in the Azure portal. Alle vorhandenen Integrationen im Bereich „Ausnahmedetails“ funktionieren aber bei der Aufrufliste, deren Minimierung gerade aufgehoben wurde.All existing integrations on the Exception Details panel will work with the newly unminified callstack.

Sie können Ihre Application Insights-Ressource mit dem eigenen Azure Blob Storage-Container verknüpfen, um die Minimierung von Aufruflisten automatisch aufzuheben.You can link your Application Insights resource to your own Azure Blob Storage container to automatically unminify call stacks. Informationen zu den ersten Schritten finden Sie unter der automatischen Unterstützung für Quellzuordnungen.To get started, see automatic source map support.

Drag & DropDrag and drop

  1. Wählen Sie im Azure-Portal ein Element vom Typ „Ausnahmetelemetrie“ aus, um dessen „End-to-End-Transaktionsdetails“ anzuzeigen.Select an Exception Telemetry item in the Azure portal to view its "End-to-end transaction details"
  2. Identifizieren Sie, welche Quellzuordnungsdateien dieser Aufrufliste entsprechen.Identify which source maps correspond to this call stack. Die Quellzuordnungsdatei muss mit der Quelldatei eines Stapelrahmens übereinstimmen, die allerdings mit dem Suffix .map versehen ist.The source map must match a stack frame's source file, but suffixed with .map
  3. Ziehen Sie die Sourcemaps per Drag & Drop in die Aufrufliste im Azure-Portal Animierte Darstellung des Drag & Drop-Vorgangs der Sourcemaps aus einem Buildordner in das Fenster der Aufrufliste im 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.

Application Insights Web BasicApplication Insights Web Basic

Wenn Sie es einfacher haben möchten, können Sie stattdessen die Basisversion von Application Insights installieren.For a lightweight experience, you can instead install the basic version of Application Insights

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

Diese Version ist mit der minimalen Anzahl von Features und Funktionen ausgestattet und basiert darauf, dass Sie sie nach Bedarf erstellen.This version comes with the bare minimum number of features and functionalities and relies on you to build it up as you see fit. So führt sie beispielsweise keine automatische Sammlung durch (nicht abgefangene Ausnahmen, AJAX usw.).For example, it performs no autocollection (uncaught exceptions, AJAX, etc.). Weil die APIs zum Senden bestimmter Arten von Telemetriedaten, wie z.B. trackTrace, trackException usw., in dieser Version nicht enthalten sind, müssen Sie Ihren eigenen Wrapper bereitstellen.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. Die einzige verfügbare API ist track.The only API that is available is track. Ein Beispiel finden Sie hier.A sample is located here.

BeispieleExamples

Ausführbare Beispiele finden Sie unter den Beispielen für das Application Insights JavaScript SDK.For runnable examples, see Application Insights JavaScript SDK Samples.

Upgrade von der alten Application Insights-VersionUpgrading from the old version of Application Insights

Breaking Changes in der SDK V2-Version:Breaking changes in the SDK V2 version:

  • Um bessere API-Signaturen zu ermöglichen, wurden einige API-Aufrufe, wie z. B. „trackPageView“ und „trackException“, aktualisiert.To allow for better API signatures, some of the API calls, such as trackPageView and trackException, have been updated. Eine Ausführung in Internet Explorer 8 und früheren Versionen des Browsers wird nicht unterstützt.Running in Internet Explorer 8 and earlier versions of the browser is not supported.
  • Beim Umschlag für die Telemetriedaten gibt es infolge von Datenschemaaktualisierungen Feldname- und Strukturänderungen.The telemetry envelope has field name and structure changes due to data schema updates.
  • context.operation wurde in context.telemetryTrace verschoben.Moved context.operation to context.telemetryTrace. Einige Felder wurden ebenfalls geändert (operation.id --> telemetryTrace.traceID).Some fields were also changed (operation.id --> telemetryTrace.traceID).
    • Zum manuellen Aktualisieren der derzeitigen PageView-ID (z. B. in SPA-Apps) verwenden Sie 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().

      Hinweis

      Damit die Ablaufverfolgungs-ID eindeutig bleibt, verwenden Sie dort, wo Sie zuvor Util.newId() verwendet haben, jetzt Util.generateW3CId().To keep the trace ID unique, where you previously used Util.newId(), now use Util.generateW3CId(). Beide werden letztendlich zur Vorgangs-ID.Both ultimately end up being the operation ID.

Wenn Sie das aktuelle Application Insights-PRODUKTIONS-SDK (1.0.20) verwenden und überprüfen möchten, ob das neue SDK in der Laufzeit funktioniert, aktualisieren Sie die URL abhängig von Ihrem aktuellen SDK-Ladeszenario.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.

  • Download über CDN-Szenario: Aktualisieren Sie den zurzeit verwendeten Codeausschnitt so, dass er auf die folgende URL verweist: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"
    
  • npm-Szenario: Rufen Sie downloadAndSetup auf, um das vollständige ApplicationInsights-Skript aus dem CDN herunterzuladen und es mit dem Instrumentierungsschlüssel zu initialisieren: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"
       });
    

Testen Sie es in der internen Umgebung, um zu überprüfen, ob die Überwachung der Telemetriedaten wie erwartet funktioniert.Test in internal environment to verify monitoring telemetry is working as expected. Wenn alles funktioniert, aktualisieren Sie Ihre API-Signaturen entsprechend der SDK V2-Version, und stellen Sie sie in Ihren Produktionsumgebungen bereit.If all works, update your API signatures appropriately to SDK V2 version and deploy in your production environments.

SDK-Leistung/MehraufwandSDK performance/overhead

Mit einer Größe von 36 KB (GZIP-Ordner) und einer Initialisierungsdauer von etwa 15 ms steigert Application Insights die Ladezeit Ihrer Website nur geringfügig.At just 36 KB gzipped, and taking only ~15 ms to initialize, Application Insights adds a negligible amount of loadtime to your website. Wenn Sie den Codeausschnitt verwenden, werden minimale Komponenten der Bibliothek schnell geladen.By using the snippet, minimal components of the library are quickly loaded. In der Zwischenzeit wird das vollständige Skript im Hintergrund heruntergeladen.In the meantime, the full script is downloaded in the background.

Während des Downloads des Skripts aus dem CDN wird die gesamte Nachverfolgung Ihrer Seite in die Warteschlange eingereiht.While the script is downloading from the CDN, all tracking of your page is queued. Sobald die asynchrone Initialisierung des heruntergeladenen Skripts abgeschlossen ist, werden alle Ereignisse, die in die Warteschlange eingereiht wurden, nachverfolgt.Once the downloaded script finishes asynchronously initializing, all events that were queued are tracked. Infolgedessen gehen während des gesamten Lebenszyklus Ihrer Seite keine Telemetriedaten verloren.As a result, you will not lose any telemetry during the entire life cycle of your page. Dieser Setupvorgang stellt für Ihre Seite ein nahtloses Analysesystem bereit, das für Ihre Benutzer unsichtbar ist.This setup process provides your page with a seamless analytics system, invisible to your users.

Zusammenfassung:Summary:

  • NPM-Version
  • Größe bei GZIP-Komprimierung
  • 15 ms – Gesamtinitialisierungszeit15 ms overall initialization time
  • Null – Nachverfolgung während des Lebenszyklus der Seite hat gefehlt.Zero tracking missed during life cycle of page

BrowserunterstützungBrowser support

Chrome Firefox IE Opera Safari
Chrome (neueste Version) ✔Chrome Latest ✔ Firefox (neueste Version) ✔Firefox Latest ✔ Internet Explorer ab Version 9 und Microsoft Edge ✔IE 9+ & Edge ✔
Mit Internet Explorer 8 kompatibelIE 8- Compatible
Opera (neueste Version) ✔Opera Latest ✔ Safari (neueste Version) ✔Safari Latest ✔

ES3-/IE8-KompatibilitätES3/IE8 Compatibility

Es gibt zahlreiche Benutzer, die nicht steuern können, welche Browser Ihre Kunden benutzen.As an SDK there are numerous users that cannot control the browsers that their customers use. Daher muss sichergestellt werden, dass dieses SDK weiterhin funktioniert und nicht die Ausführung von JavaScript unterbricht, wenn es von einem älteren Browser geladen wird.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. Obwohl die Unterstützung für IE8 und Browser älterer Generationen (ES3) idealerweise eingestellt werden sollte, gibt es zahlreiche große Kunden/Benutzer, die darauf angewiesen sind, dass Seiten weiterhin funktionieren. Außerdem können sie, wie bereits erwähnt, nicht steuern, welchen Browser Endbenutzer wählen.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.

Dies bedeutet NICHT, dass nur die kleinste Schnittmenge der gemeinsamen Features unterstützt wird. Es bedeutet lediglich, dass die ES3-Codekompatibilität beibehalten werden muss und dass neue Features als optional und so hinzugefügt werden müssen, dass die ES3-JavaScript-Analyse nicht unterbrochen wird.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.

Weitere Informationen zur IE8-Unterstützung finden Sie auf GitHub.See GitHub for full details on IE8 support

Open Source SDKOpen-source SDK

Das Application Insights JavaScript SDK ist Open Source. Wenn Sie den Quellcode anzeigen oder zum Projekt beitragen möchten, besuchen Sie das offizielle GitHub-Repository.The Application Insights JavaScript SDK is open-source to view the source code or to contribute to the project visit the official GitHub repository.

Informationen zu den neuesten Updates und Fehlerbehebungen finden Sie in den Versionshinweisen.For the latest updates and bug fixes consult the release notes.

Nächste SchritteNext steps