Application Insights voor webpagina’s
Krijg inzicht in de prestaties en het gebruik van uw webpagina's of app. Als u Application Insights toevoegt aan uw paginascript, krijgt u timings van paginaladingen en AJAX-aanroepen, tellingen en details van browser-uitzonderingen en AJAX-fouten, evenals het aantal gebruikers en sessies. Al deze gegevens kunnen worden gesegmenteerd op pagina, clientbesturingssysteem en browserversie, geografische locatie en andere dimensies. U kunt waarschuwingen instellen voor foutaantallen of het langzaam laden van de pagina. En door het invoegen van trace-aanroepen in JavaScript-code, kunt u bijhouden hoe de verschillende functies van uw webpaginatoepassing worden gebruikt.
Application Insights kan met elke webpagina worden gebruikt. Het enige wat u hiervoor hoeft te doen, is een klein stukje JavaScript toevoegen. Als uw webservice Java of ASP.NETis, kunt u de SDK's aan de serverzijde gebruiken in combinatie met de JavaScript-SDK aan de clientzijde om een end-to-end-inzicht te krijgen in de prestaties van uw app.
De JavaScript-SDK toevoegen
Belangrijk
Verbindingsreeksen worden aanbevolen voor instrumentatiesleutels. Voor nieuwe Azure-regio's is het gebruik van verbindingsreeksen in plaats van instrumentatiesleutels vereist. Verbindingsreeks identificeert de resource waar u uw telemetriegegevens aan wilt koppelen. U kunt hiermee ook de eindpunten wijzigen die door uw resource worden gebruikt als bestemming voor uw telemetrie. U moet de gegevens kopiëren connection string toevoegen aan de code van uw toepassing of aan een omgevingsvariabele.
- Eerst hebt u een Application Insights resource nodig. Als u nog geen resource en instrumentatiesleutel hebt, volgt u de instructies voor het maken van een nieuwe resource.
- Kopieer de instrumentatiesleutel (ook wel 'iKey' genoemd) of connection string voor de resource waar u uw JavaScript-telemetrie naar wilt sturen (uit stap 1.) U voegt deze toe aan de
instrumentationKeyinstelling of van de Application InsightsconnectionStringJavaScript SDK. - Voeg de Application Insights JavaScript SDK toe aan uw webpagina of app via een van de volgende twee opties:
Belangrijk
Gebruik slechts één methode om de JavaScript-SDK toe te voegen aan uw toepassing. Als u de NPM-installatie gebruikt, moet u het fragment niet gebruiken en vice versa.
Notitie
NPM Setup installeert de JavaScript SDK als een afhankelijkheid van uw project, waardoor IntelliSense wordt ingeschakeld, terwijl het fragment de SDK tijdens runtime op haalt. Beide ondersteunen dezelfde functies. Ontwikkelaars die meer aangepaste gebeurtenissen en configuraties willen, kiezen over het algemeen echter voor NPM Setup, terwijl gebruikers die op zoek zijn naar snelle inschakelen van out-of-the-box web analytics kiezen voor het fragment.
Installatie op basis van npm
Installeren via NPM.
npm i --save @microsoft/applicationinsights-web
Notitie
Typen zijn opgenomen in dit pakket, zodat u geen afzonderlijk typepakket hoeft te installeren.
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
Installatie op basis van fragmenten
Als uw app geen gebruik maakt van npm, kunt u uw webpagina's rechtstreeks instrumenteren met Application Insights door dit fragment boven aan elk van uw pagina's te plaatsen. Het moet bij voorkeur het eerste script in uw sectie zijn, zodat potentiële problemen met al uw afhankelijkheden en eventueel <head> JavaScript-fouten kunnen worden bewaakt. Als u Blazor Server-app gebruikt, voegt u het fragment boven aan het bestand _Host.cshtml toe in de sectie <head> .
Om bij te houden welke versie van het fragment uw toepassing gebruikt, bevat de gebeurtenis paginaweergave vanaf versie 2.5.5 een nieuwe tag ai.internal.snippet die de geïdentificeerde fragmentversie bevat.
Het huidige fragment (hieronder vermeld) is versie 5, de versie wordt in het codefragment gecodeerd als sv:"#" en de huidige versie is ook beschikbaar op GitHub.
<script type="text/javascript">
!function(T,l,y){var S=T.location,k="script",D="instrumentationKey",C="ingestionendpoint",I="disableExceptionTracking",E="ai.device.",b="toLowerCase",w="crossOrigin",N="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:"5",version:2,config:d};function v(e,t){var n={},a="Browser";return n[E+"id"]=a[b](),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,u,p,l;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][b]()]=i[1])}if(!e[C]){var r=e.endpointsuffix,o=r?e.location:null;e[C]="https://"+(o?o+".":"")+"dc."+(r||"services.visualstudio.com")}return e}(),c=s[D]||d[D]||"",u=s[C],p=u?u+"/v2/track":d.endpointUrl,(l=[]).push((n="SDK LOAD Failure: Failed to load Application Insights SDK script (See stack for details)",a=t,i=p,(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)),l.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,p)),function(e,t){if(JSON){var n=T.fetch;if(n&&!y.useXhr)n(t,{method:N,body:JSON.stringify(e),mode:"cors"});else if(XMLHttpRequest){var a=new XMLHttpRequest;a.open(N,t),a.setRequestHeader("Content-type","application/json"),a.send(JSON.stringify(e))}}}(l,p))}function i(e,t){f||setTimeout(function(){!t&&m.core||a()},500)}var e=function(){var n=l.createElement(k);n.src=h;var e=y[w];return!e&&""!==e||"undefined"==n[w]||(n[w]=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(k)[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[I]&&!0!==s[I]){var c="onerror";t(["_"+c]);var u=T[c];T[c]=function(e,t,n,a,i){var r=u&&u(e,t,n,a,i);return!0!==r&&m["_"+c]({message:e,url:t,lineNumber:n,columnNumber:a,error:i}),r},d.autoExceptionInstrumented=!0}return m}(y.cfg);function a(){y.onInit&&y.onInit(n)}(T[t]=n).queue&&0===n.queue.length?(n.queue.push(a),n.trackPageView({})):a()}(window,document,{
src: "https://js.monitor.azure.com/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
// onInit: null, // Once the application insights instance has loaded and initialized this callback function will be called with 1 argument -- the sdk instance (DO NOT ADD anything to the sdk.queue -- As they won't get called)
cfg: { // Application Insights Configuration
instrumentationKey: "YOUR_INSTRUMENTATION_KEY_GOES_HERE"
/* ...Other Configuration Options... */
}});
</script>
Notitie
Voor de leesbaarheid en om mogelijke JavaScript-fouten te verminderen, worden alle mogelijke configuratieopties weergegeven op een nieuwe regel in bovenstaande codefragmenten. Als u de waarde van een commentaarregel niet wilt wijzigen, kan deze worden verwijderd.
Fouten bij laden van script rapporteren
Deze versie van het codefragment detecteert en rapporteert fouten bij het laden van de SDK vanuit de CDN als een uitzondering op de Azure Monitor-portal (onder de browser met uitzonderingen bij fouten). Deze uitzondering biedt inzicht in fouten van dit type, zodat u zich ervan bewust bent dat uw toepassing geen telemetrie (of andere uitzonderingen) rapporteert zoals > > verwacht. Dit signaal is een belangrijke meting om te begrijpen dat u geen telemetrie meer hebt, omdat de SDK niet is geladen of initialiseren, wat kan leiden tot:
- Onderrapportage van hoe gebruikers uw site gebruiken (of proberen te gebruiken);
- Ontbrekende telemetrie over hoe uw eindgebruikers uw site gebruiken;
- Ontbrekende JavaScript-fouten waardoor uw eindgebruikers mogelijk geen gebruik kunnen maken van uw site.
Zie de pagina voor het oplossen van problemen met de SDK-load voor meer informatie over deze uitzondering.
Als u deze fout rapporteert als een uitzondering op de portal, wordt de configuratieoptie van de Application Insights-configuratie niet gebruikt. Als deze fout optreedt, wordt deze dus altijd gerapporteerd door het codefragment, zelfs wanneer de ondersteuning disableExceptionTracking voor window.onerror is uitgeschakeld.
Rapportage van SDK-laadfouten wordt specifiek NIET ondersteund op IE 8 (of minder). Dit helpt bij het verkleinen van de geminificeerde grootte van het fragment door ervan uit te gaan dat de meeste omgevingen niet uitsluitend IE 8 of minder zijn. Als u deze vereiste hebt en u deze uitzonderingen wilt ontvangen, moet u een opvulling voor poly ophalen opnemen of een eigen fragmentversie maken die gebruikt in plaats van . Het wordt aanbevolen om de opgegeven code voor codefragmenten als uitgangspunt te XDomainRequest XMLHttpRequest gebruiken.
Notitie
Als u een eerdere versie van het fragment gebruikt, is het raadzaam om bij te werken naar de nieuwste versie, zodat u deze eerder niet-gemelde problemen ontvangt.
Configuratieopties voor fragmenten
Alle configuratieopties zijn nu verplaatst naar het einde van het script om te voorkomen dat er per ongeluk JavaScript-fouten worden gemaakt die er niet alleen voor zorgen dat de SDK niet kan worden geladen, maar ook de rapportage van de fout zou uitschakelen.
Elke configuratieoptie wordt hierboven weergegeven op een nieuwe regel. Als u de standaardwaarde van een item dat wordt vermeld als [optioneel] niet wilt overschrijven, kunt u die regel verwijderen om de resulterende grootte van de geretourneerde pagina te minimaliseren.
De beschikbare configuratieopties zijn
| Naam | Type | Description |
|---|---|---|
| src | tekenreeks [vereist] | De volledige URL voor het laden van de SDK. Deze waarde wordt gebruikt voor het kenmerk 'src' van een dynamisch toegevoegd < > script/tag. U kunt de openbare CDN of uw eigen privé-gehoste locatie gebruiken. |
| naam | tekenreeks [optioneel] | De algemene naam voor de initialiseerde SDK is standaard ingesteld op appInsights . Dit window.appInsights is dus een verwijzing naar het initialiseerde exemplaar. Opmerking: als u een naamwaarde op geeft of als een eerder exemplaar lijkt te zijn toegewezen (via de algemene naam appInsightsSDK), wordt deze naamwaarde ook gedefinieerd in de algemene naamruimte als . Dit is vereist voor de SDK-initialisatiecode om ervoor te zorgen dat de SDK de juiste code voor codefragmenten en proxy's initialiseert en bij window.appInsightsSDK=<name value> werkt. |
| Ld | getal in ms [optioneel] | Definieert de vertraging die moet worden gewacht voordat de SDK wordt geladen. De standaardwaarde is 0 ms en elke negatieve waarde voegt onmiddellijk een scripttag toe aan het hoofdgebied van de pagina, waardoor de gebeurtenis voor het laden van pagina's wordt geblokkeerd totdat het script wordt geladen < > (of mislukt). |
| useXhr | Booleaanse booleaanse [optioneel] | Deze instelling wordt alleen gebruikt voor het rapporteren van SDK-laadfouten. Bij rapportage wordt eerst geprobeerd fetch() te gebruiken, indien beschikbaar en vervolgens terug te vallen op XHR. Als u deze waarde instelt op true, wordt de controle voor ophalen overgeslagen. Gebruik van deze waarde is alleen vereist als uw toepassing wordt gebruikt in een omgeving waarin ophalen de foutgebeurtenissen niet kan verzenden. |
| crossOrigin | tekenreeks [optioneel] | Door deze instelling op te nemen, bevat de scripttag die is toegevoegd om de SDK te downloaden het kenmerk crossOrigin met deze tekenreekswaarde. Als dit niet is gedefinieerd (de standaardinstelling), wordt er geen crossOrigin-kenmerk toegevoegd. Aanbevolen waarden zijn niet gedefinieerd (de standaardinstelling); ""; of 'anoniem' (zie HTML-kenmerk: crossorigin documentatie voor alle geldige waarden) |
| configuratie | object [vereist] | De configuratie is tijdens de initialisatie doorgegeven Insights Application Insights SDK. |
Verbindingsreeks instellen
Voor de installatie van NPM of codefragmenten kunt u ook uw exemplaar van Application Insights met behulp van een verbindingsreeks. Vervang het veld instrumentationKey door het connectionString veld .
import { ApplicationInsights } from '@microsoft/applicationinsights-web'
const appInsights = new ApplicationInsights({ config: {
connectionString: 'YOUR_CONNECTION_STRING_GOES_HERE'
/* ...Other Configuration Options... */
} });
appInsights.loadAppInsights();
appInsights.trackPageView();
Telemetrie verzenden naar de Azure Portal
Standaard worden met application Insights JavaScript SDK een aantal telemetrie-items automatisch opgehaald die nuttig zijn bij het bepalen van de status van uw toepassing en de onderliggende gebruikerservaring. Deze omvatten:
- Niet-geïnstalleerde uitzonderingen in uw app, met inbegrip van informatie over
- Stack-trace
- Details van de uitzondering en het bericht bij de fout
- Regel & kolomnummer van de fout
- URL waar fout is opgetreden
- Aanvragen voor netwerkafhankelijkheid die worden gedaan door uw app XHR en Fetch (ophalen verzameling is standaard uitgeschakeld) en bevatten informatie over
- URL van afhankelijkheidsbron
- Opdrachtregelmethode & gebruikt om de afhankelijkheid aan te vragen
- Duur van de aanvraag
- Resultaatcode en successtatus van de aanvraag
- Id (indien van u) van de gebruiker die de aanvraag indient
- Correlatiecontext (indien van belang) waarin de aanvraag wordt ingediend
- Gebruikersgegevens (bijvoorbeeld locatie, netwerk, IP)
- Apparaatgegevens (bijvoorbeeld browser, besturingssysteem, versie, taal, model)
- Sessiegegevens
Initialisaties voor telemetrie
Initialisaties voor telemetrie worden gebruikt om de inhoud van de verzamelde telemetrie te wijzigen voordat deze wordt verzonden vanuit de browser van de gebruiker. Ze kunnen ook worden gebruikt om te voorkomen dat bepaalde telemetrie wordt verzonden door te false retourneren. Er kunnen meerdere telemetrie-initialisaties worden toegevoegd aan uw Application Insights-exemplaar en ze worden uitgevoerd om ze toe te voegen.
Het invoerargument voor is een callback die een als argument gebruikt addTelemetryInitializer en een of ITelemetryItem boolean retourneert. void Als het retourneert, wordt het telemetrie-item niet verzonden, anders gaat het verder met de volgende initialisatie voor telemetrie, indien van welke, of wordt verzonden naar het eindpunt van de false telemetrieverzameling.
Een voorbeeld van het gebruik van initialisaties voor telemetrie:
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
Configuration
De meeste configuratievelden krijgen een naam die de standaardwaarde false heeft. Alle velden zijn optioneel, met uitzondering van instrumentationKey .
| Naam | Beschrijving | Standaard |
|---|---|---|
| instrumentationKey | Vereist Instrumentatiesleutel die u hebt verkregen van de Azure Portal. |
tekenreeks null |
| accountId | Een optionele account-id, als uw app gebruikers in accounts groeperen. Geen spaties, komma's, puntkomma's, is gelijk aan of verticale balken | tekenreeks null |
| sessionRenewalMs | Een sessie wordt geregistreerd als de gebruiker inactief is voor deze tijd in milliseconden. | numeriek 1800000 (30 minuten) |
| sessionExpirationMs | Een sessie wordt geregistreerd als deze is voortgezet voor deze hoeveelheid tijd in milliseconden. | numeriek 86400000 (24 uur) |
| maxBatchSizeInBytes | Maximale grootte van telemetriebatch. Als een batch deze limiet overschrijdt, wordt deze onmiddellijk verzonden en wordt er een nieuwe batch gestart | numeriek 10.000 |
| maxBatchInterval | Hoe lang de batch-telemetrie moet worden verzonden voordat deze wordt verzonden (milliseconden) | numeriek 15.000 |
| uitzonderingstrackinguitschakelen | Indien waar, worden uitzonderingen niet automatisch colllecteerd. | booleaans onjuist |
| disableTelemetry | Indien waar, wordt er geen telemetrie verzameld of verzonden. | booleaans onjuist |
| enableDebug | Indien waar, worden interne gegevens voor debuggen als een uitzondering in plaats van geregistreerd, ongeacht de instellingen voor SDK-logboekregistratie. De standaardinstelling is onwaar. Opmerking: Als u deze instelling inschakelen, resulteert dit in uitgevallen telemetrie wanneer er een interne fout optreedt. Dit kan handig zijn voor het snel identificeren van problemen met uw configuratie of gebruik van de SDK. Als u geen telemetrie wilt verliezen tijdens het debuggen, kunt u overwegen of te gebruiken consoleLoggingLevel telemetryLoggingLevel in plaats van enableDebug . |
booleaans onjuist |
| loggingLevelConsole | Registreert interne Application Insights in de console. 0: uit, 1: Alleen kritieke fouten, 2: Alles (fouten & waarschuwingen) |
numeriek 0 |
| loggingLevelTelemetry | Verzendt interne Application Insights fouten als telemetrie. 0: uit, 1: Alleen kritieke fouten, 2: Alles (fouten & waarschuwingen) |
numeriek 1 |
| diagnosticLogInterval | (intern) Polling-interval (in ms) voor interne logboekregistratiewachtrij | numeriek 10.000 |
| samplingPercentage | Percentage gebeurtenissen dat wordt verzonden. De standaardwaarde is 100, wat betekent dat alle gebeurtenissen worden verzonden. Stel deze in als u uw gegevenslimiet wilt behouden voor grootschalige toepassingen. | numeriek 100 |
| autoTrackPageVisitTime | Indien waar, wordt in een paginaweergave de weergavetijd van de vorige instrumentatiepagina bijgespoord en verzonden als telemetrie en wordt er een nieuwe timer gestart voor de huidige paginaweergave. Het wordt verzonden als een aangepaste metrische gegevens met de naam in en wordt berekend via de functie PageVisitTime milliseconds Date now() (indien beschikbaar) en valt terug naar (nieuwe Datum()). getTime() als now() niet beschikbaar is (IE8 of minder). De standaardinstelling is onwaar. |
booleaans onjuist |
| disableBlockaxTracking | Indien waar, worden Ajax-aanroepen niet automatisch opgehaald. | booleaans onjuist |
| disableFetchTracking | Indien waar, worden aanvragen voor ophalen niet automatisch opgehaald. | booleaans true |
| overridePageViewDuration | Indien waar, wordt het standaardgedrag van trackPageView gewijzigd om het duurinterval voor het einde van de paginaweergave vast te stellen wanneer trackPageView wordt aangeroepen. Als false is opgegeven en er geen aangepaste duur is opgegeven omPageView bij te houden, worden de prestaties van de paginaweergave berekend met behulp van de API voor navigatietijd. | booleaans |
| maxAxCallsPerView | Standaard 500: hiermee bepaalt u hoeveel Ajax-aanroepen per paginaweergave worden bewaakt. Stel in op -1 om alle (onbeperkte) Ajax-aanroepen op de pagina te bewaken. | numeriek 500 |
| disableDataLossAnalysis | Indien onwaar, worden interne buffers voor afzenders van telemetrie gecontroleerd bij het opstarten op items die nog niet zijn verzonden. | booleaans true |
| correlatieheadersuitschakelen | Indien onwaar, voegt de SDK twee headers ('Request-Id' en 'Request-Context') toe aan alle afhankelijkheidsaanvragen om deze te correleren met de bijbehorende aanvragen aan de serverzijde. | booleaans onjuist |
| correlationHeaderExcludedDomains | Correlatieheaders uitschakelen voor specifieke domeinen | tekenreeks [] Ongedefinieerde |
| correlationHeaderExcludePatterns | Correlatieheaders uitschakelen met reguliere expressies | regex [] Ongedefinieerde |
| correlationHeaderDomains | Correlatieheaders inschakelen voor specifieke domeinen | tekenreeks [] Ongedefinieerde |
| disableFlushOnBeforeUnload | Indien waar, wordt de methode flush niet aangeroepen wanneer onBeforeUnload gebeurtenistriggers | booleaans onjuist |
| enableSessionStorageBuffer | Indien waar, wordt de buffer met alle niet-afgeziene telemetrie opgeslagen in sessieopslag. De buffer wordt hersteld bij het laden van pagina's | booleaans true |
| cookieCfg | Standaardinstellingen voor ingeschakeld cookiegebruik zie ICookieCfgConfig settings for full defaults (ICookieCfgConfig-instellingen voor volledige standaardinstellingen). | ICookieCfgConfig (Sinds 2.6.0) Ongedefinieerde |
disableCookiesUsage |
Indien waar, worden met de SDK geen gegevens van cookies opgeslagen of gelezen. Hiermee worden de cookies voor gebruiker en sessie uitgeschakeld en worden de gebruiksblades en -ervaringen onbruikbaar. isCookieUseDisable is afgeschaft in plaats van disableCookiesUsage, wanneer beide zijn opgegeven disableCookiesUsage heeft voorrang. (Sinds v2.6.0) En als ook is gedefinieerd, heeft het gebruik van cookies voorrang op deze waarden. Dit kan na de initialisatie opnieuw worden ingeschakeld cookieCfg.enabled via core.getCookieMgr().setEnabled(true). |
alias voor cookieCfg.enabledonjuist |
| cookieDomain | Aangepast cookiedomein. Dit is handig als u Toepassings- en Insights wilt delen tussen subdomeinen. (Sinds v2.6.0) Als cookieCfg.domain is gedefinieerd, heeft deze voorrang op deze waarde. |
alias voor cookieCfg.domainnull |
| cookiePath | Aangepast cookiepad. Dit is handig als u Application Insights cookies achter een toepassingsgateway wilt delen. Als cookieCfg.path is gedefinieerd, heeft deze voorrang op deze waarde. |
alias voor cookieCfg.path(Sinds 2.6.0) null |
| isRetryDisabled | Indien onwaar, kunt u het opnieuw proberen op 206 (gedeeltelijk geslaagd), 408 (time-out), 429 (te veel aanvragen), 500 (interne serverfout), 503 (service niet beschikbaar) en 0 (offline, alleen als deze is gedetecteerd) | booleaans onjuist |
| isStorageUseDisabled | Indien waar, worden met de SDK geen gegevens opgeslagen of gelezen uit de lokale opslag en sessieopslag. | booleaans onjuist |
| isBeaconApiDisabled | Indien onwaar, verzendt de SDK alle telemetrie met behulp van de Baken-API | booleaans true |
| onunloadDisableBeacon | Wanneer het tabblad is gesloten, verzendt de SDK alle resterende telemetrie met behulp van de Baken-API | booleaans onjuist |
| sdkExtension | Hiermee stelt u de naam van de SDK-extensie. Alleen alfabetische tekens zijn toegestaan. De extensienaam wordt toegevoegd als voorvoegsel aan de tag ai.internal.sdkVersion (bijvoorbeeld 'ext_javascript:2.0.0'). | tekenreeks null |
| isBrowserLinkTrackingEnabled | Indien waar, houdt de SDK alle Browser Link-aanvragen bij. | booleaans onjuist |
| appId | AppId wordt gebruikt voor de correlatie tussen AJAX-afhankelijkheden aan de clientzijde met de aanvragen aan de serverzijde. Wanneer de Baken-API is ingeschakeld, kan deze niet automatisch worden gebruikt, maar kan deze handmatig worden ingesteld in de configuratie. | tekenreeks null |
| CorsCorrelationinschakelen | Indien waar, voegt de SDK twee headers ('Request-Id' en 'Request-Context') toe aan alle CORS-aanvragen om uitgaande AJAX-afhankelijkheden te correleren met bijbehorende aanvragen aan de serverzijde. | booleaans onjuist |
| namePrefix | Een optionele waarde die wordt gebruikt als naampostfix voor localStorage en cookienaam. | tekenreeks Ongedefinieerde |
| Automatischbijhouden vaninschakelen | Routewijzigingen in toepassingen met één pagina (SPA) automatisch bijhouden. Indien waar, verzendt elke routewijziging een nieuwe Pageview naar Application Insights. Hashroutewijzigingen ( example.com/foo#bar ) worden ook vastgelegd als nieuwe paginaweergaven. |
booleaans onjuist |
| enableRequestHeaderTracking | Als dit waar is, worden & Aanvraagheaders ophalen bijgespoord. | booleaans onjuist |
| enableResponseHeaderTracking | Indien waar, worden & antwoordheaders van de aanvraag opgehaald. | booleaans onjuist |
| distributedTracingMode | Hiermee stelt u de gedistribueerde traceringsmodus. Als AI_AND_W3C modus of W3C-modus is ingesteld, worden W3C-trace contextheaders (traceparent/tracestate) gegenereerd en opgenomen in alle uitgaande aanvragen. AI_AND_W3C is beschikbaar voor back-compatibiliteit met alle verouderde application Insights-instrumentatieservices. Zie het voorbeeld hier. | DistributedTracingModesofnumeriek (Sinds v2.6.0) DistributedTracingModes.AI_AND_W3C(v2.5.11 of eerder) DistributedTracingModes.AI |
| AjaxErrorStatusText inschakelen | Als dit waar is, moet u tekst van antwoordfoutgegevens opnemen in afhankelijkheidsgebeurtenis bij mislukte AJAX-aanvragen. | booleaans onjuist |
| AjaxPerfTracking inschakelen | Vlag om op te zoeken en aanvullende browservensters.prestatietijdsinstellingen in de ajax gerapporteerde metrische gegevens (XHR en ophalen) in te sluiten. |
booleaans onjuist |
| maxFormataxPerfLookupAttempts | Het maximum aantal keren om te zoeken naar de tijdstippen voor window.performance (indien beschikbaar), dit is vereist omdat niet alle browsers de window.performance vullen voordat het einde van de XHR-aanvraag wordt gemeld en voor het ophalen van aanvragen wordt dit toegevoegd nadat de aanvraag is voltooid. | numeriek 3 |
| ajaxPerfLookupDelay | De hoeveelheid tijd die moet worden gewacht voordat opnieuw wordt geprobeerd om de time-outs van de prestaties voor een aanvraag te vinden, de tijd is in milliseconden en wordt rechtstreeks doorgegeven ajax aan setTimeout(). |
numeriek 25 ms |
| enableUnhandledPromiseRejectionTracking | Indien waar, worden niet-verholpen promise-afwijzingen automatisch opgehaald en gerapporteerd als een JavaScript-fout. Wanneer disableExceptionTracking true is (geen uitzonderingen bijhouden), wordt de configuratiewaarde genegeerd en worden niet-opgeloste promise-afwijzingen niet gerapporteerd. | booleaans onjuist |
| ValidatieInstrumentationKeyuitschakelen | Indien waar, wordt validatiecontrole van instrumentatiesleutels overgeslagen. | booleaans onjuist |
| enablePerfMgr | Als deze functie is ingeschakeld (true), worden er lokale perfEvents gemaakt voor code die is instrumenteerd om perfEvents (via de doPerf()-helper te zenden. Dit kan worden gebruikt om prestatieproblemen binnen de SDK te identificeren op basis van uw gebruik of optioneel binnen uw eigen instrumentatiecode. Meer informatie is beschikbaar in de basisdocumentatie. Sinds v2.5.7 | booleaans onjuist |
| perfEvtsSendAll | Wanneer enablePerfMgr is ingeschakeld en de IPerfManager een INotificationManager .perfEvent() start, bepaalt deze vlag of een gebeurtenis wordt geactiveerd (en verzonden naar alle listeners) voor alle gebeurtenissen (true) of alleen voor bovenliggende gebeurtenissen (onwaar < > standaard). Een bovenliggende IPerfEvent is een gebeurtenis waarbij er geen andere IPerfEvent wordt uitgevoerd op het moment dat deze gebeurtenis wordt gemaakt en de bovenliggende eigenschap niet null of niet-gedefinieerd is. Sinds v2.5.7 |
booleaans onjuist |
| idLength | Hiermee wordt de standaardlengte geïdentificeerd die wordt gebruikt voor het genereren van nieuwe willekeurige sessie- en gebruikers-id-waarden. De standaardwaarde is 22, de vorige standaardwaarde was 5 (v2.5.8 of minder). Als u de vorige maximale lengte wilt behouden, moet u deze waarde instellen op 5. | numeriek 22 |
Cookieverwerking
Vanaf versie 2.6.0 is cookiebeheer nu rechtstreeks beschikbaar vanuit het exemplaar en kan het na de initialisatie worden uitgeschakeld en opnieuw worden ingeschakeld.
Als deze functie is uitgeschakeld tijdens de initialisatie via de configuraties of , kunt u deze nu opnieuw inschakelen via de disableCookiesUsage cookieCfg.enabled functie ICookieMgr. setEnabled
Het cookiebeheer op basis van een exemplaar vervangt ook de vorige globale coreUtils-functies disableCookies() van setCookie(...) , en getCookie(...) deleteCookie(...) . En om te profiteren van de verbeteringen die ook zijn geïntroduceerd als onderdeel van versie 2.6.0, moet u de globale functies niet meer gebruiken.
ICookieMgrConfig
Cookieconfiguratie voor op instanties gebaseerd cookiebeheer toegevoegd in versie 2.6.0.
| Naam | Beschrijving | Type en standaard |
|---|---|---|
| enabled | Een Booleaanse booleaanse functie die aangeeft of het gebruik van cookies door de SDK is ingeschakeld door het huidige exemplaar. Indien onwaar, worden in het exemplaar van de SDK dat door deze configuratie is initialiseerd, geen gegevens van cookies opgeslagen of gelezen | booleaans true |
| domein | Aangepast cookiedomein. Dit is handig als u Toepassings- en Insights wilt delen tussen subdomeinen. Als deze niet is opgegeven, wordt de waarde van de hoofdwaarde cookieDomain gebruikt. |
tekenreeks null |
| leertraject | Hiermee geeft u het pad op dat moet worden gebruikt voor de cookie, als dit niet is opgegeven, wordt er een waarde uit de hoofdwaarde cookiePath gebruikt. |
tekenreeks / |
| getCookie | Functie voor het ophalen van de benoemde cookiewaarde, indien niet opgegeven, wordt de interne cookieparsering/caching gebruikt. | (name: string) => string null |
| setCookie | Functie om de benoemde cookie in te stellen met de opgegeven waarde, die alleen wordt aangeroepen bij het toevoegen of bijwerken van een cookie. | (name: string, value: string) => void null |
| delCookie | Functie voor het verwijderen van de benoemde cookie met de opgegeven waarde, gescheiden van setCookie om te voorkomen dat de waarde moet worden geparseerd om te bepalen of de cookie wordt toegevoegd of verwijderd. Als dit niet is opgegeven, wordt de interne cookieparsering/caching gebruikt. | (name: string, value: string) => void null |
Vereenvoudigd gebruik van cookiebeheer van nieuwe instantie
- appInsights. getCookieMgr().setEnabled(true/false);
- appInsights. getCookieMgr().set("MyCookie", "the%20encoded%20value");
- appInsights. getCookieMgr().get("MyCookie");
- appInsights. getCookieMgr().del("MyCookie");
Bijhouden van tijd op pagina inschakelen
Door in autoTrackPageVisitTime: true te stellen, wordt de tijd bij te houden die een gebruiker op elke pagina doorgeeft. Op elke nieuwe PageView wordt de duur die de gebruiker op de vorige pagina heeft besteed, verzonden als een aangepaste metriek met de naam PageVisitTime . Deze aangepaste metrische gegevens kunnen in de Metrics Explorer als een 'metrische gegevens op basis van logboeken'.
Correlatie inschakelen
Correlatie genereert en verzendt gegevens die gedistribueerde tracering mogelijk maken en die het toepassingskaart, de end-to-end transactieweergaveen andere diagnostische hulpprogramma's mogelijk maken.
In het volgende voorbeeld ziet u alle mogelijke configuraties die nodig zijn om correlatie mogelijk te maken, met onderstaande scenariospecifieke opmerkingen:
// 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>
Als een van uw servers van derden met wie de client communiceert, de headers en niet kunt accepteren en u de configuratie ervan niet kunt bijwerken, moet u deze in een lijst met uitgesloten servers plaatsen via de Request-Id Request-Context configuratie-eigenschap correlationHeaderExcludedDomains . Deze eigenschap ondersteunt jokertekens.
De serverzijde moet verbindingen met die headers kunnen accepteren. Afhankelijk van de configuratie aan de serverzijde is het vaak nodig om de lijst aan de serverzijde uit te breiden door en Access-Control-Allow-Headers handmatig toe Request-Id te Request-Context voegen.
Access-Control-Allow-Headers: Request-Id , Request-Context , <your header>
Notitie
Als u OpenTelemtry of Application Insights SDK's gebruikt die zijn uitgebracht in 2020 of hoger, raden we u aan WC3 TraceContext te gebruiken. Zie configuratie-richtlijnen hier.
Toepassingen met één pagina
Deze SDK verwerkt standaard geen op status gebaseerde routewisselingen die plaatsvinden in toepassingen met één pagina. Als u automatisch bijhouden van routewijziging wilt inschakelen voor uw toepassing met één pagina, kunt u toevoegen enableAutoRouteTracking: true aan de configuratie van uw installatie.
Op dit moment bieden we een afzonderlijke React-invoegvoor , die u kunt initialiseren met deze SDK. U kunt er ook routewijzigingsvolgsystemen mee uitvoeren en andere React telemetrie verzamelen.
Notitie
Gebruik enableAutoRouteTracking: true alleen als u de React gebruikt. Beide kunnen nieuwe PageViews verzenden wanneer de route wordt gewijzigd. Als beide zijn ingeschakeld, kunnen dubbele PageViews worden verzonden.
Extensies
| Extensies |
|---|
| React |
| React Native |
| Angular |
| Klik op Analytics Auto-collection |
Browser-/clientgegevens verkennen
Browser-/clientgegevens kunnen worden weergegeven door naar Metrische gegevens te gaan en afzonderlijke metrische gegevens toe te voegen waarin u bent geïnteresseerd:
U kunt uw gegevens ook weergeven vanuit de JavaScript SDK via de browserervaring in de portal.
Selecteer Browser en kies vervolgens Fouten of Prestaties.
Prestaties
Afhankelijkheden
Analyse
Als u een query wilt uitvoeren op de telemetrie die is verzameld door de JavaScript SDK, selecteert u de knop Weergeven in logboeken (Analytics). Door een instructie van toe te voegen, ziet u alleen gegevens van de where JavaScript-SDK en worden alle telemetriegegevens aan de serverzijde die door andere client_Type == "Browser" SDK's worden verzameld, uitgesloten.
// 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
Ondersteuning voor bronkaart
De geminificeerde aanroeptack van uw uitzonderings-telemetrie kan in de Azure Portal. Alle bestaande integraties in het deelvenster Uitzonderingsdetails werken met de zojuist niet-geverifieerde callstack.
Koppelen aan Blob Storage-account
U kunt uw Application Insights-resource koppelen aan uw eigen Azure Blob Storage container om aanroepstacks automatisch te demineren. Zie Automatische ondersteuning voor bronkaart om aan de slag te gaan.
Slepen en neerzetten
- Selecteer een uitzonderings-telemetrie-item in Azure Portal om de end-to-end transactiedetails ervan weer te geven
- Bepaal welke bronkaarten overeenkomen met deze aanroepstack. De bronkaart moet overeenkomen met het bronbestand van een stackframe, maar met het achtervoegsel
.map - Sleep en zet de bronkaarten neer op de aanroepstack in de Azure Portal Een animatie waarin wordt getoond hoe u bronkaartbestanden uit een buildmap naar het aanroepstackvenster in het
Application Insights Web Basic
Voor een lichtgewicht ervaring kunt u in plaats daarvan de basisversie van Application Insights
npm i --save @microsoft/applicationinsights-web-basic
Deze versie wordt geleverd met het minimale aantal functies en functies en is afhankelijk van u om deze naar eigen goedheid op te bouwen. Er wordt bijvoorbeeld geen autocollection uitgevoerd (niet-binnengescheden uitzonderingen, AJAX, enzovoort). De API's voor het verzenden van bepaalde telemetrietypen, zoals , , enzovoort, zijn niet opgenomen in deze versie, dus u moet uw trackTrace trackException eigen wrapper leveren. De enige API die beschikbaar is, is track . Hier bevindt zich een voorbeeld.
Voorbeelden
Zie Application Insights JavaScript SDK Samples voor voorbeelden diekunnen worden uitgevoerd.
Upgraden van de oude versie van Application Insights
Belangrijke wijzigingen in de SDK V2-versie:
- Voor betere API-handtekeningen zijn sommige API-aanroepen, zoals trackPageView en trackException, bijgewerkt. Uitvoeren in Internet Explorer 8 en eerdere versies van de browser wordt niet ondersteund.
- De envelop met telemetriegegevens bevat veldnaam- en structuurwijzigingen als gevolg van gegevensschema-updates.
- Verplaatst
context.operationnaarcontext.telemetryTrace. Sommige velden zijn ook gewijzigd (operation.id-->telemetryTrace.traceID).- Als u de huidige paginaweergave-id handmatig wilt vernieuwen (bijvoorbeeld in spa-apps), gebruikt u
appInsights.properties.context.telemetryTrace.traceID = Microsoft.ApplicationInsights.Telemetry.Util.generateW3CId().Notitie
Gebruik nu om de trace-id uniek te houden, waar u eerder hebt
Util.newId()Util.generateW3CId()gebruikt. Uiteindelijk zijn beide de bewerkings-id.
- Als u de huidige paginaweergave-id handmatig wilt vernieuwen (bijvoorbeeld in spa-apps), gebruikt u
Als u de huidige Application Insights PRODUCTION SDK (1.0.20) gebruikt en wilt zien of de nieuwe SDK in runtime werkt, werkt u de URL bij, afhankelijk van uw huidige SDK-laadscenario.
Downloaden via CDN scenario: werk het codefragment bij dat u momenteel gebruikt om naar de volgende URL te wijzen:
"https://js.monitor.azure.com/scripts/b/ai.2.min.js"npm-scenario: roep aan om het volledige ApplicationInsights-script te downloaden van CDN
downloadAndSetupinitialiseren met instrumentatiesleutel:appInsights.downloadAndSetup({ instrumentationKey: "xxxxxxxx-xxxx-xxxx-xxxx-xxxxxxxx", url: "https://js.monitor.azure.com/scripts/b/ai.2.min.jss" });
Test in de interne omgeving om te controleren of de bewakings-telemetrie werkt zoals verwacht. Als alles werkt, werkt u uw API-handtekeningen op de juiste manier bij naar de SDK V2-versie en implementeert u deze in uw productieomgevingen.
SDK-prestaties/overhead
Na slechts 36 kB te hebben gezipped en slechts ongeveer 15 ms te hebben gebruikt om te initialiseren, voegt Application Insights een te kleine hoeveelheid laadtijd toe aan uw website. Met behulp van het fragment worden minimale onderdelen van de bibliotheek snel geladen. In de tussentijd wordt het volledige script op de achtergrond gedownload.
Terwijl het script wordt gedownload van de CDN, wordt alle tracering van uw pagina in de wachtrij geplaatst. Zodra het gedownloade script asynchroon is initialiseren, worden alle gebeurtenissen die in de wachtrij zijn geplaatst, bijgeslagen. Als gevolg hiervan verliest u geen telemetrie tijdens de hele levenscyclus van uw pagina. Dit installatieproces biedt uw pagina een naadloos analysesysteem dat onzichtbaar is voor uw gebruikers.
Samenvatting:
- 15 ms totale initialisatietijd
- Geen tracering gemist tijdens levenscyclus van pagina
Browserondersteuning
 |
 |
 |
 |
 |
|---|---|---|---|---|
| Chrome Latest ✔ | Meest recente ✔ Firefox | IE 9+ & Edge ✔ IE 8- Compatibel |
Meest recente ✔ | Meest recente ✔ |
Compatibiliteit met ES3/IE8
Als SDK zijn er talloze gebruikers die geen controle hebben over de browsers die hun klanten gebruiken. Daarom moeten we ervoor zorgen dat deze SDK blijft werken en de JS-uitvoering niet verbreekt wanneer deze wordt geladen door een oudere browser. Hoewel het ideaal is om IE8- en oudere generatiebrowsers (ES3) niet te ondersteunen, zijn er talloze grote klanten/gebruikers die pagina's nog steeds verplicht moeten 'werken' en zoals vermeld, kunnen ze al dan niet bepalen welke browser hun eindgebruikers willen gebruiken.
Dit betekent NIET dat we alleen de laagste algemene set functies ondersteunen, alleen dat we ES3-codecompatibiliteit moeten behouden en bij het toevoegen van nieuwe functies moeten ze worden toegevoegd op een manier die het parseren van ES3 JavaScript niet verbreekt en als een optionele functie wordt toegevoegd.
Zie GitHub voor meer informatie over IE8-ondersteuning
Opensource-SDK
De Application Insights JavaScript SDK is opensource om de broncode weer te geven of om bij te dragen aan het project. Ga naar de officiële GitHub opslagplaats.
Raadpleeg de opmerkingen bij de release voor de meest recente updates en oplossingen voor fouten.