[WP7] Utiliser Skydrive dans vos projets WP7

Dernièrement, Microsoft a annoncé la sortie du Live SDK. Cette boite à outil va nous permettre à nous développeur de faire interagir nos applications avec les services du Live. Cela va de l’authentification à nos services, en passant par WLM, l’accès aux calendriers et contacts mais aussi au SkyDrive !
SkyDrive, cet espace de stockage dans le cloud que j’avais évoqué dans cet article : https://onefor4.wordpress.com/2011/10/25/tip-intgrez-skydrive-windows-7/ va ainsi devenir encore plus intégré et nous permettre de faciliter les échanges inter-utilisateurs, inter-applications et inter-plateformes !
Nous allons voir ici quelques opérations basiques pour démarrer.

Prérequis et ressources :

Inscription de l’application

Avant toute chose, il va falloir inscrire votre application ici : https://manage.dev.live.com/AddApplication.aspx pour obtenir un identifiant et des credentials.

image

Rendez vous ensuite dans API Settings pour configurer votre application comme étant une application mobile.

image

Lire et écrire sur SkyDrive

Pour l’exemple, nous allons réaliser l’application suivante qui consiste à ajouter un nouveau fichier dans un dossier de SkyDrive.

image

C’est une simple page, contenant :

  • Un SignInButton que nous détaillerons plus tard et qui permet de s’authentifier sur le live.
  • Un ListPicker (que vous trouverez notamment dans le Silverlight for WP7 Toolkit) qui nous permettra de choisir dans quel dossier enregistrer notre fichier.
  • Une textbox pour donner un nom au fichier et une autre pour ajouter du contenu à ce fichier.

Le code

Pour utiliser SkyDrive, on aura besoin de s’authentifier sur le Live. Le SDK nous donne heureusement un contrôle déjà existant pour cela : le SignInButton ! Sourire
Ajoutez les DLL Microsoft.Live et Microsoft.Live.Controls à votre projet.

Rajoutez le namespace suivant dans votre xaml :

xmlns:my="clr-namespace:Microsoft.Live.Controls;
assembly=Microsoft.Live.Controls"

Vous pouvez maintenant utiliser le SignInButton qui vous permettra de vous authentifier sur le live et de choisir les différents droits que vous souhaitez que l’utilisateur vous donne.

<my:SignInButton 
ClientId="" 
Scopes="wl.signin wl.skydrive wl.skydrive_update" 
SessionChanged="SignInButton_SessionChanged" />

Les différents attributs importants :

  • ClientId : C’est l’identifiant de votre application. Vous le retrouverez sur cette page : https://manage.dev.live.com/Applications/Index
  • Scopes : C’est les différents droits que vous souhaitez obtenir. Ici, l’authentification, les droits de lecture sur le SkyDrive, et les droits de mises à jour sur le SkyDrive.
    Tous les scopes ici : http://msdn.microsoft.com/fr-fr/library/hh243646.aspx
  • SessionChanged : C’est l’évènement qui est levé lors de la Connexion / Déconnexion de l’utilisateur

En cliquant sur ce nouveau bouton, on est automatiquement redirigé vers la page de connexion de Windows Live.

image

Vient ensuite une demande d’autorisations :

image

La session est initialisée. Traitons là maintenant et voyons comment accéder aux différents dossiers sur notre SkyDrive. Pour cela, nous allons d’ailleurs créer une classe SkydriveItem qui nous permettra d’organiser plus facilement les différents éléments (fichiers, dossiers, albums).

public class SkydriveItem
    {
        public string Id { get; set; }
        public string Type { get; set; }
        public string Name { get; set; }

        public override string ToString()
        {
            return Name;
        }
    }
  • Id : Unique, il nous permet d’accéder directement à l’élément depuis le code.
  • Type : Il existe trois types d’éléments. Folder, un répertoire; Files, un fichier; Albums, un répertoire “spécial”.
  • Name : Le nom du dossier lisible par un humain Sourire

Revenons au code de notre page. On va ajouter un LiveConnectClient qui nous permettra de garder la session et de réaliser nos différentes opérations ainsi qu’une ObservableCollection de SkydriveItem dans laquelle on ajoutera les différents dossiers et que l’on bindera sur l’ItemsSource de notre ListPicker.

private LiveConnectClient _client;
public ObservableCollection<SkydriveItem> SkydriveItems 
{ get; set; }
        
// Constructor
public MainPage()
{
   SkydriveItems = new ObservableCollection<SkydriveItem>();
   InitializeComponent();
}

Remplissons ensuite la méthode SignInButton_SessionChanged().

private void SignInButton_SessionChanged(object sender, 
                     LiveConnectSessionChangedEventArgs e)
{
//Si on est bien connecté
if (e.Status == LiveConnectSessionStatus.Connected)
{
  //On purge la liste d'éléments
  SkydriveItems.Clear();
  //On initialise notre LiveConnectClient avec la session courante
  _client = new LiveConnectClient(e.Session);
  //On s'abonne à l'événement
  _client.GetCompleted += 
       new EventHandler<LiveOperationCompletedEventArgs>
                                       (OnGetCompleted);
 //On lance l'opération aynchrone
  _client.GetAsync("/me/skydrive/files");
 }
 else if (e.Status == LiveConnectSessionStatus.NotConnected)
 {
   SkydriveItems.Clear();
   _client = null;
 }
 else
   _client = null;
 }

Et on parcourt ensuite la liste des éléments obtenus en ajoutant ceux qui nous intéressent à notre ObservableCollection.

void OnGetCompleted(object sender, 
                LiveOperationCompletedEventArgs e)
{
  if (e.Error == null)
  {
    List<object> data = (List<object>)e.Result["data"];
    foreach (IDictionary<string, object> content in data)
    {
      SkydriveItem nItem = new SkydriveItem();
      nItem.Id = (string)content["id"];
      nItem.Name = (string)content["name"];
      nItem.Type = (string)content["type"];
      if(nItem.Type == "folder")
        SkydriveItems.Add(nItem);
     }
  }
}

Ils apparaissent maintenant dans notre ListPicker après l’authentification.

image

Occupons-nous de l’écriture dans un des dossiers sélectionnés. Abonnons l’évènement Click de notre bouton sur une méthode Save_Click.
Pour cet exemple, j’ai appelé la textbox qui représente le titre du fichier : Tb_Title et celle représentant le contenu : Tb_Text.

Voici le code de la méthode Save_Click() ainsi que le callback une fois l’upload terminé.

private void Save_Click(object sender, RoutedEventArgs e)
{
    string fileName = Tb_Title.Text.Trim();
    byte[] byteArray = 
Encoding.Unicode.GetBytes(Tb_Text.Text.Trim());
    MemoryStream fileStream = new MemoryStream(byteArray);
    _client.UploadCompleted += new 
EventHandler<LiveOperationCompletedEventArgs>(
UploadCompleted); 
    _client.UploadAsync(
((SkydriveItem)LP_Items.SelectedItem).Id, fileName, 
fileStream);
}

void UploadCompleted(object sender, 
LiveOperationCompletedEventArgs e)
{
    if (e.Error == null)
    {
        Dispatcher.BeginInvoke(() =>
        {
            MessageBox.Show("Uploadé !");
        });
    }
}

La méthode « _client.UploadAsync(
((SkydriveItem)LP_Items.SelectedItem).Id, fileName,
fileStream); « 
nous permet d’uploader notre fichier dans le dossier correspondant. Mais attention, nous ne pouvons pas passer directement le nom du dossier mais son Id !

Une fois l’upload terminé, vous retrouverez votre fichier dans le dossier voulu sur votre SkyDrive : http://skydrive.live.com/

Conclusion

Nous avons ici découvert une partie du Live SDK : comment s’authentifier et comment utiliser des opérations basiques sur SkyDrive.
Ce SDK ouvre de formidables opportunités pour interagir avec les fichiers de vos utilisateurs mais aussi faciliter la migration de vos applications.
En effet, pourquoi ne pas sauvegarder le contenu de votre Isolated Storage pour le récupérer ensuite quand l’utilisateur souhaite changer de téléphone ? Ou simplement partager ses données avec un autre ?

Par JC VASSELON

Laisser un commentaire

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

Logo WordPress.com

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

Image Twitter

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

Photo Facebook

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

Photo Google+

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

Connexion à %s