Le Post Infeeny

Les articles des consultants et experts Infeeny

#UWPHTML – using application insights in your Windows web applications

Publishing an application is a great experience. You really feel self-accomplishement when users provide good feedback (and ratings if you are Lucky). And then a few users reports errors but you can’t reproduce them. When your application is in the wild, you realize very quickly that you need something to get feedback from your app. Knowing what your users are doing with your application is also very valuable to help you focus efforts where you need to.

Without noticing you slipped from developping a hobby application to entering the world of analytics. You know, those little nasty snippets that your customers always asked you to put all around like Xiti or Google analytics.

Microsoft has it’s own solution for application analytics called Azure Application Insights. This tool has free and paid options depending on how long you store data, and the number of events you want to manage.

When you create a C# UWP application, Visual Studio has an option to integrate Application Insights for your project.

Unfortunately, you don’t have that same option when using UWP in HTML/JavaScript. In that case, you will have to do all plumbing manually. Microsoft provide a SDK for using Application Insight in JavaScript. It works well but this SDK is really oriented toward web applications, both in the sdk and in the structure of the Dashboard. Even worse, if you choose to type your application insights instance to a Windows application, some of the events (like errors…) does not show up in the Dashboard when sended with Javascript SDK.

For « Bring the popcorn« , it really is a Windows native application and we wanted to get the appropriate Dashboard and reporting. After some time spent with Fiddler comparing items sent to app insight from C#  and javascript, we narrowed down the différences in metadata.

We wrote small a wrapper for JavaScript sdk that adds those metadata and everything starts working fine.

This wrapper is published in WinJSContrib but we made it in such a way that it will work without WinJS or WinJSContrib.

Using application insights in your Windows Web Application is now very easy. You will first need to declare your application in application insights. When declaring your application, choose « Windows store application » for application type. When your instance is ready, go to it’s properties and get the « instrumentation key ». You will need this key in your application.

Now you are ready to integrate App Insights into your application. Go grab Application Insight Javascript SDK, and our wrapper, and add reference to them in your application.

In your application bootstrap code, you could now add something like this :


var appInsight = new WinJSContrib.WinRT.AppInsight({ instrumentationKey: "yourInstrumentationKey" });
appInsight.tracker.trackEvent("app start");

The wrapper will inject the appropriate metadata to have your events displayed in the Dashboard. It also registers to global « error » events, and send the corresponding errors to application insights.

If you are using WinJS, you could also have page navigation events for free :


appInsight.wrapWinJSNavigation();

If you want to see a real world example, you could check how we use this in Bring the popcorn.

Laisser un commentaire

Entrez vos coordonnées ci-dessous ou cliquez sur une icône pour vous connecter:

Logo WordPress.com

Vous commentez à l'aide de votre compte WordPress.com. Déconnexion / Changer )

Image Twitter

Vous commentez à l'aide de votre compte Twitter. Déconnexion / Changer )

Photo Facebook

Vous commentez à l'aide de votre compte Facebook. Déconnexion / Changer )

Photo Google+

Vous commentez à l'aide de votre compte Google+. Déconnexion / Changer )

Connexion à %s

%d blogueurs aiment cette page :