Profitez de l'authentification unique et de SkyDrive dans vos applications Windows 8, grâce au SDK Live

Blog des développeurs d'applications Windows 8

Indications sur la conception d'applications de style Metro pour Windows 8, par l'équipe d'ingénierie de Windows 8

Profitez de l'authentification unique et de SkyDrive dans vos applications Windows 8, grâce au SDK Live

  • Comments 0

Grâce au cloud, les utilisateurs de Windows 8 peuvent travailler et s'amuser en passant d'un appareil à l'autre sans la moindre difficulté. En ouvrant une session sur votre PC ou votre appareil avec un compte Microsoft et en profitant de l'espace de stockage personnel gratuit de SkyDrive (pour plus d'informations, voir Connexion de vos applications, fichiers, PC et périphériques au cloud avec SkyDrive et Windows 8), vos applications, paramètres et fichiers personnels vous suivent partout. En tant que développeur d'applications, vous pouvez exploiter ces fonctionnalités cloud en intégrant le Kit de développement logiciel (SDK) Live avec vos applications de style Metro.

Le SDK Live offre un ensemble complet de contrôles et d'API permettant aux applications d'intégrer une fonctionnalité d'authentification unique par le biais des comptes Microsoft. Ces applications peuvent ainsi accéder aux données des applications SkyDrive, Hotmail et Messenger de la version Consumer Preview. Un Kit de développement logiciel pour Windows Phone offrant des fonctionnalités similaires est également disponible.

Prise en main du SDK Live

Si ce n'est déjà fait, commencez par installer Windows 8 Consumer Preview ,Visual Studio 11 Beta et la version Developer Preview du SDK Live sur votre PC. Accédez ensuite au site de gestion des applications Live Connect afin de configurer votre application de style Metro pour qu'elle puisse accéder à nos services cloud.

Une fois que votre application est configurée, vous devez ajouter une référence au SDK Live. Ce SDK est disponible pour les développements en langage C#, JavaScript et Visual Basic. Actuellement, il ne prend pas en charge le langage C++, mais vous pouvez télécharger un exemple de code complet, SkypadCpp, qui montre comment accéder à SkyDrive à partir d'une application en C++.

Pour ajouter le SDK Live à votre projet, cliquez avec le bouton droit de la souris sur le projet et sélectionnez Add Reference (Ajouter une référence) > Extension SDKs (SDK d'extension), puis choisissez dans la liste l'entrée correspondant au SDK Live.

Dans une application JavaScript, il vous suffit d'ajouter la référence de script suivante au fichier default.html :

<script type="text/javascript" src="ms-appx:///LiveSDKHTML//js/wl.js"></script>

En C#, ajoutez la référence suivante :

using Microsoft.Live;

Enfin, en Visual Basic, l'instruction d'importation suivante suffit :

Imports Microsoft.Live

L'authentification unique et le paradoxe de la connexion simplifiée

Grâce à l'intégration avec le SDK Live, les applications profitent notamment de l'authentification unique avec les comptes Microsoft. Les utilisateurs détestent devoir créer des comptes pour chaque application et se reconnecter régulièrement aux applications et aux sites Web, ce qui constitue en soi un défi pour les développeurs. Néanmoins, en se connectant à une application ou à site Web, l'utilisateur profite d'une meilleure expérience utilisateur, car l'application peut alors l'identifier et s'adapter à ses propres besoins et habitudes. Nous désignons cette contradiction fondamentale, selon laquelle les utilisateurs n'aiment pas effectuer une tâche qui améliore pourtant l'expérience utilisateur, par l'expression « paradoxe de la connexion simplifiée ».

Dans Windows 8, les applications de style Metro et les sites Web évitent ce paradoxe en permettant aux utilisateurs d'ouvrir une session sur le PC à l'aide de leur compte Microsoft. Les applications et les sites Microsoft tels que Contacts, Courrier, Messagerie et Hotmail utilisent les comptes Microsoft. Ainsi, les utilisateurs ne sont pas obligés de s'y connecter dès lors qu'ils ont ouvert leur session sur le PC. L'internaute profite par conséquent d'une expérience de connexion sans clic.

Grâce au SDK Live, vos applications et vos sites Web peuvent eux aussi utiliser les comptes Microsoft pour proposer une expérience de connexion sans clic. Cependant, n'oubliez pas que l'utilisateur doit au départ autoriser votre application à accéder à son identité.

Si vous disposez déjà d'un système de gestion des comptes, vous pouvez connecter ce système d'identités aux comptes Microsoft, afin de proposer une expérience de connexion transparente à vos utilisateurs. Ce principe de fonctionnement est encore plus intéressant si vous exploitez à la fois une application de style Metro et un site Web : une fois que l'utilisateur s'est connecté à l'application ou au site, il n'a plus besoin de se connecter, dès lors qu'il a ouvert sa session sur le PC à l'aide d'un compte Microsoft.

Le SDK Live a pour but de vous permettre d'écrire un code similaire, que vous souhaitiez développer une application Web ou une application Windows 8. Par conséquent, le code JavaScript permettant de connecter l'utilisateur et d'accéder aux informations de son profil dans vos applications de style Metro écrites en JavaScript est similaire à celui utilisé sur les sites Web qui utilisent le SDK Live. Avec très peu de changements, l'extrait de code ci-dessous peut fonctionner parfaitement sur un site Web ou dans une application de style Metro. La différence entre les deux codes réside dans l'appel WL.init, qui nécessite de spécifier un ID client sur le site Web, alors que dans Windows 8 cette valeur est obtenue automatiquement à partir de l'identifiant de l'application active, fourni par le système d'exploitation.

WL.init();
WL.getLoginStatus().then(function (response) {
onSessionChange(response);
});

function onSessionChange(response) {
var session = WL.getSession();
if (!session) {
WL.Event.subscribe("auth.login", onLoginComplete);
WL.ui({
name: "signin",
element: "signinbutton",
scope: ["wl.signin", "wl.skydrive"],
});
}
else {
greetUser();
}
}

function onLoginComplete() {
var session = WL.getSession();
if (!session.error) {
greetUser();
}
};

function greetUser() {
WL.api({
path: "/me",
method: "get"
}
).then(
function (result) {
document.getElementById("meName").innerText = "Welcome, " + result.name;
getUserPicture ();
});;
};

function getUserPicture() {
var session = WL.getSession();
var LiveConnectAPIUrl = "https://apis.live.net/v5.0";
document.getElementById("meImg").src = LiveConnectAPIUrl +
"/me/picture?return_ssl_resources=true&access_token=" + session.access_token;
document.getElementById("meImg").style.visibility = "visible";
};
;

Cet exemple de code vérifie si l'utilisateur est actuellement connecté à un compte Microsoft et, le cas échéant, affiche un message d'accueil. Sur Windows 8, ce code vérifie si l'utilisateur a ouvert une session sur le PC, alors que sur un site Web, il vérifie s'il est connecté à l'un des sites utilisant les comptes Microsoft (Hotmail, SkyDrive, etc.). Si l'utilisateur n'est pas connecté, le code provoque la création d'un bouton de connexion invitant l'utilisateur à autoriser l'application à le connecter (WL.signin) et à accorder à cette dernière des droits de lecture sur son espace SkyDrive (WL.skydrive). Lorsque l'utilisateur clique sur ce bouton, s'il n'a pas ouvert de session sur son PC à l'aide d'un compte Microsoft, il est invité à se connecter. Il doit ensuite autoriser l'application à accéder à ses informations personnelles. Une fois les informations confirmées, les méthodes greetUser() et getUserPicture() permettent à l'application d'accéder au nom et à l'image perso de l'utilisateur.

Comme vous pouvez le constater, grâce à l'intégration avec le SDK Live, les applications qui ne disposent pas d'un système spécifique de gestion des comptes d'utilisateur s'intègrent plus facilement aux comptes Microsoft. Par ailleurs, les applications disposant de leur propre système de gestion des identités peuvent amorcer très simplement le processus d'inscription en utilisant les informations du compte Microsoft de l'utilisateur.

Mise en place du cloud personnel dans vos applications grâce à SkyDrive et Hotmail

Grâce aux applications de style Metro SkyDrive et Contacts présentes dans Windows 8, les utilisateurs peuvent gérer facilement leurs fichiers SkyDrive et leurs contacts Hotmail. Ces deux applications acceptent de s'intégrer à d'autres applications de style Metro de façon très flexible, en jouant le rôle de fournisseurs de données.

L'application de style Metro SkyDrive joue le rôle de fournisseur de données pour le sélecteur de fichiers. Ainsi, toutes les applications utilisant le sélecteur de fichiers peuvent également utiliser SkyDrive comme emplacement pour l'enregistrement ou l'ouverture de fichiers, dès lors que l'application de style Metro SkyDrive est installée. L'application Contacts remplit un rôle similaire pour le sélecteur de contacts. Elle peut servir de source de données pour les applications nécessitant la sélection d'un ou plusieurs contacts parmi ceux de l'utilisateur.

L'extraction de données par le biais des sélecteurs est la solution recommandée pour accéder une bonne fois pour toutes aux données de l'utilisateur dans le cloud, lorsque vous n'avez pas besoin d'intégrer de façon approfondie les données du cloud dans votre application. Dans d'autres cas, par exemple lorsque votre application offre une expérience personnalisée pour tous les fichiers d'un type spécifique stockés dans l'espace SkyDrive de l'utilisateur, vous devez procéder à une intégration à l'aide du SDK Live.

Comme nous l'avons déjà expliqué, le code JavaScript du SDK Live fonctionne de façon identique avec un site Web ou une application de style Metro écrite en JavaScript. Il en va de même pour les applications écrites en XAML, qui couvrent à la fois Windows Phone et Windows 8. Au prix de modifications mineures, l'extrait de code ci-dessous peut fonctionner sur les deux plateformes, à deux exceptions près. Tout d'abord, comme pour l'exemple en JavaScript, vous devez indiquer l'ID client dans la version Windows Phone du code, alors qu'il est déterminé automatiquement dans Windows 8. Ensuite, pour créer des méthodes asynchrones sur Windows Phone, vous devez utiliser le CTP Async Visual Studio.

Bouton de connexion en XAML

<Controls:SignInButton x:Name="btnSignIn" Content="SignInButton" HorizontalAlignment="Right"
Height="46" Margin="-1,0,6,0" Width="157" Scopes="wl.signin wl.skydrive"
SessionChanged="btnSignIn_SessionChanged" Visibility="Collapsed" />

Code C# d'arrière-plan

private void btnSignIn_SessionChanged(object sender, 
Microsoft.Live.Controls.LiveConnectSessionChangedEventArgs e)
{
if (e.Status == LiveConnectSessionStatus.Connected)
{
App.Session = e.Session;
LoadPhotos();
}else
{
btnSignIn.Visibility = Windows.UI.Xaml.Visibility.Visible;
}

}

internal async void LoadPhotos ()
{
LiveConnectClient client = new LiveConnectClient(App.Session);
LiveOperationResult albumOperationResult = await client.Get("me/albums");
dynamic albumResult = albumOperationResult.Result;
foreach (dynamic album in albumResult.data)
{
var group = new SkyDriveAlbum(album.id, album.name, album.name, @"ms-
appx:///Assets/DarkGray.png"
, album.description);
LiveOperationResult pictureOperationResult = await client.Get(album.id + "/files");
dynamic pictureResult = pictureOperationResult.Result;
foreach (dynamic picture in pictureResult.data)
{
var pictureItem = new SkyDriveFileItem(picture.id, picture.name,
picture.name, picture.source, picture.description, picture.description, group);
group.Items.Add(pictureItem);
}
this.ItemGroups.Add(group);
}

}

Cet extrait de code crée le bouton de connexion. Si l'utilisateur autorise l'application à accéder à ses données, le code récupère les métadonnées relatives aux albums photo de l'utilisateur stockés sur SkyDrive. Vous pouvez écrire un code similaire pour accéder aux contacts et aux calendriers Hotmail de l'utilisateur.

Extraits de code

Le code source intégral présenté dans ce billet peut être téléchargé sur le référentiel d'exemples relatifs au SDK Live sur GitHub. Ce référentiel d'exemples de code contient également des exemples d'interaction avec le SDK Live à partir d'autres plateformes.

Étapes suivantes

Je vous ai montré comment vos applications peuvent exploiter le SDK Live pour s'intégrer au cloud de façon transparente, avec les mêmes technologies que les applications de style Metro de Microsoft. L'intégration du SDK Live à vos applications présente un potentiel immense. Ainsi, en plus d'améliorer l'expérience d'inscription et de connexion à votre application, vous pouvez :

  • développer des applications exploitant l'espace de stockage gratuit SkyDrive pour stocker le contenu créé dans votre application par l'utilisateur et y accéder ;
  • inviter l'utilisateur à utiliser votre application en ajoutant à son calendrier des événements renvoyant à votre application ou à votre site Web ;
  • savoir qui utilise aussi votre application parmi les contacts Hotmail de l'utilisateur ;
  • créer des expériences de partage en temps réel, via le réseau Windows Live Messenger.

Pour en savoir plus sur le SDK Live, vous pouvez lire notre documentation, télécharger le SDK Live et poser des questions sur nos forums.

--Dare Obasanjo
   Chef de projet senior, Plateforme Live Connect

  • Loading...
Leave a Comment
  • Please add 4 and 4 and type the answer here:
  • Post