Mim's Blog

Disponibilité du SDK.NET Microsoft.Graph

Sebastien Pertus — Wed, 06 Apr 2016 14:16:16 GMT

Bonjour à tous;

Si vous avez une question, n'hésitez pas à me contacter via twitter : @sebastienpertus
Les sources du projet sont disponibles ici : https://www.github.com/Mimetis/NextMeetingsForGraphSample

Une annonce passée un peu inaperçu pendant la //Build 2016, qui me semble pourtant importante quand vous développez avec Office 365 : La disponibilité du SDK Microsoft GRAPH pour .NET, ANDROID et iOS ! Pour rappel, quand on veut attaquer les données du Graph, on peut aussi bien utiliser directement les API REST, et maintenant donc, les SDK mobiles: Voici quelques pointeurs intéressants sur le sujet :

https://github.com/microsoftgraph : Le nouveau Github utilisé par l'équipe Microsoft Graph.
https://www.nuget.org/packages/Microsoft.Graph : Le package Nuget du Microsoft.Graph
https://github.com/OfficeDev/Microsoft-Graph-UWP-Connect-Library : Un premier exemple utilisant le SDK .NET

Le SDK est bien fait. Il permet d'utiliser son propre mécanisme d'authentification. Evidemment ADAL est celui préconisé. Sauf que l'exemple de l'équipe Office Dev se base sur un fournisseur d'authentification personnalisé (donc pas ADAL ...) Je vous propose de créer une application UWP qui tire parti de ce nouveau SDK, avec quelques APIs classiques et quelques retours d'expériences. Et biensûr, un fournisseur d'accès basé sur ADAL !

Application de démonstration

L'application qui sert de base à notre petite démo est accessible sur mon github ici : https://www.github.com/Mimetis/NextMeetingsForGraphSample C'est une application UWP, qui pourra vous servir de base à d'autres projets :)

GraphServiceClient et Authentification

Une fois le package nuget installé, vous aurez accès à l'objet GraphServiceClient qui lors de son instanciation a besoin d'un objet implémentant IAuthenticationProvider. Pour faire simple, le SDK demande juste à remplir le header de votre requête REST avec le jeton d'authentification correct. Voici une partie de la définition de la classe : Et voici l'interface IAuthenticationProvider : Pour utiliser ADAL, n'oubliez pas d'ajouter le package nuget ADAL.NET : https://www.nuget.org/packages/Microsoft.IdentityModel.Clients.ActiveDirectory/ Voici une partie de la classe AuthenticationHelper que vous trouverez dans l'application exemple. Remarquez bien la méthode AuthenticateRequestAsync qui est l'implémentation de l'interface IAuthenticationProvider. On s'authentifie et on injecte le jeton d'accès dans l'entête de la requête http provenant du SDK Microsoft.Graph :)

Amélioration possible : ajouter un CancellationToken pour gérer les exceptions, ça serait beaucoup mieux qu'afficher une boite de dialogue :o

Voilà la partie la plus compliquée de l'utilisation du SDK :) Il ne reste plus qu'à appeler les APIs REST via les méthodes du SDK !

Récupération d'informations

La plupart du temps, chaque requête REST faisant un GET est plutôt simple. Il existe quelques variantes pour par exemple récupérer une photo ou avoir la liste des évènements de votre calendrier. Voici un exemple d'appel pour récupérer son propre profil : Ok, simplissime ! Pour entrer un peu dans le détail, la méthode Request() génère la requête qui est exécutée lors de l'appel de GetAsync(). La méthode Request() peut prendre des paramètres, mais nous verrons cela un peu plus loin Un cas un peu plus complexe : Récupérer la photo d'un utilisateur. Par défaut si vous exécuter ce code : Vous récupérez non pas la photo, mais les informations de la photo :) Récupérer le Stream de la photo s'effectue avec la requête REST: //users/{identifier}/photo$value Le SDK Graph gère ce cas et vous propose la propriété Content pour récupérer ce flux. Voici l'exemple de récupération de la photo d'un utilisateur : Un autre cas un peu particulier, récupérer les évènements à venir de votre calendrier. La requête REST nécessite absolument de rajouter 2 paramètres (date début et date de fin) dans la requête GET. Comme on l'a vu précédemment, vous pouvez appelez la méthode Request() avec un tableau de paramètres de type QueryOption. Voici le code pour récupérer vos prochains évènements sur un mois : Vous noterez que le résultats de votre requête est paginée. Pensez à vérifier la valeur de la propriété NextPageRequest pour savoir si vous devez itérer :)

Ajout, modification, suppression

Une fois que vous avez saisi la logique, il est simplissime (again) d'ajouter modifier ou supprimer une entité. Voici le code des méthodes Save et Delete, qui parlent d'elles-mêmes :) That's all !

VorlonJS plugin for debugging Office Addin

Sebastien Pertus — Thu, 18 Feb 2016 09:03:35 GMT

If you have any question about this article, Vorlon.js or Office dev, feel free to contact me on twitter: https://twitter.com/sebastienpertus

Today I want to share with you my last project.
I developed a plugin for VorlonJS, to be able to debug any Office-Addin, even if you don’t develop with Visual Studio or if you experience some troubles with your addin deployed on a device

VorlonJS

VorlonJS is a remote debugger, you can get more information about VorlonJS, here : https://www.vorlonjs.io

If you want to know even more on the last VorlonJS, my colleague Etienne (@meulta) has written a blog post about it : https://bit.ly/vorlon-0-2-1

Why create a VorlonJS Plugin for Office addin ?

When you create an Office addin, you extend the Office features with a web app that lives within Office Applications.

It works both on Office desktop, Office online (Office 365 or Outlook.com), on mobile devices like IPAD, Android phone, IPhone, Windows Phone and so on…

Keep in mind that your Office addin “should” work everywhere, and you have to test it everywhere.
But what can you do if your Office addin doesn’t work on a mobile ? How to debug it ?

This is the main reason why I created this plugin for VorlonJS. Being able to debug my addin, deployed on any device, during my development process

Installing VorlonJS.

VorlonJS installation is pretty straightforward. You will find a complete documentation here on how to install it.

In a nutshell, VorlonJS works on node.js. You can install it from npm or clone the Github repository locally.
Since the Office addin plugin is currently available only in the dev branch from the Github repository, you have to clone locally the repository.

Get the dev branch of VorlonJS

If you’re familiar with GIT, cloning the repository is something you have already done multiples times ! Just don’t forget to checkout the dev branch.

Just in case, here are the command lines to clone VorlonJS on your machine:

git clone https://github.com/MicrosoftDX/Vorlonjs.git
git checkout dev
npm install

Enabling HTTPS

Actually, making an Office Addin requires to be in HTTPS. (You can disable HTTPS for Word / Excel Addin, but you can’t for Outlook)

So, you need to activate HTTPS for your VorlonJS website

First of all, open the /Vorlon/config.json file and set the useSSL property to true :

VorlonJS used a localhost certificate, not trusted. You need to install this certificate, to be able to debug your add’in.

Go to /Vorlon/server/cert/ folder and :

open the server.crt certificate and launch the install certificate wizard
Select the Local Machine certificate store
Select the Trusted Root Cetification Autorithies, for your newly trusted certificate

You’re almost done.

Enabling Office addin plugin

Last step before using VorlonJS with the Office-Addin plugin, you need to activate it, since this plugin is not available by default.

Once again, in the config.json file, located in /Vorlon/Server/config.json and activate it (set to the property enabled to true)

You’re done !

Using the Office-Addin plugin

Launch the Dashboard

The first step is to launch VorlonJS. Once again pretty straightforward when you know how to deal with node.js

you can also use npm start ( it’s just a shortcut for the command line node /server/server.js)

npm start

Open your favorite browser and go to the https address : https://localhost:1337.
you should see the empty dashboard of VorlonJS :

Adding VorlonJS script in your Office-Addin project

In a nutshell, create or open your Office-Addin project, and add this script balise in your html page :

That’s all !

Note : To show you the plugin features, I will use the default starter project created by Visual Studio when you choose a mail application :

In the AppCompose/Home/Home.html here is the script inserted :

To be able to work with Outlook desktop, I configured the manifest project to launch Office Outlook desktop (instead of launching Office Outlook online)

Press F5 and go !

Use VorlonJS to debug

Here is my Office-Addin launched in my Outlook desktop :

And here is my VorlonJS dashboard (which has already made a link to my Office-Addin)

Obviously, you can use the VorlonJS core plugins, like Dom Explorer, Obj Explorer or the Interactive Console to interact with your addin.

A straightforward test : use the Interactive Console to send the command to your addin:

console.log(Office.context.mailbox.item.subject)

VorlonJS will send the command to the Addin.
The Addin will execute it the command line order
VorlonJS will get the response back and show it in the console !

Go to the Office-Addin tab

You will see every interesting properties from you Office instance !

for example, the subject is located in the Office / context / mailbox / item / subject

You can, as well, execute some functions ! For instance, try to go to the /body node and click on the getAsync node. In the property window click the invoke, and voilà !

FYI : Some functions are only available in compose mode or in read mode. Don’t be surprise if some functions actually don’t work. Try again in the other mode (read / compose)

For fun, in Read mode, launch the method displayReplayAllForm :

You should see the Reply Form popup !

Conclusion

You have now a really straightforward tool to debug your Office-Addin, even if you’re debugging from a mobile device

We don’t have seen every features, don’t forget to use the dom explorer to debug your layout, the object explorer to see any object instanciated in your addin, the XHR request manager to trace any xhr requests etc …

Seb

Babylonjs generator

Sebastien Pertus — Thu, 03 Dec 2015 06:19:35 GMT

Hi Everyone.

If you have any question about this article, feel free to contact me on twitter: https://twitter.com/sebastienpertus

Today I want to share with you a new project I work on those days. The idea is to bring you a new tool to generate code for BabylonJS

Imagine you want to create a quick project with BabylonJS. You have to create a project, reference BabylonJS, create a simple scene, add assets and so on.

It’s straightforward, but we can do better…

BabylonJS Generator is a npm package based on Yeoman to provide you a simple way to create a BabylonJS project, hosted on node.js

Yeoman generator is already used with a lot of project (angular, webapp, wordpress, asp.net, office addins and so on …)

Check the generators here : https://yeoman.io/generators/

The Babylon generator

Installation

First, install Yeoman and generator-babylonjs using npm (we assume you have pre-installed node.js).

This step has to be done only one time. The “-g” argument will install those packages globally to your computer.

npm install -g yo
npm install -g generator-babylonjs

From now, you can generate your new project with this simple command :

yo babylonjs
 
 
Actually you can choose the title, creating or not a folder for you solution and then choose the node.js port.
Once the generator is done, you can open your project with your favorite IDE  (Visual Studio Code for me ):
You will have a complete project based on :

Node.js for the server side
Jade for the client template engine (well to be honest, we just need a canvas element )
Express for the routing / middleware engine.
BabylonJS (obviously !) for the 3D JavaScript engine.
All the required JavaScript code is located in the /public/scripts/index.js file.
From now, you can hit F5 (on VS Code) or just run node :
node app.js
And we’re done !

Playground option

here is an other interesting option : If you found a cool scene from the playground, you can generate the full code with the playground scene identifier :

Imagine this playground sample : https://www.babylonjs-playground.com/#11OYNB#12

would it be cool to generate the full project based on this sample ?

Well, just add the argument –playground to your command line to generate the full playground sample code :

yo babylonjs --playground #11OYNB#12
 
 
With this option, all the code is downloaded from the playground and then injected in the index.js file :
 
 
Like we’ve done before, just hit F5 or run node 
 
node app.js
 
and we’re done (again  ) !
 
 
Cool ?

Getting To Know Yeoman

Yeoman has a heart of gold. He's a person with feelings and opinions, but he's very easy to work with. If you think he's too opinionated, he can be easily convinced. Feel free to learn more about him.

Office 365 add in and BabylonJS

Sebastien Pertus — Mon, 02 Nov 2015 01:15:16 GMT

Hi everyone;

Today I want to share with you a very cool demo I realized for the French event Techdays 2015.

Yes, it’s me
Yes, I forgot to take off my badge during the keynote!

Everything shown here is available in the official Office dev Github repository: https://github.com/OfficeDev/Excel-Add-in-JS-BabylonJS

Intro

The goal is to demonstrate the easy use of Office 365 dev application model and the BabylonJS framework.
The main purpose of this demo is to show the path-finding of people inside the Microsoft France Lobby as show in this screenshot:

If you want to know more about BabylonJS and how to use it, feel free, all about this fantastic framework is available here : https://www.babylonjs.com

In my opinion, here are the three main interesting points of this development:

Use of the Office.js SDK to be able to communicate between my add in and the current worksheet.
Use of the BabylonJS SDK to create a smooth and incredibles animations in a full 3D real time environment.
Use of Typescript to be able to write a full comprehensible and maintainable JavaScript project (and by the way, I'm a C# developer, Typescript is therefore obvious for me)

Office Add In

First of all, the main url for "All-Whant-You-Need" about Office dev, is here : https://dev.office.com

Geting datas from Excel worksheet

The main source code is maintained in the App/Welcome/Tracker.ts file

The _setTableBinding method is called once the scene AND the file is completely loaded . I used the addFromNamedItemAsync method to create a basic binding:

By default, adding a table in Excel assigns the name "Table1" for the first table you add, "Table2" for the second table you add, and so on.
Be careful, In Excel, when specifying a table as a named item, you must fully qualify the name to include the worksheet name in the name of the table in this format: "Sheet1!Table1", as you can see in this code :

private _setTableBinding() {
    ///
    ///
Create a binding to later gate the datas

    ///

    Office.context.document.bindings.addFromNamedItemAsync("Sheet1!Table1",
        Office.BindingType.Table, { id: "positions" },
        (asyncResult: any) => {
            if (asyncResult.status === "failed") {
                console.log("Error: " + asyncResult.error.message);
            } else {
                try {
                    this._tableBinding = asyncResult.value;
                } catch (e) {
                    console.log(e);
                }
            }
        });
}

Before going in the BabylonJS code, you have to get all the datas from you Excel table. You will find the code in the playDatas() method:

As you can see, I used two useful options when I get datas with the getDataSync method :

valueFormat : Office.ValueFormat.Unformatted : To be able to parse the current datas, useful for date, number etc …
filterType: Office.FilterType.OnlyVisible : It’s a great option in my scenario, because with the Straightfoward filters in an Excel worksheet, I can isolate a particular path-finding !

More about getDataAsync method : https://msdn.microsoft.com/en-us/library/office/fp161073.aspx

// Get datas
this._tableBinding.getDataAsync(
    {
        // Options : We can get filtered or not datas
        filterType: Office.FilterType.OnlyVisible,
        // Options : To be able to work with those datas, no format will help, later
        valueFormat: Office.ValueFormat.Unformatted
    },
    (result) => {
        if (result.status === "succeeded") {
            // Rows
            var rows = result.value.rows;

            // etc ...
        }
    });

Localization

The UIStrings.js file is here to localize the application. Basically, you have to :

Localize everything that is not handled by you : Title and Description in the ribbon for example
Localize your application handled by you

In the manifest file (you should open it in XML mode) check that you have corrects values for each language you handle :

en-US

In the other hand, for everything else, you can use two kind of informatins to know what language you should apply. In my case I use the display language to localize my add in :

// Document language
var contentLanguage = Office.context.contentLanguage;
// Display language
var displayLanguage = Office.context.displayLanguage;

// Choose Display or Document language
var UIText = UIStrings.getLocaleStrings(displayLanguage);

BabylonJS

In this sample using BabylonJS is pretty straightforward. for those of you interested in, here are the main steps to make babylonJS works :

Get a HTML5 canvas render surface
Create a BabylonJS engine instance binded to your canvas
Create a scene composed of :
1. A complete 3D modelised scene (the lobby in this sample) (imported with the Babylon SceneLoader
2. Add a free camera
3. Add a light
When my datas from my worksheet are loaded (and binded) create all the animations of every path-finding
Render the scene .. in a render loop

The launchScene method is the main method where you initialize all what you need. This method is always called when your document AND when Office is ready :

// launch the scene when office AND document are ready
Office.initialize = function (reason) {
    $(document).ready(function () {
        tracker.launchScene();
    }
});

Here is the launchScene method, as you can expect, we basically get the canvas, create an engine, create the scene, and call the render method :

public launchScene() {
     ///
     ///
Launch the scene

     ///

     try {

         // Check if BabylonJS is supported
         if (!BABYLON.Engine.isSupported()) {
             return;
         }

         if (this.engine) {
             this.engine.dispose();
             this.engine = null;
         }

         this.canvas = document.getElementById("renderCanvas");
         this.engine = new BABYLON.Engine(this.canvas, true);
         this.scene = this._createScene();

         // Here we go ! RENDERING BABY !
         this.engine.runRenderLoop(() => {
             this.scene.render();
         });
     } catch (e) {
         console.log(e.message);
     }
}

Before creating the animations, we create the scene, as I said earlier :

private _createScene() {
    ///
    ///
Creating the scene (see BabylonJS documentation)

    ///

    this.scene = new BABYLON.Scene(this.engine);

    this._freeCamera = new BABYLON.FreeCamera("FreeCamera", new BABYLON.Vector3(0, 0, 5), this.scene);
    this._freeCamera.rotation = new BABYLON.Vector3(0, Math.PI, 0);

    this.scene.activeCamera = this._freeCamera;
    this._freeCamera.attachControl(this.canvas, true);

    var light = new BABYLON.HemisphericLight("hemi", new BABYLON.Vector3(0, 1, 0), this.scene);

    // Resizing the add in
    window.addEventListener("resize", () => { this.engine.resize(); });

    // The first parameter can be used to specify which mesh to import. Here we import all meshes
    BABYLON.SceneLoader.ImportMesh("", "/Assets/", "Welcome.babylon",
        this.scene, (newMeshes: BABYLON.AbstractMesh[]) => {

            // position Camera
            this._setFreeCameraPosition();

            //bind to existing datas
            this._setTableBinding();
        });

    return this.scene;
}

Animating every path-finding, thanks to BabylonJS, is pretty straightforward.
When the user will click the Play button, I call the playDatas() method and I create all the animations then launch them :

The code presented here is not complete, it just highlights what I think is important For the complete code, just refer the Github repo

for (var i = 0; i < lstGrp.length; i++) {
     var sphTab = lstGrp[i];

     // Every sphere must have a uniquename
     var sphereName = "d_" + sphTab[0][0] + "sphere";
     // Create the sphere
     var sphere = BABYLON.Mesh.CreateSphere(sphereName + "_sphere", 8, 4, this.scene);

     // Create a yellow texture
     var m = new BABYLON.StandardMaterial("texture2", this.scene);
     m.diffuseColor = new BABYLON.Color3(1, 1, 0); // yellow
     sphere.material = m;
     sphere.isPickable = true;

     // Create an animation path
     var animationPath = new BABYLON.Animation(sphereName + "_animation", "position", (30 * this.accelerate),
         BABYLON.Animation.ANIMATIONTYPE_VECTOR3,
         BABYLON.Animation.ANIMATIONLOOPMODE_CYCLE);

     this._animations.push(animationPath);

     // Create all the frames for each sphere
     var keys = [];
     var maxFrame = 0;
     // in each group, each pos
     for (var j = 0; j < sphTab.length; j++) {

         var pos = new BABYLON.Vector3(posX, posY, posZ);
         keys.push({ frame: currentFrame, value: pos });

     }
     animationPath.setKeys(keys);
     sphere.animations.push(animationPath);

     // Launch the animation for this sphere
     this.scene.beginAnimation(sphere, 0, maxFrame, true);

}

Try it out

Get the sample

Clone or download the sample, open it with Visual Studio 2015.

Please check in add in project if the start object is "Accueil.xls".
This Excel file contains pre-populated datas, mandatory for the demo :

Hit F5 and try it !

Azure AD B2C

Sebastien Pertus — Wed, 23 Sep 2015 07:42:00 GMT

Bonjour à tous;

Le 16 Septembre a été annoncé l'arrivée d'une nouvelle fonctionnalité dans Azure AD : le mode B2C et B2B.
Vous pouvez d'ailleurs lire l'annonce sur le blog officiel de l'équipe Active Directory ici : https://blogs.technet.com/b/ad/archive/2015/09/09/azure-ad-b2c-and-b2b-are-now-in-public-preview.aspx

Aujourd'hui nous allons nous intéresser au modèle B2C.

L'intéret du truc ?

Beaucoup d'entre vous ont déjà utilisé différents SDK pour gérer l'authentification de vos utilisateurs par Facebook, Twitter ou Google+ (ou Microsoft Account ? )

Bien entendu, on a pas attendu ce jour béni pour fournir des services "all in zi-box" pour gérer l'authentification :

Mutualisation de ces mécanismes dans Azure Mobile Services.
Templates évolués ASP.NET pour gérer le multi auth avec le middleware OWIN
Différents SDK clients comme PASSPORT pour Node.js
Les SDK ADAL.NET et ADAL.JS pour gérer l'authentification
Et plein d'autres dont je ne me rappelle plus et que vous connaissez suremment

Tout ça fonctionne bien, mais la question qui revient en boucle c'est "On fait quoi des informations de notre utilisateur une fois celui ci connecté ?"

Aujourd'hui, vous allez pouvoir gérer vos utilisateurs dans un annuaire unique, quelque soit le fournisseur d'acès qu'a choisit votre utilisateur.
Avant, il fallait obligatoirement gérer vos utilisateurs depuis votre propre backend (Bon, il faut bien avouer que beaucoup de choses étaient bien automatisées et créés pour vous, et qui masquaient la tuyauterie)

Vous n'avez PLUS besoin de gérer les informations par vous même lors du retour de l'API Facebook, Twitter ou autre. Avant, lors d'une authentification Facebook par exemple, il fallait récupérer les informations de l'utilisateur comme son ID, email, Ville etc ... et les enregistrer dans une base locale ou autre.
Aujourd'hui ce service est fourni par Azure AD B2C.
Mieux, vous allez pouvoir ajouter vos propres champs personnalisés, et c'est encore géré pour vous (et c'est cadeau)

Un meilleur management de vos fournisseurs d'accès. Avant, pour ajouter ou supprimer un fournisseur d'accès externe, il fallait, à m'ment-donné (Copyright Sud Ouest), mettre les mains dans le camboui et ajouter ou supprimer du code, ne serait-ce que pour faire apparaitre ou disparaitre les boutons de login :)
Aujourd'hui, tout ça est encore une fois géré pour vous.

Plus besoin de paramétrer l'ensemble de vos ClientID / ClientSecret dans votre application, tout ça se fait depuis Azure AD B2C. Cool !

Bref, un véritable concentrateur d'ididentité externe arrive, et va vraiment nous faciliter la vie. Et ça ... c'est swag...

Créer votre AD B2C

Attention : Une limitation "pour l'instant" : Une fois créé, vous ne pouvez plus supprimer votre annuaire (je vous aurai prévenu hein. Pas taper, pas taper, ça va venir)

Attention bis : Une autre limitation : On crée l'annuaire depuis l'ancienne interface (https://manage.windowsazure.com) et on administre depuis la nouvelle interface (https://portal.azure.com) (pas taper touça touça)

Vous vous loguez donc sur l'ancien portail et créé un Azure AD où vous précisez bien que cet AD est un AD B2C :

Une fois créé, tout le reste se passe dans le nouveau portail. Il suffit donc de cliquer sur Gestion des paramètres B2C pour ouvrir le nouveau portail :

et hop !

A partir de là, il ne reste plus qu'à configurer :)

Applications

Vous crééz une application (un peu comme sur Facebook ou Twitter ou Microsoft Account) qui sera de type Web App / Native Client.
C'est cette application seule qui sera à configurer depuis votre application mobile ou votre site web (c'est elle qui fédère tous les autres)

Lorsque vous crééz votre application, n'oubliez pas de noter votre Application Client Id et votre App key (on dit souvent Client Secret aussi)

Identity Providers

Ici vous allez empiler les fournisseurs que vous voulez utiliser pour authentifier vos utilisateurs.
Ce qui est TRES BIEN ici c'est que vous ajoutez et configurez vos fournisseurs, mais vous n'êtes pas obligé de tous les utiliser (dans un premier temps)
Globalement on ajoute des fournisseurs et on les utilise ... ou pas (sans être obligé de les supprimer)

Chaque fournisseur doit être configuré. Voici une documentation récente sur comment ça marche :

Oui je sais, il manque encore Twitter ou Microsoft Account (pas taper ...) ça va venir !

Attributs personnalisés

Encore un truc bien cool et bien pensé. Par défaut vous allez pouvoir utiliser des champs pour ajouter de la valeur au profil de votre utilisateur. De base évidemment, on a des champs disponibles comme le mail, nom, ville, User Object ID etc...

Mais vous pouvez en ajouter à volonté. Pour le moment, on est limité à des chaines de caractères. On peut imaginer un champ Fidility Points, représentant des points de fidélité (imagination débordante de votre serviteur ...)

Policies ou Règles de sécurité

Tout ce que nous avons fait jusque là représente de la configuration. C'est maitenant que nous allons vraiment utiliser notre application / fournisseurs / champs perso. pour créer une expérience d'authentification. Mais pas que ...

Comme on l'a vu, on va avoir la possiblité de manager nos utilisateurs : S'inscrire, Se signer, Modifier son profil, Faire un reset de son mot de passe etc ...

Pour chaque grande famille, nous allons créer des "policies". Appelons ça des règles de sécurité :

Une règle pour l'inscription
Une règle pour l'authentification
Une règle pour l'édition du profil

Chaque règle va comporter plusieurs choix :

Quelle application ? (cette application qui contient ClientId / ClientSecret)
Quels fournisseurs ? Un ou plusieurs (Classique, Facebook, Google+ etc ...)
Quels attributs on veut exposer / récupérer ? (On va voir ça en détail)
Est-ce que l'authentification multifacteur doit être activée ?
Comment personnaliser la page exposée ?

Règle pour l'inscription : Sign Up Policy

Cette règle doit exécuter plusieurs choses:

Exposer les fournisseurs s'il y a plus d'un.
S'authentifier auprés du fournisseur et récupérer les champs que vous avez configuré.
Proposer des champs de saisie pour les champs qui ne sont pas proposés par le fournisseur.

Pour mon exemple, je décide de créer une règle qui expose tous les fournisseurs, je la nomme ALL (A postériori j'aurai dû l'appeler ALL_SIGN_IN, vu que les noms de policies doivent être uniques)

Si demain, vous decidiez de ne plus utiliser par exemple le fournisseur Google+ il suffit juste de le décocher ici, et vous n'avez pas besoin de reconfigurer / recompiler votre application :) good !

Attributs : Ils représentent les éléments que vous voulez utiliser pour enrichir le profil de votre utilisateur. Dans mon cas, je veux au moins gérer les champs "Ville", "Nom d'usage", "Email" et mes fameux "FidelityPoints" :

Applications Claims : Ici on paramètre les champs qu'on veut récupérer par le fournisseur : Evidemment tous les fournisseurs ne fournissent pas tous les champs, mais on peut tout de même tenter :)

Dans mon cas, je sais que Facebook me récupère facilement la ville, email, given name, alors on va pas se priver ! Des champs intéressants comme le User Object ID ou le User Is New peuvent aider..

Testage (C'est toulousain, cherchez pas) : A partir de là (et après avoir sauvegardé), on peut déjà tester le comportement de notre page d'inscription (bouton Run Now) !

Voici l'enchainement des écrans dans mon cas :

(J'ai zappé l'étape "Vérification du Mail" qui vous envoie un code par mail pour vérifier toute inscription "fake")

Aprés la création, nous sommes redirigés vers l'application / site web hôte, que nous n'avons pas encore créé. Ne vous étonnez pas d'avoir une 404 au bout :)

Comment vérifier que cet utilisateur existe ? Et bien, il suffit d'aller dans votre annuaire fraichement créé (depuis l'ancien portail, pas taper, touça touça)

Bon évidemment là, on voit deux comptes m'appartenant, le premier est le compte admin de l'AD, le deuxième ... mon test ! Mais vous imaginez bien le truc.

Et evidemment si on regarde le détail de ce nouvel utilisateur, on voit trés bien l'intéret de ce système :

Règle pour l'authentification et Règle pour l'édition du profil / Sign In policy & Editing policy

Ces deux règles se paramètrent de la même manière que la précédente. On règle les fournisseurs, et les éléments qu'on présente et qu'on veut récupérer dans le Token de retour.

Au final, je me retrouve avec mes trois règles paramétrées :

Note : Les noms de règles étant uniques, j'aurais suremment dû appeler la première règle ALL_SIGN_UP (le B2C_1_ étant ajouté automatiquement par le système)

Et voici l'expérience utilisateur, en test.

S'authentifier :

Modifier son profil :

Intégrer ce système dans votre application Web

Aujourd'hui, les templates Visual Studio ne sont pas forcément à jour. Le mieux reste encore de prendre un exemple existant, et de l'adapter.

Vous trouverez sur le Github de l'équipe Azure AD les exemples adéquates : https://github.com/AzureADQuickStarts.
Dans notre cas, j'utilise celui ci : https://github.com/AzureADQuickStarts/B2C-WebAPI-DotNet

Pour le faire fonctionner, il suffit "juste" de paramétrer correctement le fichier de configuration :

ClientId
Tenant
Policy de Sign Up
Policy de Sign In
Policy d'Edit

Une copie d'écran de mon fichier de configuration :

That's ALL !

Bon, vous remarquerez quand même qu'il y a un peu de code dans le sample...

A noter :

Fichier Startup.Auth.cs Où vous allez paramétrer votre middleware Owin pour utiliser l'authentification OpenId / Oauth2
Répertoire PolicyAuthHelpers : Celui là on va pas l'inventer, il permet de gérer les règles exposés par OpenId
Class AccountController : Les appels aux urls d'authentification / inscription / édition de profil
Vue Claims.cshtml : L'énumération des "Claims" exposés par votre fournisseur Azure AD B2C

Voici, une fois connecté, la page Claims, récapitulant les propriétés que j'ai paramétrées et que je veux récupérer aprés authentification :

Vous noterez que je récupère bien mon nombre de points fidélité :)

Bref, une bien belle nouveauté qui arrive et qui va VRAIMENT permettre de mutualiser la gestion de l'identité, sans être obligé de rajouter son propre système à coté pour gérer tout ce qui n'est pas authentification et qui est pourtant si important :)

Pour les ressources, dont est bien inspiré l'article de votre serviteur : https://azure.microsoft.com/en-us/services/active-directory-b2c/

Happy coding !

Seb

Les fondamentaux C# Chapitre 2

Sebastien Pertus — Thu, 23 Jul 2015 01:54:00 GMT

Bonjour à tous;

C'est bientôt les vacances alors profitez en pour vous former. Ca va vous rappeller vos cahiers de vacances ;)

Je viens de terminer la deuxième partie sur les fondamentaux C#. Au programme, 5 nouveaux modules composés de :

Une vidéo.
Un fichier zip de sources.
Un descriptif powerpoint.
Un QCM d'évaluation.

Pour ceux qui veulent récupérer l'ensemble (vidéo, source, pptx), et continuer votre parcours via Microsoft Virtual Academy, voici le lien direct vers le cours : Les Fondamentaux C# Chapitre 2

Pour ceux qui veulent d'abord faire (ou refaire) la première partie des fondamentaux; voici le lien direct sur la plateforme MVA : Les Fondamentaux C# Chapitre 1.

J'ai tenté pour chaque module de rester pragmatique dans l'approche et j'ai essayé de limiter chaque vidéo à moins de 15 minutes.

J'ai pratiquement réussi :)

Bon le module 2 sur les délégués et évènements était trop compliqué à résumer à moins de 15 minutes... Allez, celui là fait environ 30 minutes, mais il le mérite bien !

Pour ceux qui veulent juste regarder les vidéos, voici chaque module avec la description !

N'hésitez pas à me faire des retours sur ce nouveau chapitre.
Si vous avez aussi des idées de sujets qui vous plaisent pour un chapitre 3, n'hésitez pas à m'en faire part !

Module 1 : Modèle Singleton

Ce premier module aborde le modèle singleton autrement appelé "Pattern Singleton"

Il va nous permettre d'étendre le modèle static, peu personnalisable. Utilisé généralement dans des classes de services, il est une bonne pratique de dévelopemment quelque soit le langage !

Module 2 : Délégués et Evènements

Les délégués et les évènements font complètement partis du modèle de programmation orienté objet.

Souvent mal compris ou mal expliqués, les délégués peuvent parfois paraître obscures.

Dans ce module nous allons aborder ces deux concepts avec des exemples simples et pratiques pour démystifier le sujet.

Module 3 : Méthodes anonymes et expressions lambdas

Les méthodes anonymes ont été introduites dans le Framework 2.0 pour simplifier l'écriture de délégué.

Ce concept a encore été poussé dans le framework 3.0 avec l'apparition des expressions lambdas et son utilisation intensive dans System.Linq

Module 4 : Méthodes d'extensions

Sucre syntaxique, les méthodes d'extensions permettent d'étendre le comportement de vos objets comme de ceux que vous ne possédez pas.

Dans ce module nous allons voir comment étendre une classe comme System.String pour vous faire entrapercevoir le potentiel des méthodes d'extensions :)

Module 5 : Itérateurs et indexeurs

Les itérateurs et les indexeurs sont utilisés dans les objets représentants des collections, permettant d'utiliser des syntaxe comme le foreach ou permettant d'accéder directement à un objet de la collection via un index.

Nous allons voir dans ce module comment recréer ces comportement dans nos propres objets.

Bon visionnage :)

Seb

Windows 10. Quelques nouveautés intéressantes

Sebastien Pertus — Mon, 20 Apr 2015 08:20:00 GMT

Bonjour à tous;

Voici les sources du projet, qui tourne avec Visual Studio 2015 : https://github.com/Mimetis/Windows10Sample

Aujourd'hui présentation d'une petite application d'exemple Windows 10 permettant d'appréhender les nouveaux contrôles visuels et quelques astuces diverses :)

L'idée c'est de se rapprocher d'une application existante, Xbox music, et d'essayer de la recréer en mode Windows 10 compliant.

Voici ce vers quoi on veut tendre :

Et voici les thèmes que nous allons aborder :

SplitView
ApiInformation
Adaptive Triggers
RelativePanel
Binding Static

Avant de commencer par le SplitView, j'ai essayé de "coller" au thème et voici le rendu final de la page qui correspond au module Découvrir de l'application xbox musique :

SplitView

Le SplitView introduit un concept de navigation via un menu en overlay et appelable depuis un bouton "hamburger"

Le SplitView est intéressant, notamment sur la navigation car il contient lui même la frame navigable, dans sa propriété Content.

Vous trouverez le code nécessaire dans la vue Views/Shell.xaml

On y aborde :

L'utilisation des glyphs Segoe MDL2 Assets.
Les différents modes de visualisation (Overlay, CompactOverlay ...)
Un mécanisme sommaire de navigation, permettant de "binder" la propriété "Content" du SplitView à la frame en cours.

Voici le code du SplitView coté XAML :

Notez que l'initialisation de l'objet Shell est faite dans depuis la class App (App.xaml.cs)

Shell shell = Window.Current.Content as Shell;

if (shell == null)
{
    shell = new Shell();

    if (rootFrame == null)
    {
        rootFrame = new Frame();
        rootFrame.Language = Windows.Globalization.ApplicationLanguages.Languages[0];

        rootFrame.NavigationFailed += OnNavigationFailed;

        if (e.PreviousExecutionState == ApplicationExecutionState.Terminated)
        {
        }
    }

    shell.DataContext = rootFrame;

    Window.Current.Content = shell;
}

Lorsque vous passez en mode Overlay, le SplitView disparaissant complètement, il est judicieux de placer un bouton hamburger cliquable pour pouvoir le rappeler :

C'est ce qui est fait à l'aide d'un ToggleButton:

ApiInformation

Une grosse nouveauté concernant les capacités différentes entre application tablette et phone.

L'appel de l'ApiInformation va permettre de déterminer si une capacité est présente ou pas sur la plateforme où s'exécute le code.
Pratique quand on veut savoir si on utilise un WP et si le bouton Back est présent :

if (ApiInformation.IsTypePresent("Windows.Phone.UI.Input.HardwareButtons"))
{
    // Evènement présent
    HardwareButtons.BackPressed += (s, e) => { };
    // Label
    Text2.Text = "Windows Phone Platform";
    Text1.FontSize = 18;
    Text2.FontSize = 18;
}
else
{
    Text2.Text = "Windows Platform";
}

AdaptiveTrigger

Ici Nous allons utiliser les AdaptiveTriggers pour cacher / diminuer / remplacer des élments du layouts pour s'adapter au différents formats de périphériques.

Dans l'exemple, vous trouverez beaucoup d'AdaptiveTriggers :

MainPage.xaml : Disparition du bandeau haut et remplacement par un logo Xbox musique
MainPage.xaml : Disparition du logo Universal App et diminution de la font pour que le message reste lisible sur Phone
Shell.xaml : Disparition de la flèche retour et changement de mode de fonctionnement du SplitView (passage en mode Overlay)

Voici le VisualStateGroup tiré de la page MainPage.xaml

Note Importante : Dans mes tests, j'ai remarqué que les VisualState triggers ne fonctionnent que s'ils sont placés immédiatement aprés le premier conteneur de votre page (dans mon cas, la première Grid).
Si vous le placez aprés, ça a tendance à ne pas marcher au poil...

Pour aller plus loin :

Vous pouvez aussi créer vos propres AdaptiveTriggers en héritant de StateTriggerBase :

public class IsTypePresentStateTrigger : StateTriggerBase
{
}

Vous trouverez un exemple dans WindowsStateTriggers/IsTypePresentStateTrigger.cs

RelativePanel

Une de mes features préférées.

Le RelativePanel simplifie grandement l'agencement des éléments dans votre UI.

Voici le rendu final du bandeau publicitaire :

Voici un code possible, que j'aurai écrit précédemment, avec utilisation de StackPanel + Grid :

Et Voici un version à base de RelativePanel:

On voit vite l'intéret en terme de simplification de l'arbre visuel de votre code XAML :)

Binding Static

Une autre nouveauté apporté aux applications Windows 10 : La possibilité de créer des Binding statiques, permettant d'avoir une liaison forte entre votre source de données et votre ItemsControl :

Le code est assez classique mais remarquez l'utilisation de la syntaxe "ItemsSource="{x:Bind Albums, Mode=OneTime}" :

Un petit test à faire est de récupérer le code généré dans le fichier MainPage.g.cs où l'on peut voir, entre autre :

// Fields for each control that has bindings.
internal global::Windows.UI.Xaml.Controls.GridView obj6;

// Update method for each path node used in binding steps.
internal void Update_Albums(global::App1.Model.Albums obj, bool isInitialUpdate = false)
{
    if (isInitialUpdate)
    {
        this.SetValue_obj6_ItemsSource(obj);
    }
}

private void SetValue_obj6_ItemsSource(global::App1.Model.Albums obj)
{
    try
    {
        this.obj6.ItemsSource = obj;
    }
    catch {}
}

Pretty Awesome non ? :)

Voilà pour un premier petit tour sur les applications modernes Windows 10.
Bien-sûr tout ceci est sujet à évolution, et je mettrais à jour tout ça aprés la //Build

Virtual Academy : Les fondamentaux en C#

Sebastien Pertus — Fri, 05 Sep 2014 02:39:43 GMT

Bonjour à tous;

Aujourd’hui je publie mon deuxième cours sur Virtual Academy.

Fondamentaux en C# : Il s’agit d’un cours complet en 17 modules sur les fondamentaux C#

Ce cours s’adresse à un public néophyte désirant acquérir les bases de programmation en C#.

IL y’a 17 modules comprenant chacun:

Une vidéo allant de 10 à 20 minutes pour les plus longues.
Un fichier source contenant le zip du module en cours.

Pour vous donner une idée de ce qu’on va y retrouver voici la liste des modules :

Introduction au développement C# : Hello World
Débogage pas à pas avec Visual Studio
Les variables en C#
Les opérateurs en C# : [if else]
Les opérateurs en C# : [for]
Les tableaux : [Array]
Les méthodes
Les opérateurs en C# : [while]
Les chaines de caractères : [String]
Le concept objet en C# : Les classes partie 1
Le concept objet en C# : Les classes partie 2
L’héritage en C#
Les espaces de nommages : Les namespaces
Enumération et opérateur en C# : [foreach]
Les exceptions et comment traiter une erreur
Les collections en mémoire en C#
Un exemple complet : Accéder à une base de données

Voilà j’espère que ce cours saura vous mettre le pied à l’étrier et vous donner les bases du langage C#

D’ailleurs en y repensant, ces bases sont vraiment communes à beaucoup de langages et vous permettront de découvrir comment le développement et les bases peuvent être abordées.

Bon visionnage, et surtout, si vous avez des retours (et des cours qui vous intéresseraient) n’hésitez pas à m’en faire part par mail ou via les commentaires.

Seb

Create a WinRT brokered component : Feedback from a “real life” developement

Sebastien Pertus — Tue, 24 Jun 2014 09:48:26 GMT

Hi;

Since the Windows 8.1 launch, we can use a new feature, called Brokered Component, to manage legacy components and then writing code for Modern UI application that call desktop .NET objects (pretty cool !).

You can create a Brokered Component project within Visual Studio 2013. You need to install new templates projects, available here : https://visualstudiogallery.msdn.microsoft.com/527286e4-b06a-4234-adde-d313c9c3c23e

For more informations about Brokered Components, just check those articles / videos :

Creating a brokered component from scratch (3 parts) : https://devhawk.net/2014/04/25/brokered-winrt-components-step-one/
A data acces layer within a brokered component : https://blogs.u2u.be/diederik/post/2014/04/25/Building-Enterprise-apps-using-Brokered-Windows-Runtime-Components.aspx
//Build 2014 video presenting the feature : https://channel9.msdn.com/Events/Build/2014/2-515
MSDN documentation : https://msdn.microsoft.com/en-us/library/windows/apps/dn630195.aspx

In this article, I will provide a feedback on a full component; assuming you already know what is a brokered component (I suggest you to check at least the links below)

Here are my observations during the full migration of a legacy component to a brokered component:

Debugging

Yes, you need to debug. Especialy when you create a brokered component (believe me )

During runtime, no breakpoint will be called in your Brokered Component, since it is hosted by dllhost.exe. By the way, your component is not loaded until you have called your class constructor.

To be able to debug easily, I suggest you to provide a simple constructor in your brokered component. Thus you can add easily a breakpoint in your code.

In a nutshell :

Put a breakpoint after the initialization of your Brokered Component in your modern UI application code.
Put a breakpoint in your Brokered component (In the method you want to debug)
Launch your application and wait for you first breakpoint to be called :
Attach to the dllhost.exe (Yes, DURING your actual session) :
You can now debug your Brokered component

Runtime Policy Helper

Yes, often your legacy compoent will be an old component, mainly develop with the FX 2.*

To be able to reuse this component in a .NET 4.* application, you should add a Policy in your configuration file, like this :

1 xml version="1.0" encoding="utf-8" ?>
2 <configuration>
3   <startup useLegacyV2RuntimeActivationPolicy="true">
4     <supportedRuntime version="v4.0"/>
5   startup>
6 configuration>

Unfortunately, we can’t add a config file in our Brokered Component. The solution is to be able to configure this legacy runtime Policy with some code...
Here are two articles on the subject :

I have integrated this class directly as a private nested class in my Brokered component :

 public sealed class SqlServerReplicationProvider : IReplicationProvider
    {
        private class RuntimePolicyHelper
        {
            private static bool legacyV2RuntimeEnabledSuccessfully;

            public static bool TryEnableLegacyV2Runtime()
            {
                if (legacyV2RuntimeEnabledSuccessfully)
                    return true;

                ICLRRuntimeInfo clrRuntimeInfo = (ICLRRuntimeInfo)RuntimeEnvironment.GetRuntimeInterfaceAsObject(Guid.Empty,
                typeof(ICLRRuntimeInfo).GUID);

                try
                {
                    clrRuntimeInfo.BindAsLegacyV2Runtime();
                    legacyV2RuntimeEnabledSuccessfully = true;
                }
                catch (COMException)
                {
                    legacyV2RuntimeEnabledSuccessfully = false;
                }

                return legacyV2RuntimeEnabledSuccessfully;
            }


            [ComImport]
            [InterfaceType(ComInterfaceType.InterfaceIsIUnknown)]
            [Guid("BD39D1D2-BA2F-486A-89B0-B4B0CB466891")]
            private interface ICLRRuntimeInfo
            {
                void xGetVersionString();
                void xGetRuntimeDirectory();
                void xIsLoaded();
                void xIsLoadable();
                void xLoadErrorString();
                void xLoadLibrary();
                void xGetProcAddress();
                void xGetInterface();
                void xSetDefaultStartupFlags();
                void xGetDefaultStartupFlags();

                [MethodImpl(MethodImplOptions.InternalCall, MethodCodeType = MethodCodeType.Runtime)]
                void BindAsLegacyV2Runtime();
            }
        }

Then I called the TryEnableLegacyV2Runtime method in my class constructor, pretty straighforward :

1        public SqlServerReplicationProvider()
2         {
3             // Activer la compatibilité .NET 2.*
4             RuntimePolicyHelper.TryEnableLegacyV2Runtime();
5 
6         }

Abstract Class / Interface

Abstract classes are not available in any Windows Runtime component. Every public class should be sealed and abstract class can’t be sealed…

So you need to use interface, like this :

Enums

Enums works fine in any WinRT project, but they don’t work within a brokered component.

Here is an enum example :

1     public enum SyncSecurityMode
2     {
3         Standard = 0,
4         Integrated = 1
5     }

Even if I don’t use this enum in my code, It will raise an error during execution. And to be clear, the BadImageFormatException exception won’t help you

To replace your enum you could:

Use an int. Not very maintenable.
Put the enum in a C++/CX Winmd component. Well … creating a project just to handle an enum is a little bit to complex in my opinion.
Create a sealed object able to reproduce the enum behavior.

Here are some tips I used to create a sealed object to reproduce the enum usage:

I have creates the real enum in a private nested enum within my class.
I have creates some static methods to be able to create objects like this :

1 var ssm = SyncSecurityMode.Standard;

I have overrided the Equals methods (You can’t override == and != methods in a WinRT component).
You need to change the way you use the enum comparaison:

1 if (this.PublisherSecurityMode.Equals(SyncSecurityMode.Standard))

Finally, I have overrides the ToString() method to be able to easily debug my enum class

Here is the full implementation :

 1    public sealed class SyncSecurityMode
 2     {
 3         private enum SyncSecurityModeEnum
 4         {
 5             Standard = 0,
 6             Integrated = 1
 7         }
 8         private SyncSecurityMode(SyncSecurityModeEnum value)
 9         {
10             this.syncSecurityModeEnum = value;
11         }
12         private SyncSecurityMode()
13         {
14         }
15         private SyncSecurityModeEnum syncSecurityModeEnum;
16 
17         public static SyncSecurityMode Standard { get { return new SyncSecurityMode(SyncSecurityModeEnum.Standard); } }
18     
19         public static SyncSecurityMode Integrated { get { return new SyncSecurityMode(SyncSecurityModeEnum.Integrated); } }
20 
21         public override bool Equals(object obj)
22         {
23             if (obj == null) return false;
24 
25             SyncSecurityMode other = (SyncSecurityMode)obj;
26             return this.syncSecurityModeEnum.Equals(other.syncSecurityModeEnum);
27         }
28 
29    }

IDisposable

Every WinRT class should implement IDisposable, especially within a brokered component. During all my tests, each time a class without IDisposable interface ran into an exception (not managed by code) the dllhost.exe wasn’t unload…

I used the IDisposable pattern, where i disposed managed and non-managed ressources :

 1        /// 
 2         /// Dispose pattern
 3         /// 
 4         private bool disposed; // to detect redundant calls
 5 
 6         /// 
 7         /// Closes and dispose.
 8         /// 
 9         public void Close()
10         {
11             Dispose(true);
12             GC.SuppressFinalize(this);
13         }
14 
15         ~SqlServerReplicationProvider()
16         {
17             Dispose(false);
18         }
19         /// 
20         /// Performs application-defined tasks associated with freeing, releasing, or resetting unmanaged resources.
21         /// call Close() method
22         /// 
23         public void Dispose()
24         {
25             Close();
26         }
27 
28         protected void Dispose(bool disposing)
29         {
30             if (!disposed)
31             {
32                 if (disposing)
33                 {
34                     // Dispose managed resources.
35                     if (subscriberConn != null && subscriberConn.IsOpen)
36                         subscriberConn.Disconnect();
37 
38                     if (publisherConn != null && publisherConn.IsOpen)
39                         publisherConn.Disconnect();
40                 }
41 
42                 // There are no unmanaged resources to release, but
43                 // if we add them, they need to be released here.
44             }
45             disposed = true;
46         }
47

More informations available here : https://msdn.microsoft.com/en-us/library/system.idisposable(v=vs.110).aspx

Legacy Objects : handle events

Within FX .NET 2.*, we usually used events in our components. Not a bad idead, except when those events specifie the end of the business logic.

In this particular case, It will be difficult to create an async component (Task) with the IProgress pattern.

Here is a very simple example of one of those kind of component :

 1    public class TimeSource : IDisposable
 2     {
 3         private readonly Timer timer;
 4 
 5         public event EventHandler<DateTime> OnTick;
 6         public event EventHandler<DateTime> Started;
 7         public event EventHandler<DateTime> Ended;
 8 
 9         private int tickCount = 0;
10         private int maxTick = 5;
11         private Double tickDuration = 1000;
12 
13 
14         public DateTime Value { get; set; }
15         public TimeSource()
16         {
17             this.timer = new Timer(tickDuration);
18             this.timer.Elapsed += TimerOnElapsed;
19        }
20 
21         public void Start()
22         {
23             this.timer.Start();
24             Value = DateTime.Now;
25 
26             if (Started != null)
27                 Started(this, Value);
28  
29         }
30 
31         public void Stop()
32         {
33             this.timer.Stop();
34             this.tickCount = 0;
35 
36             Value = DateTime.Now;
37 
38             if (Ended != null)
39                 Ended(this, Value);
40 
41         }
42 
43         private void TimerOnElapsed(object sender, ElapsedEventArgs elapsedEventArgs)
44         {
45             try
46             {
47                 Value = DateTime.Now;
48                 
49                 if (tickCount >= maxTick)
50                 {
51                     if (Ended != null)
52                         Ended(this, Value);
53                     
54                     this.timer.Stop();
55                     
56                     tickCount = 0;
57                 }
58                 else
59                 {
60                     if (OnTick != null)
61                         OnTick(this, Value);
62 
63                     tickCount++;
64 
65                 }
66             }
67             catch (Exception ex)
68             {
69                 Console.WriteLine(ex.Message);
70             }
71         }
72 
73         public void Dispose()
74         {
75             this.timer.Stop();
76             this.timer.Elapsed -= TimerOnElapsed;
77             this.timer.Dispose();
78         }
79 
80     }

To be simple, TimeSource handle multiples events. Once the Ended event is called, the business logic is ended and the inner timer is stopped.

How to encapsulate those object to be able to create a Task and then use an await ?

Well, we will use TaskCompletionSource. This object will offer us the ability to control the lifetime of our new Task. If you want more information about TaskCompletionSource, here is a very good article by Stephen Toub : https://blogs.msdn.com/b/pfxteam/archive/2009/06/02/9685804.aspx

The most important methods of TaskCompletionSource :

SetResult : Set the Task result and return the task
SetException : Handle exception
SetCanceled : Handle the CancellationToken of the task if provided

Here is the TimeSourceAsync class that encapsulate the TimeSource class :

 1     public class TimeSourceAsync
 2     {
 3 
 4         private TimeSource innerTimeSource = new TimeSource();
 5 
 6         public async Task<DateTime> LaunchAsync(IProgress<DateTime> progress)
 7         {
 8            
 9             return await Task.Run<DateTime>(() =>
10             {
11                 var tcs = new TaskCompletionSource<DateTime>();
12 
13                 innerTimeSource.Started += (s, e) => progress.Report(e);
14                 innerTimeSource.OnTick += (s, e) => progress.Report(e);
15 
16                 innerTimeSource.Ended += (s, e) =>
17                     {
18                         tcs.SetResult(innerTimeSource.Value);
19                     };
20 
21                 innerTimeSource.Start();
22 
23                 return tcs.Task ;
24             });
25         }
26 
27     }

Task, AsyncInfo, IAsyncAction, IAsyncOperation, IProgress, CancellationToken …

Obviously, we should implement asynchronous methods within our component.

Creating a Task, like this :

 1         public async Task Sync()
 2         {
 3             return await Task.Run(() =>
 4             {
 5                 SyncStatistics statistics = new SyncStatistics();
 6                 MergeSynchronizationAgent syncAgent = null;
 7 
 8                 // bla bla bla 
 9 
10                 return;
11             });
12         }

Or like this (returning a type) :

 1         public async Task<SyncStatistics> Sync()
 2         {
 3             return await Task.Run<SyncStatistics>(() =>
 4             {
 5                 SyncStatistics statistics = new SyncStatistics();
 6                 MergeSynchronizationAgent syncAgent = null;
 7 
 8                 // bla bla bla 
 9 
10                 return statistics;
11             });
12         }

Or like this, returning a type, and handling CancellationToken and IProgress :

 1         public async Task<SyncStatistics> Sync(CancellationToken cancellationToken, 
 2                                          IProgress<SyncStatistics> progress)
 3         {
 4             return await Task.Run<SyncStatistics>(() =>
 5             {
 6                 SyncStatistics statistics = new SyncStatistics();
 7                 MergeSynchronizationAgent syncAgent = null;
 8 
 9                 // Check if cancellation has occured
10                 if (cancellationToken.IsCancellationRequested)
11                     cancellationToken.ThrowIfCancellationRequested();
12                 
13                 // Report progress
14                 progress.Report(statistics);
15 
16                 // bla bla bla 
17 
18                 return statistics;
19             });
20         }

But ….

To be able to expose such methods, we need to implements some interfaces :

IAsyncAction : Handle a simple async method.
IAsyncOperation : Handle a simple async method returning a type
IAsyncActionWithProgress : Handle a simple async method with progression steps
IAsyncOperationWithProgress : Handle a simple async method returning a type with progression steps

For more informations about IAsyncAction and IAsyncOperation, you should take a look at those articles, by Stephen Toub :

To be clear, you have two solutions to return IAsyncAction or IAsyncOperation :

Use the extensions methods of Task : AsAsyncOperation() ou AsAsyncAction()
Use the AsyncInfo object and its Run() method.

Extension methods AsAsyncOperation() ou AsAsyncAction()

Pretty Straightforward. Just call the extension method on your Task and it’s over ! Unfortunately you can’t handle IProgress or CancellationToken :

 1         public IAsyncOperation<SyncStatistics> SynchronizeAsync()
 2         {
 3             return InternalSync(CancellationToken.None, null).AsAsyncOperation();
 4 
 5         }
 6         private Task<SyncStatistics> InternalSync(CancellationToken cancellationToken, IProgress<int> progress)
 7         {
 8             return Task.Run<SyncStatistics>(() =>
 9             {
10                 SyncStatistics statistics = new SyncStatistics();
11                 MergeSynchronizationAgent syncAgent = null;
12 
13                 // Check if cancellation has occured
14                 if (cancellationToken.IsCancellationRequested)
15                     cancellationToken.ThrowIfCancellationRequested();
16 
17                 // Report progress
18                 if (progress != null)
19                     progress.Report(0);
20 
21                 // bla bla bla 
22 
23                 return statistics;
24             });
25         }

AsyncInfo.Run()

You have more flexibility within AsyncInfo and its method Run. As you can see, we have 4 static methods with CancellationToken and IProgress behaviors:

 1         public static class AsyncInfo
 2         {
 3             public static IAsyncOperationWithProgress<TResult, TProgress> Run<TResult, TProgress>(
 4                 Func<CancellationToken, IProgress<TProgress>, Task<TResult>> taskProvider);
 5             public static IAsyncActionWithProgress<TProgress> Run<TProgress>(
 6                 Func<CancellationToken, IProgress<TProgress>, Task> taskProvider);
 7             public static IAsyncOperation<TResult> Run<TResult>(
 8                 Func<CancellationToken, Task<TResult>> taskProvider);
 9             public static IAsyncAction Run(
10                 Func<CancellationToken, Task> taskProvider);
11         }
12     }

Here is an example within IAsyncOperationWithProgress :

1         public IAsyncOperationWithProgress<SyncStatistics, int> SynchronizeAsync()
2         {
3             return AsyncInfo.Run<SyncStatistics, int>((cancellationToken, progress) =>
4                      InternalSync(cancellationToken, progress));
5         }

Even if it’s not a Task returning from you component, you can still use the await pattern to call your method, like this :

1         private async void btnSynchronize_Click(object sender, RoutedEventArgs e)
2         {
3            // Constructeur de mon composant WinRT Brokered
4             syncProvider = GetSyncProvider();
5 
6             // Launch Sync
7             var syncCheck = await syncProvider.SynchronizeAsync();
8         }
9

The main proble is that you don’t have any method available to pass any CancellationToken or IProgress parameters, even if we have correctly implement IAsyncOperationWithProgress

To be able to pass those parameters, we should use the AsTask() extension method. Again, take a look on this article if you want more informations on the subject : https://blogs.msdn.com/b/windowsappdev/archive/2012/04/24/diving-deep-with-winrt-and-await.aspx

Here is the final code, using the AsTask() method:

 1         private async void btnSynchronize_Click(object sender, RoutedEventArgs e)
 2         {
 3             // Déclaration de ma progression
 4             Progress<int> progress = new Progress<int>((p) => lstEvents.Items.Add(String.Format("{0} % ", p)));
 5            
 6             // Jeton d'annulation
 7             CancellationTokenSource cancelTokenSource = new CancellationTokenSource();
 8             try
 9             {
10                 // Constructeur de mon composant WinRT Brokered
11                 syncProvider = GetSyncProvider();
12       
13                 // Launch Sync
14                 var syncCheck = await syncProvider.SynchronizeAsync().AsTask(cancelTokenSource.Token, progress);
15 
16             }
17             catch (Exception)
18             {
19                 cancelTokenSource.Cancel();
20                 throw;
21             }
22 
23         }

If you want more performance tips on brokered component, take a look on MSDN : https://msdn.microsoft.com/en-us/library/windows/apps/dn630195.aspx

Especially the paragraph about using struct and returning array of objects instead of List.

Bon développement ! (Hum that’s french … ok, happy coding so ! )

/Seb

Post Mortem développement d’un Brokered Component dans la vraie vie !

Sebastien Pertus — Tue, 24 Jun 2014 05:53:41 GMT

Bonjour;

Depuis l’arrivée de Windows 8.1, nous avons la possibilité de créer des composants Brokered Component pour permettre une passerelle entre le monde ModernUI WinRT et le monde Desktop .NET

Il existe depuis peu les templates de projets associés au développement de Brokered Component, disponible ici :

https://visualstudiogallery.msdn.microsoft.com/527286e4-b06a-4234-adde-d313c9c3c23e

Pour plus d’informations, je vous suggère quelques articles, vidéos sur le sujet :

Un tutorial en 3 parties : https://devhawk.net/2014/04/25/brokered-winrt-components-step-one/
Une couche d’accès aux données : https://blogs.u2u.be/diederik/post/2014/04/25/Building-Enterprise-apps-using-Brokered-Windows-Runtime-Components.aspx
La vidéo de présentation de la //Build 2014 : https://channel9.msdn.com/Events/Build/2014/2-515
La documentation MSDN : https://msdn.microsoft.com/en-us/library/windows/apps/dn630195.aspx

Dans cet article, je vais m’attacher à faire un retour d’expérience de la création d’un composant complet “de la vraie vie”. Bref, un composant qui fait un peu plus que Hello World ou récupérer 10 lignes d’une base de données

Je vais partir du principe que vous connaissez déjà la composants Brokered WinRT et qu’au moins votre hello world fonctionne correctement.

A partir de là, quand on veut aller “plus loin” , on peut rencontrer quelques problèmes, et voici quelques remarques sur ce que j’ai pu observer.

Debugging

Premier point, et non des moindres, le debugging de votre composant WinRT Brokered.

Au runtime, aucun point d’arrêt dans votre composant n’est appelé lors votre exécution. En effet ce composant est hosté par un autre processus, appelé dllhost.exe. Il va falloir s’attacher à celui-ci.
Autre chose, le composant n’est chargé que lors de la première instanciation d’un objet de votre Brokered Component.

De mon coté, j’ai donc un constructeur simple, public, qui charge mon composant, et qui me permet de poser un point d’arrêt correctement.

Dans les faits :

Mettre un point d’arrêt après l’instanciation de votre composant WinRT dans votre application ModernUI.
Mettre un point d’arrêt dans votre composant WinRT sur la méthode à débuguer.
Lancer l’application en debug et s’arrêter au point d’arrêt situé après l’instanciation de votre composant.
S’attacher au processus dllhost.exe de votre composant (oui oui, PENDANT l’exécution) :
Débuguer votre composant WinRT, maintenant accessible

Runtime Policy Helper

Et oui, le propre d’un composant Brokered component, c’est pouvoir réutiliser du code .NET existant. Souvent, ce code est déjà compilé, et parfois (souvent) dans une version du Framework 2.*

Pour activer la compatibilité descendante, la méthode la plus simple, c’est de rajouter dans votre fichier de configuration, le nœud de configuration suivant :

1 xml version="1.0" encoding="utf-8" ?>
2 <configuration>
3   <startup useLegacyV2RuntimeActivationPolicy="true">
4     <supportedRuntime version="v4.0"/>
5   startup>
6 configuration>

Sauf que dans notre cas, impossible de rajouter un fichier de configuration à notre composant. Il va falloir réaliser cette configuration par le code.
Je me suis inspiré de deux articles sur le sujet :

A l’intégration, j’ai rajouté cette classe directement dans mon composant Brokered, en privé, en mode Nested :

 public sealed class SqlServerReplicationProvider : IReplicationProvider
    {
        private class RuntimePolicyHelper
        {
            private static bool legacyV2RuntimeEnabledSuccessfully;

            public static bool TryEnableLegacyV2Runtime()
            {
                if (legacyV2RuntimeEnabledSuccessfully)
                    return true;

                ICLRRuntimeInfo clrRuntimeInfo = (ICLRRuntimeInfo)RuntimeEnvironment.GetRuntimeInterfaceAsObject(Guid.Empty,
                typeof(ICLRRuntimeInfo).GUID);

                try
                {
                    clrRuntimeInfo.BindAsLegacyV2Runtime();
                    legacyV2RuntimeEnabledSuccessfully = true;
                }
                catch (COMException)
                {
                    legacyV2RuntimeEnabledSuccessfully = false;
                }

                return legacyV2RuntimeEnabledSuccessfully;
            }


            [ComImport]
            [InterfaceType(ComInterfaceType.InterfaceIsIUnknown)]
            [Guid("BD39D1D2-BA2F-486A-89B0-B4B0CB466891")]
            private interface ICLRRuntimeInfo
            {
                void xGetVersionString();
                void xGetRuntimeDirectory();
                void xIsLoaded();
                void xIsLoadable();
                void xLoadErrorString();
                void xLoadLibrary();
                void xGetProcAddress();
                void xGetInterface();
                void xSetDefaultStartupFlags();
                void xGetDefaultStartupFlags();

                [MethodImpl(MethodImplOptions.InternalCall, MethodCodeType = MethodCodeType.Runtime)]
                void BindAsLegacyV2Runtime();
            }
        }

Et j’appelle la méthode TryEnableLegacyV2Runtime dans le constructeur de mon composant, ce qui me va bien, si on reprend le point 1 au sujet du débugging

1        public SqlServerReplicationProvider()
2         {
3             // Activer la compatibilité .NET 2.*
4             RuntimePolicyHelper.TryEnableLegacyV2Runtime();
5 
6         }

Classe abstraite / Interface

Bon, les classes abstraites, ça marche pas. Vos classes doivent être sealed pour être exposées en WinRT. Malheureusement les classes abstraites ne peuvent être sealed :

J’ai donc tout migré pour passer par une interface :

Enumération

Alors là, grosse déception au niveau des énumérations.

Les énumérations fonctionnent correctement avec des projets WinRT, mais ne fonctionnent pas dans le cas d’un Brokered Component..
Le simple fait de rajouter (sans même l’utiliser !) une énumération comme celle-ci, va générer une erreur :

1     public enum SyncSecurityMode
2     {
3         Standard = 0,
4         Integrated = 1
5     }

Le pire c’est que l’erreur n’est remontée qu’au runtime, et que celle ci n’est pas du tout explicite. Vous rencontrez une simple BadImageFormatException :

Bref, si vous avez un soucis incompréhensible dans votre composant avec ce type d’erreur, cherchez du coté de vos énumérations

Pour remplacer votre énumération, vous pouvez :

Passer par un simple entier (int) mais la lisibilité de votre code va pas mal en souffrir.
Ecrire un composant non pas en C# mais directement en C++ WinMD. ça me semble complexe pour pas grand chose..
Créer une solution de contournement utilisant un véritable objet (sealed donc) C’est cette solution que j’ai utilisée

J’ai pas mal cherché, j’ai fait pas mal de tests, je n’ai rien trouvé de très concluant pour palier ce problème. Du coup, je vous propose une solution, sujette à débat (si vous avez une idée, n’hésitez pas à commenter).

Pour faire simple :

J’intègre en mode privé l’énumération en nested class, manière de l’utiliser en interne
J’utilise des méthodes statiques me permettant d’utiliser la syntaxe :

1 var ssm = SyncSecurityMode.Standard;

Je surcharge la méthode Equals, ce qui me permet de traiter la comparaison. Malheureusement surcharger les opérateurs == et != auraient été plus judicieux, mais la création de composants WinRT l’interdit.
Mes comparaisons deviennent donc :

1 if (this.PublisherSecurityMode.Equals(SyncSecurityMode.Standard))

Enfin, je surcharge la méthode ToString() pour pouvoir facilement afficher la valeur de l’énumération (encore une fois, pratique en mode Debug)

Voici l’extrait de la classe SyncSecurityMode que j’ai donc migré pour qu’elle fonctionne correctement :

 1    public sealed class SyncSecurityMode
 2     {
 3         private enum SyncSecurityModeEnum
 4         {
 5             Standard = 0,
 6             Integrated = 1
 7         }
 8         private SyncSecurityMode(SyncSecurityModeEnum value)
 9         {
10             this.syncSecurityModeEnum = value;
11         }
12         private SyncSecurityMode()
13         {
14         }
15         private SyncSecurityModeEnum syncSecurityModeEnum;
16 
17         public static SyncSecurityMode Standard { get { return new SyncSecurityMode(SyncSecurityModeEnum.Standard); } }
18     
19         public static SyncSecurityMode Integrated { get { return new SyncSecurityMode(SyncSecurityModeEnum.Integrated); } }
20 
21         public override bool Equals(object obj)
22         {
23             if (obj == null) return false;
24 
25             SyncSecurityMode other = (SyncSecurityMode)obj;
26             return this.syncSecurityModeEnum.Equals(other.syncSecurityModeEnum);
27         }
28 
29    }

IDisposable

Toutes vos classes WinRT se doivent d’être IDisposable. Sur l’ensemble de mes tests, ne pas implémenter IDisposable avait tendance à laisser le composant chargé en mémoire (surtout lors de la levé d’exceptions non managées par mon composant) dans dllhost.exe

J’utilise le pattern IDIsposable classique, où je différencie le moment de disposer mes ressources managées et non managées :

 1        /// 
 2         /// Dispose pattern
 3         /// 
 4         private bool disposed; // to detect redundant calls
 5 
 6         /// 
 7         /// Closes and dispose.
 8         /// 
 9         public void Close()
10         {
11             Dispose(true);
12             GC.SuppressFinalize(this);
13         }
14 
15         ~SqlServerReplicationProvider()
16         {
17             Dispose(false);
18         }
19         /// 
20         /// Performs application-defined tasks associated with freeing, releasing, or resetting unmanaged resources.
21         /// call Close() method
22         /// 
23         public void Dispose()
24         {
25             Close();
26         }
27 
28         protected void Dispose(bool disposing)
29         {
30             if (!disposed)
31             {
32                 if (disposing)
33                 {
34                     // Dispose managed resources.
35                     if (subscriberConn != null && subscriberConn.IsOpen)
36                         subscriberConn.Disconnect();
37 
38                     if (publisherConn != null && publisherConn.IsOpen)
39                         publisherConn.Disconnect();
40                 }
41 
42                 // There are no unmanaged resources to release, but
43                 // if we add them, they need to be released here.
44             }
45             disposed = true;
46         }
47

Plus d’informations sur le pattern IDisposable ici : https://msdn.microsoft.com/en-us/library/system.idisposable(v=vs.110).aspx

Legacy Objects : Gérer les évènements

Et oui, avant on avait plutôt l’habitude de léver des évènements dans nos objets. Ce qui pouvait poser quelques problèmes quand on est en asynchrone (revenir sur le thread UI etc … vous voyez suremment de quoi je parle )

Aujourd’hui, quand on parle pattern asynchrone, on pense IProgress qui permet de lever une progression et ne pas avoir à gérer le problème de threading.

Pour présenter le problème que j’ai rencontré voici un exemple, simple, de la situation que j’ai dû résoudre :

 1    public class TimeSource : IDisposable
 2     {
 3         private readonly Timer timer;
 4 
 5         public event EventHandler<DateTime> OnTick;
 6         public event EventHandler<DateTime> Started;
 7         public event EventHandler<DateTime> Ended;
 8 
 9         private int tickCount = 0;
10         private int maxTick = 5;
11         private Double tickDuration = 1000;
12 
13 
14         public DateTime Value { get; set; }
15         public TimeSource()
16         {
17             this.timer = new Timer(tickDuration);
18             this.timer.Elapsed += TimerOnElapsed;
19        }
20 
21         public void Start()
22         {
23             this.timer.Start();
24             Value = DateTime.Now;
25 
26             if (Started != null)
27                 Started(this, Value);
28  
29         }
30 
31         public void Stop()
32         {
33             this.timer.Stop();
34             this.tickCount = 0;
35 
36             Value = DateTime.Now;
37 
38             if (Ended != null)
39                 Ended(this, Value);
40 
41         }
42 
43         private void TimerOnElapsed(object sender, ElapsedEventArgs elapsedEventArgs)
44         {
45             try
46             {
47                 Value = DateTime.Now;
48                 
49                 if (tickCount >= maxTick)
50                 {
51                     if (Ended != null)
52                         Ended(this, Value);
53                     
54                     this.timer.Stop();
55                     
56                     tickCount = 0;
57                 }
58                 else
59                 {
60                     if (OnTick != null)
61                         OnTick(this, Value);
62 
63                     tickCount++;
64 
65                 }
66             }
67             catch (Exception ex)
68             {
69                 Console.WriteLine(ex.Message);
70             }
71         }
72 
73         public void Dispose()
74         {
75             this.timer.Stop();
76             this.timer.Elapsed -= TimerOnElapsed;
77             this.timer.Dispose();
78         }
79 
80     }

Pour faire simple, l’objet TimeSource lève des évènements au fur et à mesure du déroulement de son métier. Lorsque le dernier évènement et levé, la tache est terminée.

Comment faire pour encapsuler cet objet (si on ne peut pas le modifier) pour en créer une Task, et pouvoir faire un await dessus ?

En utilisant l’objet TaskCompletionSource qui va nous permettre d’attendre l’évènement de fin pour compléter la tache.

Les méthodes importantes de TaskCompletionSource à implémenter :

SetResult : Permet d’affecter le résultat et finir la tache
SetException : Permet de gérer les exceptions et renvoyer l’exception au niveau de la tache
SetCanceled : Permet de gérer l’appel Cancel d’un jeton CancellationToken

Voici l’implémentation de ce pattern dans la classe TimeSourceAsync :

 1     public class TimeSourceAsync
 2     {
 3 
 4         private TimeSource innerTimeSource = new TimeSource();
 5 
 6         public async Task<DateTime> LaunchAsync(IProgress<DateTime> progress)
 7         {
 8            
 9             return await Task.Run<DateTime>(() =>
10             {
11                 var tcs = new TaskCompletionSource<DateTime>();
12 
13                 innerTimeSource.Started += (s, e) => progress.Report(e);
14                 innerTimeSource.OnTick += (s, e) => progress.Report(e);
15 
16                 innerTimeSource.Ended += (s, e) =>
17                     {
18                         tcs.SetResult(innerTimeSource.Value);
19                     };
20 
21                 innerTimeSource.Start();
22 
23                 return tcs.Task ;
24             });
25         }
26 
27     }

Evidemment pour aller plus loin que cet exemple trivial, n’hésitez pas aussi à implémenter le code permettant d’utiliser un jeton d’annulation (CancellationToken) qui appellera la méthode SetCancel() du TaskCompletationSource
Dans mon cas simpliste, je n’ai pas utiliser un Try Catch, mais n’oubliez pas de l’implémenter et gérer l’exception avec la méthode SetException(Exception)

Task, AsyncInfo, IAsyncAction, IAsyncOperation, IProgress, CancellationToken …

Lors de la création de votre composant, vous voulez bien-sûr privilégier le mode asynchrone pour les taches lourdes.

Evidemment le premier réflexe est donc de créer une Task, comme ceci par exemple :

 1         public async Task Sync()
 2         {
 3             return await Task.Run(() =>
 4             {
 5                 SyncStatistics statistics = new SyncStatistics();
 6                 MergeSynchronizationAgent syncAgent = null;
 7 
 8                 // bla bla bla 
 9 
10                 return;
11             });
12         }

Voir une tache qui renvoie un type, comme ceci :

 1         public async Task<SyncStatistics> Sync()
 2         {
 3             return await Task.Run<SyncStatistics>(() =>
 4             {
 5                 SyncStatistics statistics = new SyncStatistics();
 6                 MergeSynchronizationAgent syncAgent = null;
 7 
 8                 // bla bla bla 
 9 
10                 return statistics;
11             });
12         }

Et pour aller encore plus loin, créer une Task, qui renvoie un type T, et qui gère un CancellationToken et un IProgress, comme ceci :

 1         public async Task<SyncStatistics> Sync(CancellationToken cancellationToken, 
 2                                          IProgress<SyncStatistics> progress)
 3         {
 4             return await Task.Run<SyncStatistics>(() =>
 5             {
 6                 SyncStatistics statistics = new SyncStatistics();
 7                 MergeSynchronizationAgent syncAgent = null;
 8 
 9                 // Check if cancellation has occured
10                 if (cancellationToken.IsCancellationRequested)
11                     cancellationToken.ThrowIfCancellationRequested();
12                 
13                 // Report progress
14                 progress.Report(statistics);
15 
16                 // bla bla bla 
17 
18                 return statistics;
19             });
20         }

Sauf que ça, ça ne fonctionne pas pour un composant WinRT. L’erreur est explicite

Pour exposer une méthode en asynchrone, on doit renvoyer un interface, au minium, de type IAsyncAction ou IAsyncOperation.

Pour faire simple:

IAsyncAction : Permet de gérer un appel asynchrone
IAsyncOperation : Permet de gérer un appel asynchrone et renvoie un résultat
IAsyncActionWithProgress : Permet de gérer un appel asynchrone avec progression
IAsyncOperationWithProgress : Permet de gérer un appel asynchrone avec progression et qui renvoie un résultat

Pour plus d’informations sur le sujet, je vous suggère ces deux articles du Dieu en la matière Stephen Toub :

Pour résumé, vous avez deux possibilités pour retourner IAsyncAction ou IAsyncOperation :

Utiliser les méthodes d’extensions de Task : AsAsyncOperation() ou AsAsyncAction()
Utiliser l’objet AsyncInfo et la méthode statique Run()

Méthodes d’extension AsAsyncOperation() ou AsAsyncAction()

C’est de loin la méthode la plus simple. Elle est rapide à mettre en place, mais malheureusement ne prend pas en compte la progression (IProgress) ou l’annulation (CancellationToken)

Dans mon cas, j’ai tout d’abord créer une méthode privée qui renvoie une Task, puis j’ai créé la méthode publique encapsulant l’appel en utilisant dans mon cas AsAsyncOperation() :

 1         public IAsyncOperation<SyncStatistics> SynchronizeAsync()
 2         {
 3             return InternalSync(CancellationToken.None, null).AsAsyncOperation();
 4 
 5         }
 6         private Task<SyncStatistics> InternalSync(CancellationToken cancellationToken, IProgress<int> progress)
 7         {
 8             return Task.Run<SyncStatistics>(() =>
 9             {
10                 SyncStatistics statistics = new SyncStatistics();
11                 MergeSynchronizationAgent syncAgent = null;
12 
13                 // Check if cancellation has occured
14                 if (cancellationToken.IsCancellationRequested)
15                     cancellationToken.ThrowIfCancellationRequested();
16 
17                 // Report progress
18                 if (progress != null)
19                     progress.Report(0);
20 
21                 // bla bla bla 
22 
23                 return statistics;
24             });
25         }

Comme on le remarque, on se passe de la progression et du jeton d’annulation

AsyncInfo.Run()

Ici plus de souplesse d’utilisation, mais un peu plus de complexité à la mise en œuvre (et encore que …)

L’objet AsyncInfo possède 4 méthodes statiques, permettant de renvoyer chacune des interfaces qui nous intéresse :

 1         public static class AsyncInfo
 2         {
 3             public static IAsyncOperationWithProgress<TResult, TProgress> Run<TResult, TProgress>(
 4                 Func<CancellationToken, IProgress<TProgress>, Task<TResult>> taskProvider);
 5             public static IAsyncActionWithProgress<TProgress> Run<TProgress>(
 6                 Func<CancellationToken, IProgress<TProgress>, Task> taskProvider);
 7             public static IAsyncOperation<TResult> Run<TResult>(
 8                 Func<CancellationToken, Task<TResult>> taskProvider);
 9             public static IAsyncAction Run(
10                 Func<CancellationToken, Task> taskProvider);
11         }
12     }

Dans notre cas, l’implémentation est assez simple, j’utilise la méthode IAsyncOperationWithProgress :

1         public IAsyncOperationWithProgress<SyncStatistics, int> SynchronizeAsync()
2         {
3             return AsyncInfo.Run<SyncStatistics, int>((cancellationToken, progress) =>
4                      InternalSync(cancellationToken, progress));
5         }

A partir de là, nous avons un appel d’une méthode asynchrone gérant facilement le jeton d’annulation et la progression.

Implémentation et appel du code asynchrone du Brokered Component

L’appel coté code se fait de façon plutôt simple, tel que vous avez l’habitude de faire :

1         private async void btnSynchronize_Click(object sender, RoutedEventArgs e)
2         {
3            // Constructeur de mon composant WinRT Brokered
4             syncProvider = GetSyncProvider();
5 
6             // Launch Sync
7             var syncCheck = await syncProvider.SynchronizeAsync();
8         }
9

Le problème c’est que votre méthode ne prend PAS de paramètre CancellationToken ou IProgress, alors que nous avons bien implémenter (grace à l’objet AsyncInfo) le code nécessaire pour faire fonctionner ce pattern.

Nous allons utiliser la méthode d’extension AsTask() qui va du coup nous renvoyer une Task tel qu’on a l’habitude de faire, et ainsi gérer le jeton d’annulation et la progression.

J’en ai déjà parlé en préambule mais si vous voulez apprendre comment fonctionne AsTask(), n’hésitez pas à regarder cet article de Monsieur Toub (Oui Monsieur, avec un M majuscule, lui il y a droit. Y’a des gens comme ça ….) : https://blogs.msdn.com/b/windowsappdev/archive/2012/04/24/diving-deep-with-winrt-and-await.aspx

Voici l’implémentation complète de mon appel :

 1         private async void btnSynchronize_Click(object sender, RoutedEventArgs e)
 2         {
 3             // Déclaration de ma progression
 4             Progress<int> progress = new Progress<int>((p) => lstEvents.Items.Add(String.Format("{0} % ", p)));
 5            
 6             // Jeton d'annulation
 7             CancellationTokenSource cancelTokenSource = new CancellationTokenSource();
 8             try
 9             {
10                 // Constructeur de mon composant WinRT Brokered
11                 syncProvider = GetSyncProvider();
12       
13                 // Launch Sync
14                 var syncCheck = await syncProvider.SynchronizeAsync().AsTask(cancelTokenSource.Token, progress);
15 
16             }
17             catch (Exception)
18             {
19                 cancelTokenSource.Cancel();
20                 throw;
21             }
22 
23         }

Voilà un premier retour d’expérience de la création d’un composant Brokered Component, dans la vraie vie.

Si vous voulez d’autre pointeurs sur la performance d’un Brokered Component, n’hésitez pas à consulter l’article MSDN sur le sujet : https://msdn.microsoft.com/en-us/library/windows/apps/dn630195.aspx

On y parle notamment de l’utilisation de struct et du renvoie d’array plutôt que de List lorsque vous devez renvoyer “plus de 10 lignes” d’une base de données SQL Server par exemple.

Bon développement !

/Seb

Mim's Blog

Disponibilité du SDK.NET Microsoft.Graph

Application de démonstration

GraphServiceClient et Authentification

Récupération d'informations

Ajout, modification, suppression

VorlonJS plugin for debugging Office Addin

VorlonJS

Why create a VorlonJS Plugin for Office addin ?

Installing VorlonJS.

Get the dev branch of VorlonJS

Enabling HTTPS

Enabling Office addin plugin

Using the Office-Addin plugin

Launch the Dashboard

Adding VorlonJS script in your Office-Addin project

Use VorlonJS to debug

Conclusion

Babylonjs generator

The Babylon generator

Installation

Playground option

More on BabylonJS

Useful links

Documentation

Getting To Know Yeoman

Office 365 add in and BabylonJS

Intro

Office Add In

Geting datas from Excel worksheet

Localization

BabylonJS

Try it out

Get the sample

Azure AD B2C

Les fondamentaux C# Chapitre 2

Windows 10. Quelques nouveautés intéressantes

SplitView

ApiInformation

AdaptiveTrigger

RelativePanel

Binding Static

Virtual Academy : Les fondamentaux en C#

Create a WinRT brokered component : Feedback from a “real life” developement

Debugging

Runtime Policy Helper

Abstract Class / Interface

Enums

IDisposable

Legacy Objects : handle events

Task, AsyncInfo, IAsyncAction, IAsyncOperation, IProgress, CancellationToken …

Extension methods AsAsyncOperation() ou AsAsyncAction()

AsyncInfo.Run()

Post Mortem développement d’un Brokered Component dans la vraie vie !

Debugging

Runtime Policy Helper

Classe abstraite / Interface

Enumération

IDisposable

Legacy Objects : Gérer les évènements

Task, AsyncInfo, IAsyncAction, IAsyncOperation, IProgress, CancellationToken …

Méthodes d’extension AsAsyncOperation() ou AsAsyncAction()

AsyncInfo.Run()

Implémentation et appel du code asynchrone du Brokered Component