• Facile

Ce cours est visible gratuitement en ligne.

Vous pouvez être accompagné et mentoré par un professeur particulier par visioconférence sur ce cours.

J'ai tout compris !

Mis à jour le 29/04/2014

Utiliser Facebook dans une application mobile

Connectez-vous ou inscrivez-vous gratuitement pour bénéficier de toutes les fonctionnalités de ce cours !

Avec l’avènement des réseaux sociaux, une application Windows Phone va devoir être capable de travailler avec eux ! On ne cite plus bien sûr Twitter ou Facebook. Chacun des grands réseaux sociaux offre une solution pour interagir avec eux. Facebook ne déroge pas à cette règle et propose diverses solutions pour que nos applications tirent parti de la puissance du social.

Nous allons à présent voir comment réaliser une petite application fonctionnant avec Facebook.

Créer une application Facebook

La première chose à faire est de créer une application Facebook. C’est une étape gratuite mais indispensable afin de pouvoir établir une relation de confiance entre votre application Windows Phone et Facebook. Pour ce faire, rendez-vous sur http://www.facebook.com/developers/createapp.php.
Si vous n’êtes pas connecté, c’est le moment de le faire.

Créez ensuite une application, comme à la figure suivante.

Création d'une application Facebook
Création d'une application Facebook

Donnez-lui au moins un nom (voir figure suivante).

Donner un nom à l'application Facebook
Donner un nom à l'application Facebook

Finissez la création (voir figure suivante).

Finalisation de la création de l'application Facebook
Finalisation de la création de l'application Facebook

Vous obtenez un identifiant d’application, ainsi qu’une clé d’API. Il s’agit du point d’entrée permettant d’exploiter les données issues de Facebook. L’identifiant d’application et la clé vont vous permettre d’utiliser les méthodes de l'API et d’identifier de manière unique votre application afin de pouvoir établir la relation entre le téléphone et un compte Facebook.

Simplifier les connexions à Facebook avec l'API

L’API Facebook est utilisable en REST. Il est possible de faire tous nos appels à Facebook depuis notre application avec REST, mais il existe un projet open source qui encapsule les appels REST afin de nous simplifier la tâche. Personne ici ne rêve de se compliquer la vie, alors nous allons utiliser ce fameux projet. Il s’agit du « Facebook C# SDK », anciennement situé sur la plateforme open source CodePlex, et qui se trouve désormais sur http://facebooksdk.net/.

Mais vous n'avez même pas besoin d’y aller pour le récupérer, car les concepteurs nous ont encore simplifié la tâche en le rendant disponible via un package Nuget (voir figure qui suit).

Le SDK Facebook via NuGet
Le SDK Facebook via NuGet

Et voilà, le SDK est référencé !

Sécuriser l'accès à Facebook avec OAuth

OAuth ? Kézako, pourquoi tu parles de ça ?

Eh bien parce qu’il s’agit du système d’authentification à l’API de Facebook. OAuth est un protocole qui permet l’accès à des données de manière sécurisée et en fonction des restrictions d'accès appliquées par l'utilisateur. Lorsqu'elle aura besoin d'accéder à certaines informations sur l'utilisateur, notre application va donc utiliser OAuth pour demander à Facebook d'authentifier cet utilisateur. Une fois que l'utilisateur est authentifié, Facebook nous fournit un jeton permettant d'accéder à son API.

Description du principe de fonctionnement d'OAuth
Description du principe de fonctionnement d'OAuth

Regardons dans la pratique comment cela fonctionne…

Se connecter à Facebook

Pour authentifier un utilisateur, nous allons devoir naviguer sur la page d’authentification de Facebook. Mais comment accéder à cette fameuse page ?
Pour le savoir, nous allons utiliser le package SDK, mais avant ça, nous aurons besoin de rajouter un WebBrowser dans notre page XAML :

<phone:WebBrowser x:Name="wb" Visibility="Collapsed" Navigated="wb_Navigated" />

Celui-ci est masqué au chargement de la page (Visibility à Collapsed). Nous avons également associé une méthode à l’événement de navigation terminé, qui nous permettra de traiter l'authentification et de récupérer le jeton.
Puis nous allons créer une variable privée dans notre page, du type FacebookClient pour représenter l'utilisateur que l'on souhaite authentifier :

private FacebookClient client;

Vous aurez besoin de l'espace de noms Facebook pour accéder aux fonctionnalités de Facebook :

using Facebook;

Enfin, nous allons naviguer sur l’URL obtenue grâce au package SDK. Pour ce faire, nous allons devoir spécifier un certain nombre de paramètres en créant un dictionnaire d'objets :

public MainPage()
{
    InitializeComponent();

    Dictionary<string, object> parameters = new Dictionary<string, object>();
    parameters["response_type"] = "token";
    parameters["display"] = "touch";
    parameters["scope"] = "user_about_me, friends_about_me, user_birthday, friends_birthday, publish_stream";
    parameters["redirect_uri"] = "https://www.facebook.com/connect/login_success.html";
    parameters["client_id"] = "votre id d'application";

    client = new FacebookClient();
    Uri uri = client.GetLoginUrl(parameters);

    wb.Visibility = Visibility.Visible;
    wb.Navigate(uri);
}

Dans ces paramètres, on trouve :

  • Le paramètre response_type : on lui attribue la valeur token car nous avons besoin d’un jeton d’accès.

  • Le paramètre display : on lui attribue la valeur touch. Il s’agit de l’interface que Facebook va proposer pour notre authentification. La valeur touch est celle la plus adaptée aux périphériques mobiles (les autres modes sont disponibles sur https://developers.facebook.com/docs/reference/dialogs/).

  • Enfin, et c’est le plus important, le paramètre scope : il correspond aux informations que nous souhaitons obtenir de la part de l’utilisateur. Il s’agit des permissions que l’on peut retrouver à cet emplacement : https://developers.facebook.com/docs/r [...] /#permissions.
    Par exemple, j’ai choisi les permissions suivantes :

    • user_about_me, qui permet d’obtenir les informations de base d’un utilisateur.

    • friends_about_me, qui permet d’obtenir les informations de base des amis de l’utilisateur.

    • user_birthday, qui permet d’obtenir la date de naissance d’un utilisateur.

    • friends_birthday, qui permet d’obtenir la date de naissance des amis de l’utilisateur.

    • publish_stream, qui va me permettre de poster un message sur le mur de l’utilisateur.

Puis nous fournissons l'URL de redirection Facebook ainsi que l'identifiant de notre application, dans le paramètre client_id. Ainsi, après l’approbation de nos permissions par l’utilisateur, la relation de confiance entre le compte Facebook et notre application Facebook va pouvoir se créer.
Enfin, nous instancions un objet FacebookClient. La méthode GetLoginUrl() va nous retourner l’URL de la page de connexion adéquate sur Facebook afin que notre utilisateur puisse s’y connecter avec son compte. Cette méthode ne fait rien d’extraordinaire à part concaténer tous les paramètres. Nous nous retrouvons avec une URL de la sorte :

https://www.facebook.com/dialog/oauth?response_type=token&display=touch&scope=user_about_me%2C%20friends_about_me%2C%20user_birthday%2C%20friends_birthday%2C%20publish_stream&redirect_uri=https%3A%2F%2Fwww.facebook.com%2Fconnect%2Flogin_success.html&client_id=monappid

et il ne reste plus qu’à naviguer sur cette URL avec le WebBrowser...
Nous arrivons sur une page ressemblant à celle présentée dans la figure suivante.

Connexion à Facebook
Connexion à Facebook

C'est bien une page du site de Facebook. C’est donc Facebook qui nous authentifie grâce à sa fenêtre de login.
Entrons nos informations de connexion et validons. Une fois que l'on est connecté, Facebook nous demande si nous acceptons la demande de permission de l’application Facebook (voir prochaine figure).

Installation de l'application
Installation de l'application

Une fois la demande de permission acceptée, nous sommes redirigés sur une page blanche marquée success.

Parfait tout ça… mais, le jeton ? Comment on le récupère ?

Eh bien cela se fait dans l’événement de navigation auquel nous nous sommes abonnés au début. Dans cet événement, nous allons utiliser la méthode TryParseOAuthCallbackURL de la classe FacebookOAuthResult pour extraire le jeton :

private string token;

private void wb_Navigated(object sender, NavigationEventArgs e)
{
    FacebookOAuthResult result;
    if (client.TryParseOAuthCallbackUrl(e.Uri, out result))
    {
        if (result.IsSuccess)
        {
            token = result.AccessToken;
        }
        wb.Visibility = Visibility.Collapsed;
    }
}

En fait, cette méthode TryParseOAuthCallbackURL ne fait rien de compliqué. Elle récupère juste l'URL dans laquelle le jeton est disponible. Voici l'allure de cet URL :

https://www.facebook.com/connect/login_success.html#access_token=AAABhqO0ZBZBP0BAJO3qZBEdRXXXXXXXXXXXXXXXXXXXxxXQZDZD&expires_in=5184000

Toujours est-il qu’une fois que l'URL de ce jeton est récupérée, nous allons pouvoir faire tout ce que nous voulons. Chouette. Commençons par masquer le WebBrowser, nous n’en aurons plus besoin.

À ce moment-là, je trouve qu’il est plus propre de changer de page en stockant le jeton dans le dictionnaire d’état et en le récupérant à la page suivante.

private void wb_Navigated(object sender, NavigationEventArgs e)
{
    FacebookOAuthResult result;
    if (client.TryParseOAuthCallbackUrl(e.Uri, out result))
    {
        if (result.IsSuccess)
        {
            PhoneApplicationService.Current.State["Jeton"] = result.AccessToken;
        }
        wb.Visibility = Visibility.Collapsed;
        NavigationService.Navigate(new Uri("/Page1.xaml", UriKind.Relative));
    }
}

Remarquez que le jeton a une durée de vie limitée. Il est possible de le renouveler régulièrement avec une requête qui nous retourne un nouveau jeton, voire le même si la requête a déjà été faite dans la journée. Il s’agit de la requête suivante, que l’on peut faire lorsque l’on arrive sur la Page1.xaml :

public partial class Page1 : PhoneApplicationPage
{
    private FacebookClient facebookClient;
    private string token;

    public Page1()
    {
        InitializeComponent();
    }

    protected override void OnNavigatedTo(NavigationEventArgs e)
    {
        token = (string)PhoneApplicationService.Current.State["Jeton"];
        facebookClient = new FacebookClient(token);
        facebookClient.GetCompleted += facebookClient_GetCompleted;

        Dictionary<string, object> parameters = new Dictionary<string, object>();
        parameters["client_id"] = "votre clé API";
        parameters["client_secret"] = "votre clé secrête";
        parameters["grant_type"] = "fb_exchange_token";
        parameters["fb_exchange_token"] = facebookClient.AccessToken;

        facebookClient.GetAsync("https://graph.facebook.com/oauth/access_token", parameters, "MisAJourToken");

        base.OnNavigatedTo(e);
    }
}

On pourra extraire le nouveau token lorsque l’événement GetCompleted est levé :

private void facebookClient_GetCompleted(object sender, FacebookApiEventArgs e)
{
    if (e.Error == null)
    {
        if ((string)e.UserState == "MisAJourToken")
        {
            JsonObject data = (JsonObject)e.GetResultData();
            token = (string)data["access_token"];
            facebookClient.AccessToken = token;
            PhoneApplicationService.Current.State["token"] = token;
        }
    }
}

C’est une bonne idée de lancer une requête de ce genre à chaque connexion de l’utilisateur afin de prolonger la durée de vie du jeton, ou pourquoi pas dans une tâche périodique que nous avons vu dans la partie précédente...

Oui mais moi, j'aime bien les méthodes asynchrones async et await ...

Qu'à cela ne tienne, il suffit de se faire une petite méthode d'extension :

public static class Extensions
{
    public static Task<JsonObject> GetAsyncEx(this FacebookClient facebookClient, string uri, object parameters)
    {
        TaskCompletionSource<JsonObject> taskCompletionSource = new TaskCompletionSource<JsonObject>();
        EventHandler<FacebookApiEventArgs> getCompletedHandler = null;
        getCompletedHandler = (s, e) =>
        {
            facebookClient.GetCompleted -= getCompletedHandler;
            if (e.Error != null)
                taskCompletionSource.TrySetException(e.Error);
            else
                taskCompletionSource.TrySetResult((JsonObject)e.GetResultData());
        };

        facebookClient.GetCompleted += getCompletedHandler;
        facebookClient.GetAsync(uri, parameters);

        return taskCompletionSource.Task;
    }
}

On pourra remplacer le code précédent par :

protected async override void OnNavigatedTo(NavigationEventArgs e)
{
    token = (string)PhoneApplicationService.Current.State["Jeton"];
    facebookClient = new FacebookClient(token);

    Dictionary<string, object> parameters = new Dictionary<string, object>();
    parameters["client_id"] = "votre id d'application";
    parameters["client_secret"] = "votre clé d'application";
    parameters["grant_type"] = "fb_exchange_token";
    parameters["fb_exchange_token"] = facebookClient.AccessToken;

    try
    {
        JsonObject data = await facebookClient.GetAsyncEx("https://graph.facebook.com/oauth/access_token", parameters);
        token = (string)data["access_token"];
        facebookClient.AccessToken = token;
        PhoneApplicationService.Current.State["token"] = token;
    }
    catch (Exception)
    {
        MessageBox.Show("Impossible de renouveler le token");
    }

    base.OnNavigatedTo(e);
}

Pratique , non ?

Exploiter le graphe social avec le SDK

Le graphe social représente le réseau de connexions et de relations entre les utilisateurs sur Facebook. Les connexions peuvent être entre les utilisateurs (amis, famille,…) ou entre des objets via des actions (un utilisateur aime une page, un utilisateur écoute de la musique,…). Le graphe social se base sur le protocole Open Graph pour modéliser ces relations et ces actions, l’action la plus connue étant le fameux « J’aime ».

L’API du graphe permet d’exploiter ces informations. Cette API est utilisable en REST mais encore une fois, le package SDK propose une façon de simplifier son utilisation.
La documentation de référence de cette API est disponible à cet emplacement. Voyons à présent comment s’en servir…

Récupérer des informations

Si vous n’avez pas rafraîchi le token, il va vous falloir instancier un objet FacebookClient avec le jeton passé dans le dictionnaire d’état. Sinon, vous avez déjà tout ce qu’il faut et vous êtes prêt à interroger l’API du graph social avec une nouvelle requête. Commençons par quelque chose de simple : récupérer des informations sur l’utilisateur en cours.

Premièrement, le XAML. Nous allons afficher l’image de l’utilisateur, son nom et prénom, ainsi que sa date de naissance :

<Grid x:Name="LayoutRoot" Background="Transparent">
    <Grid.RowDefinitions>
        <RowDefinition Height="*" />
        <RowDefinition Height="*" />
    </Grid.RowDefinitions>
    <Grid>
        <Grid.ColumnDefinitions>
            <ColumnDefinition Width="100" />
            <ColumnDefinition Width="*" />
        </Grid.ColumnDefinitions>
        <Grid.RowDefinitions>
            <RowDefinition Height="auto" />
            <RowDefinition Height="auto" />
        </Grid.RowDefinitions>
        <Image x:Name="ImageUtilisateur" Grid.RowSpan="2" />
        <TextBlock x:Name="NomUtilisateur" Grid.Column="1" />
        <TextBlock x:Name="DateNaissanceUtilisateur" Grid.Row="1" Grid.Column="1"/>
    </Grid>
</Grid>

Pour obtenir ces infos, nous allons interroger le graphe social. On utilise pour cela la méthode Get de l’objet FacebookClient, que nous avons déjà utilisée (ou plutôt la méthode d'extension que nous avons créée). Le principe est de faire un appel REST à la ressource https://graph.facebook.com/me et de récupérer le résultat. Ce résultat s'obtient avec la méthode GetResultData qui retourne un JsonObject. Nous pourrons alors accéder aux informations contenues dans cet objet, comme l'identifiant, le nom, le prénom ou la date de naissance.

try
{
    JsonObject data = await facebookClient.GetAsyncEx("https://graph.facebook.com/me", null);
    string id = (string)data["id"];
    string prenom = (string)data["first_name"];
    string nom = (string)data["last_name"];
    Dispatcher.BeginInvoke(() =>
    {
        ImageUtilisateur.Source = new BitmapImage(new Uri("https://graph.facebook.com/" + id + "/picture"));
        NomUtilisateur.Text = prenom + " " + nom;
        DateNaissanceUtilisateur.Text = ObtientDateDeNaissance(data);
    });
}
catch (Exception)
{
    MessageBox.Show("Impossible d'obtenir les informations sur moi");
}

Voici le détail de la méthode ObtientDateDeNaissance utilisée pour récupérer la date de naissance de l'utilisateur :

private string ObtientDateDeNaissance(JsonObject data)
{
    if (data.ContainsKey("birthday"))
    {
        DateTime d;
        CultureInfo enUS = new CultureInfo("en-US");
        if (DateTime.TryParseExact((string)data["birthday"], "MM/dd/yyyy", enUS, System.Globalization.DateTimeStyles.None, out d))
            return d.ToShortDateString();
    }
    return string.Empty;
}

Remarquez que vous n’aurez une valeur dans le « champ de date de naissance » que si vous avez demandé la permission user_birthday, d’où la vérification de l’existence de la clé avant son utilisation.
Remarquez que l’image d’une personne s’obtient grâce à son identifiant : https://graph.facebook.com/id_utilisateur/picture.

Récupération de mes informations
Récupération de mes informations

Obtenir la liste de ses amis

Nous allons en profiter pour faire la même chose avec les amis de l’utilisateur, nous allons afficher leurs noms et leurs dates de naissance.
C’est aussi simple que précédemment, il suffit d’invoquer la ressource située à https://graph.facebook.com/me/friends. Cette requête nous permet d’obtenir l’identifiant et le nom des amis de l'utilisateur, sous la forme d’un tableau JSON. Sauf que ce n’est pas suffisant, nous souhaitons obtenir leurs anniversaires. Il faut appeler la ressource suivante : https://graph.facebook.com/id_utilisateur pour obtenir des informations complémentaires. Ce que nous allons faire de ce pas…
J’en profite pour rajouter une liste d'utilisateurs sous forme d'une collection ObservableCollection dans ma classe :

public ObservableCollection<Utilisateur> UtilisateurList { get; set; }

Cette collection est composée d'objets représentant chaque utilisateur. Chaque objet Utilisateur est défini de la manière suivante :

public class Utilisateur
{
    public string Id { get; set; }
    public string Nom { get; set; }
    public BitmapImage Image { get; set; }
    public string DateNaissance { get; set; }
}

Je vais compléter les informations de chaque objet Utilisateur grâce aux informations reçues par l'API. Je démarre donc la requête permettant d'avoir la liste de mes amis. Une fois la liste reçue, j'extrais la liste des identifiants de chaque ami et je réinterroge l'API pour avoir le détail de chaque utilisateur. Une fois le détail reçu, je l'ajoute à mon ObservableCollection.

try
{
    JsonObject data = await facebookClient.GetAsyncEx("https://graph.facebook.com/me/friends", null);
    JsonArray friends = (JsonArray)data["data"];
    foreach (JsonObject f in friends)
    {
        string id = (string)f["id"];
        data = await facebookClient.GetAsyncEx("https://graph.facebook.com/" + id, null);
        string name = (string)data["name"];
        Dispatcher.BeginInvoke(() => UtilisateurList.Add(new Utilisateur { Id = id, Nom = name, Image = new BitmapImage(new Uri("https://graph.facebook.com/" + id + "/picture")), DateNaissance = ObtientDateDeNaissance(data) }));
    }
}
catch (Exception)
{
    MessageBox.Show("Impossible d'obtenir les informations sur les amis");
}

Ouf !
Vous n’aurez bien sûr pas oublié de faire les initialisations adéquates :

public Page1()
{
    InitializeComponent();

    UtilisateurList = new ObservableCollection<Utilisateur>();
    DataContext = this;
}

N'oubliez pas non plus de déclarer l'affichage de notre liste dans une ListBox dans la page XAML :

<ListBox ItemsSource="{Binding UtilisateurList}" Grid.Row="1" >
    <ListBox.ItemTemplate>
        <DataTemplate>
            <Grid>
                <Grid.ColumnDefinitions>
                    <ColumnDefinition Width="100" />
                    <ColumnDefinition Width="*" />
                </Grid.ColumnDefinitions>
                <Grid.RowDefinitions>
                    <RowDefinition Height="auto" />
                    <RowDefinition Height="auto" />
                </Grid.RowDefinitions>
                <Image Source="{Binding Image}" Grid.RowSpan="2" />
                <TextBlock Text="{Binding Nom}" Grid.Column="1" />
                <TextBlock Text="{Binding DateNaissance}" Grid.Row="1" Grid.Column="1"/>
            </Grid>
        </DataTemplate>
    </ListBox.ItemTemplate>
</ListBox>

Et voilà, nous pouvons afficher la liste de nos amis. Par respect pour les miens, je ne présenterai pas de copie d’écran avec leurs têtes et leurs anniversaires, mais vous pouvez essayer avec les vôtres, cela fonctionne très bien ! ;)

Publier un post sur son mur Facebook

Les connexions du graphe social et autres données de Facebook peuvent être exploitées commercialement. On peut aussi utiliser ces données pour publier des posts sur son mur Facebook. Imaginons par exemple que je développe un jeu pour Windows Phone, je fais un score terrible et je souhaite défier mes amis pour qu’ils tentent de me battre. Rien de tel que de poster un petit message sur mon mur Facebook pour les inciter à venir jouer et à me battre…

C’est ce que nous allons faire ici. Pour l’exemple, je vais reprendre notre jeu du plus ou du moins que nous avions fait en TP (voir Partie 1, Chapitre 8). L’intérêt ici, outre de nous amuser, sera de pouvoir poster son score automatiquement sur son mur.

Je reprends donc le XAML du TP que je mets dans ma Page1.xaml, puis je rajoute le petit bouton permettant de poster mon score sur Facebook.
Voici le XAML :

<Grid x:Name="LayoutRoot" Background="Transparent">
    <Grid.RowDefinitions>
        <RowDefinition Height="Auto"/>
        <RowDefinition Height="*"/>
        <RowDefinition Height="Auto"/>
    </Grid.RowDefinitions>

    <StackPanel x:Name="TitlePanel" Grid.Row="0" Margin="12,17,0,28">
        <TextBlock x:Name="ApplicationTitle" Text="TP du jeu du plus ou du moins" Style="{StaticResource PhoneTextTitle2Style}"/>
    </StackPanel>

    <Grid x:Name="ContentPanel" Grid.Row="1" Margin="12,0,12,0">
        <StackPanel>
            <TextBlock Text="Veuillez saisir une valeur (entre 0 et 500)" Style="{StaticResource PhoneTextNormalStyle}" HorizontalAlignment="Center" />
            <TextBox x:Name="Valeur" InputScope="Number" />
            <Button Content="Vérifier" Tap="Button_Tap_1" />
            <TextBlock x:Name="Indications" Height="50" TextWrapping="Wrap" />
            <TextBlock x:Name="NombreDeCoups" Height="50" TextWrapping="Wrap" Style="{StaticResource PhoneTextNormalStyle}" />
            <Button x:Name="BoutonFb" Content="Publier mon score sur Facebook" Tap="Button_Tap" IsEnabled="False" />
        </StackPanel>
    </Grid>
    <Button Content="Rejouer" Tap="Button_Tap_2"  Grid.Row="2"/>
</Grid>

Passons désormais au code-behind :

public partial class Page1 : PhoneApplicationPage
{
    private FacebookClient facebookClient;
    private string token;
    private Random random;
    private int valeurSecrete;
    private int nbCoups;

    public Page1()
    {
        InitializeComponent();

        random = new Random();
        valeurSecrete = random.Next(1, 500);
        nbCoups = 0;
        Color couleur = (Color)Application.Current.Resources["PhoneAccentColor"];
        Indications.Foreground = new SolidColorBrush(couleur);
    }

    protected async override void OnNavigatedTo(NavigationEventArgs e)
    {
        token = (string)PhoneApplicationService.Current.State["Jeton"];
        facebookClient = new FacebookClient(token);

        Dictionary<string, object> parameters = new Dictionary<string, object>();
        parameters["client_id"] = "id application";
        parameters["client_secret"] = "id API";
        parameters["grant_type"] = "fb_exchange_token";
        parameters["fb_exchange_token"] = facebookClient.AccessToken;

        try
        {
            JsonObject data = await facebookClient.GetAsyncEx("https://graph.facebook.com/oauth/access_token", parameters);
            token = (string)data["access_token"];
            facebookClient.AccessToken = token;
            PhoneApplicationService.Current.State["token"] = token;
        }
        catch (Exception)
        {
            MessageBox.Show("Impossible de renouveler le token");
        }
        base.OnNavigatedTo(e);
    }

    private void Button_Tap_1(object sender, System.Windows.Input.GestureEventArgs e)
    {
        int num;
        if (int.TryParse(Valeur.Text, out num))
        {
            if (valeurSecrete == num)
            {
                Indications.Text = "Gagné !!";
                BoutonFb.IsEnabled = true;
            }
            else
            {
                nbCoups++;
                if (valeurSecrete < num)
                    Indications.Text = "Trop grand ...";
                else
                    Indications.Text = "Trop petit ...";
                if (nbCoups == 1)
                    NombreDeCoups.Text = nbCoups + " coup";
                else
                    NombreDeCoups.Text = nbCoups + " coups";
            }
        }
        else
            Indications.Text = "Veuillez saisir un entier ...";
    }

    private void Button_Tap_2(object sender, System.Windows.Input.GestureEventArgs e)
    {
        valeurSecrete = random.Next(1, 500);
        nbCoups = 0;
        Indications.Text = string.Empty;
        NombreDeCoups.Text = string.Empty;
        Valeur.Text = string.Empty;
    }

    private void Button_Tap(object sender, System.Windows.Input.GestureEventArgs e)
    {
        // à faire, publier sur facebook
    }
}

Il n’a rien de transcendant, c’est comme le TP mixé à ce qu’on a vu sur Facebook juste avant. Lorsque nous trouvons la bonne valeur, on change la valeur de la propriété IsEnabled du bouton pour publier sur Facebook. Celui-ci devra construire le message et poster sur notre mur. Pour cela, on utilisera la méthode PostAsync et pourquoi pas une méthode d’extension asynchrone que nous pouvons rajouter à notre classe statique d’extensions :

public static Task<JsonObject> PostAsyncEx(this FacebookClient facebookClient, string uri, object parameters)
{
    TaskCompletionSource<JsonObject> taskCompletionSource = new TaskCompletionSource<JsonObject>();
    EventHandler<FacebookApiEventArgs> postCompletedHandler = null;
    postCompletedHandler = (s, e) =>
    {
        facebookClient.PostCompleted -= postCompletedHandler;
        if (e.Error != null)
            taskCompletionSource.TrySetException(e.Error);
        else
            taskCompletionSource.TrySetResult((JsonObject)e.GetResultData());
    };

    facebookClient.PostCompleted += postCompletedHandler;
    facebookClient.PostAsync(uri, parameters);

    return taskCompletionSource.Task;
}

Nous pourrons alors poster sur le mur en passant un message dans la propriété message, puis en envoyant tout ça en REST sur l'adresse du mur. Une fois que l'envoi est terminé, on est en mesure de déterminer si l'envoi est bien passé ou pas :

private async void Button_Tap(object sender, System.Windows.Input.GestureEventArgs e)
{
    string message = "Message correctement posté";
    try
    {
        Dictionary<string, object> parameters = new Dictionary<string, object>();
        parameters["message"] = "Je viens de trouver le nombre secret en " + nbCoups;
        await facebookClient.PostAsyncEx("https://graph.facebook.com/me/feed", parameters);
    }
    catch (Exception)
    {
        message = "Impossible de poster le message";
    }
    Dispatcher.BeginInvoke(() =>
    {
        MessageBox.Show(message);
    });
}

Et voilà !

Le message est posté sur Facebook depuis l'application Windows Phone
Le message est posté sur Facebook depuis l'application Windows Phone

Côté Facebook, nous pouvons constater l’apparition du message sur mon mur comme je vous le montre dans la dernière figure.

Le message est affiché sur mon mur
Le message est affiché sur mon mur

Utiliser les tasks

Il existe une autre solution pour poster un message sur son mur. Très simple, sans avoir besoin d’une application Facebook, à partir du moment où vous avez configuré votre téléphone avec votre compte Facebook, ce qui est souvent le cas. Il suffit ensuite d'utiliser un launcher spécifique du téléphone.
Poster un message sur son mur se fait en quelques lignes de code, par exemple pour mettre à jour son statut :

ShareStatusTask shareStatusTask = new ShareStatusTask();
shareStatusTask.Status = "Bonjour mon mur";
shareStatusTask.Show();

Évidemment, il demande une confirmation à l’utilisateur. Vous ne pourrez pas le voir sur l’émulateur, alors je vous montre dans la figure suivante une copie de mon téléphone.

Partage de statut via le launcher
Partage de statut via le launcher

Ce n’est cependant pas vraiment un partage Facebook, c’est un partage pour tous les réseaux sociaux configurés du téléphone, et on peut en l’occurrence choisir Facebook. C’est ce que j’ai fait ici dans la deuxième zone.
Il est également très facile de publier un lien (voir code et illustration qui suivent).

ShareLinkTask shareLinkTask = new ShareLinkTask();

shareLinkTask.Title = "Mon livre pour apprendre le C#";
shareLinkTask.LinkUri = new Uri("http://boutique.fr.openclassrooms.com/boutique-614-797-apprenez-a-developper-en-c.html", UriKind.Absolute);
shareLinkTask.Message = "A lire absolument ...";
shareLinkTask.Show();
Partage de lien via launcher
Partage de lien via launcher

Grâce à ces deux launchers, il devient très facile de publier un statut ou un lien, même si on est fatalement un peu plus limité car on ne peut que poster sur son mur et pas par exemple sur le mur de nos amis pour leur souhaiter un bon anniversaire.

Nous avons vu comment lire des informations dans le graphe social et comment y poster un message. Il y a beaucoup d’autres informations intéressantes dans ce graphe social. Des applications à but commercial pourraient les exploiter avec intérêt. Étant donné qu’il est très facile de récupérer ce que vous aimez (les « j’aime »), il pourrait être très facile de vous proposer des produits en adéquation avec ce que vous aimez. Les entreprises d’e-commerce ne s’y trompent pas et essayent de vous attirer sur leurs applications Facebook. À partir du moment où vous autorisez l’accès à vos informations, vous avez pu voir comme il est simple de les récupérer. Cela ouvre beaucoup de possibilités pour rendre vos applications Windows Phone sociales et dynamiques.

  • Il faut créer une application Facebook afin de pouvoir interagir avec Facebook depuis notre application Windows Phone.

  • On utilise le contrôle WebBrowser pour établir l’authentification OAuth.

  • Les permissions, si elles sont acceptées, nous permettent d’accéder aux informations du graphe social.

  • Le SDK nous simplifie l’accès aux ressources REST du graphe social.

  • On peut utiliser des launchers pour partager très facilement des informations sur les réseaux sociaux.

Exemple de certificat de réussite
Exemple de certificat de réussite