samedi 27 avril 2013

De Mysql à Android via PHP et JSON Part.2


Dans la première partie de ce tutoriel , nous avons appris à générer du JSON à partir de notre table en base.
A présent nous allons voir comment, sous Android :

1. Récupérer ces données (liste de livre), depuis le serveur.
2.Traiter ces données, à savoir les convertir dans un format compatible facile à manipuler, par exemple en créant des objets à partir du JSON.
3.Afficher ces données de façon conviviale à l'utilisateur par exemple dans une ListView.

Le projet complet de ce tutoriel peut être téléchargé ici.

Prérequis 

Notre projet Android va s'appeler BookDroid.
Je suppose que vous n'êtes pas totalement nouveau à Android et au Java , vous avez :

- Les bases de JavaSE
- Les bases d'Android
- Vous avez et savez utiliser Eclipse et les ADT (Android developer tools).
-Vous avez un environnement de développement Android qui marche.

Le projet Android

Pour faire simple, notre projet aura 1 seul  composants:
L'activité ListBookActivity  dans laquelle nous allons afficher la liste de tous les livres.


Architecture


A ce stade, vous avez besoin de penser à une architecture à mettre en place pour arriver au résultat, et ce avant d'écrire la moindre ligne de code.
La consommation des services web sous Android et l'interaction avec un serveur en général implique beaucoup de notions importantes sensées notamment aider à économiser la batterie et la consommation data, à utiliser le cache , à optimiser l'expérience utilisateur, etc..
Dans les prochains posts j'aborderai ces notions mais pour le moment nous allons nous contenter du plus simple possible.

Voici l'architecture la plus simple possible pour faire ce travail :

Architecture simpliste de consommation de service web sous android
1. Un événement coté UI , par exemple un click sur bouton menu, envoie une requête ASYNCHRONE (notamment via un AsyncTask)  au Provider (fournisseur). Dans notre cas, il s'agit d'une demande de la liste de livres se trouvant côté serveur.
2.Le Provider à son tour appelle le HttpClient en lui donnant les informations nécessaires à savoir l' URL à appeler pour l'obtension des données .

3. Une fois le HTTPClient exécuté, il renvoi des données sous format JSON.Pas de panique, comme on l'a vu c'est juste une chaîne de caractères.
 Il peut retourné autre chose, par exemple un Timeout ou autre erreur coté serveur, etc; mais nous allons être optimistes et supposer qu'il n'a retourné que du JSON.

4. Le résultat retourné par le HTTPClient est ensuite converti du JSON en Liste d'objets "Livre" puis retourné au provider.

5.  Le Provider à son tour renvoi la liste d’objets à la partie UI pour affichage.

Noter que cette architecture est la plus simpliste possible et ne tient pas compte de notions très importantes dont l'usage est inévitable dans toute application qui se veut sérieuse.
Nous essayons ici d'illustrer les notions élémentaires avant de passer aux plus avancées.

Implémentation

Dans la partie 3 nous allons voir comment implémenter facilement les différentes parties :)




mardi 11 septembre 2012

De Mysql à Android via PHP et JSON Part.1

Introduction


Ce tutoriel s'adresse à ceux qui veulent savoir rapidement comment consommer du JSON sous Android.
Je ne m'attarderai donc pas sur les  détails concernant la créations des services web RESTfull, ce qui constituerai d'ailleurs un autre tutoriel à part.

Mais pour faciliter la compréhension, je vais utiliser une des techniques les plus simples (peut-être même la plus simple) pour générer du JSON à partir des données contenues dans une base de données Mysql.Cette technique pédagogique utilise le PHP et particulièrement la fonction JsonEncode qui permet de façon on ne peut plus simple de générer du JSON à partir du résultat d'une requête SQL.

Si vous souhaitez ensuite approfondir les notions de services web, n'hésitez pas à consulter la documentation spécialisée, je vous le recommande vivement.
Mais si vous avez déjà cette connaissance et vous souhaitez juste savoir comment consommer du JSON sous Android, ce tutoriel  est fait pour vous aussi.

Dans cette première partie nous allons créer notre partie serveur avec Php et Mysql.
Personnellement je ne suis pas développeur PHP, mais j'ai été touché un jour par sa souplesse et sa simplicité que j'en suis devenu fan, surtout lorsqu'il s'agit d'illustrer certains concepts sans trop perdre les apprentis dans des spécifications trop rigides telles qu'existantes dans le java entreprise par exemple.
Nous allons faire simple, et ça devrait marcher; ensuite vous pourriez approfondir sans craintes ces notions.

Nous allons utiliser une petite application pour illustrer, il s'agit d'une petite bibliothèque en ligne : bookdroid.
Cette application aura donc 3 couches ( on dit aussi trois  tiers)  :

1. La couche base de données : se résumant en notre bd Mysql  nommée "bookdroid" et n'ayant qu'une seule table: la table "livre".

2.La couche service : écrite en PHP , elle va se résumer en un script qui lit  la liste de livres depuis la BD et nous l'encode en JSON.

La couche 1 et 2 constituent la couche serveur de notre application.

3.La couche client mobile : C'est notre application mobile qui sera chargée de recuperer la liste de livres encodée en JSON, la "parser" et enfin de l'afficher dans une ListView.


 1. La base de données bookdroid. 

Elle se résume tout simplement à  notre petite table livre au sein de la base "bookdroid".

CREATE TABLE IF NOT EXISTS `livre` (

`idLivre` int(11) NOT NULL AUTO_INCREMENT,

`titreLivre` varchar(50) NOT NULL,

`auteurLivre` varchar(50) NOT NULL,

 PRIMARY KEY (`idLivre`)
)


 2. Le service booklist

Le but de cette partie est de générer du contenu JSON à partir de la connexion à notre base des données.
Allons-y étape par étape :

- Créez un répertoire au sein de votre serveur web ( pour XAMP sur windows 7, par exemple, il s'agit du dossier  C:\xampp\htdocs ) appelé "bookdroid";Il s'agit de notre application web qui aura de fait comme URL:   http://localhost/bookdroid/

- Dans ce dossier, ajoutez les fichiers bd.php, jsonEncoder.php et booklist.php

- bd.php s’occupe uniquement de la connexion à la base des données :

$BD_serveur     = "localhost"; 
    $BD_utilisateur = "root";
    $BD_motDePasse  = "";
    $BD_base        = "bookdroid";

 @mysql_pconnect($BD_serveur, $BD_utilisateur, $BD_motDePasse)
        or die("Server Error : Access refusé");
    @mysql_select_db($BD_base)
        or die("Server Error : DB Select:". mysql_error()); 

- jsonEncoder.php contient la fonction qui encordera nos données sous format JSON.


include ('bd.php');

function to_json($query) { 
$res=mysql_query($query); 
$result = array();
while($row = mysql_fetch_assoc($res)){
$result[] =array_map('utf8_encode', $row);
}
return json_encode($result);
}


- booklist.php retourne la liste de livres sous format JSON :

require 'jsonEncoder.php';
$sql="SELECT * FROM livre";
echo to_json($sql);

Comme je l'ai dit, c'est très simple !
Afin de tester que tout marche bien avant de passer à la deuxième partie de ce tutoriel, insérons quelques données dans la table livre.

INSERT INTO  `bookdroid`.`livre` (
`idLivre` ,
`titreLivre` ,
`auteurLivre`
)
VALUES (
NULL ,  'Techniques de hacking',  'John Ericson'
), (
NULL ,  'Le Livre d''Android 4 pour smartphones',  'Henri Lilien'

Ensuite, ouvrez votre navigateur et tapez ce lien : http://localhost/bookdroid/booklist.php; le resultat est sensé être sous cette forme :
[{"idLivre":"1","titreLivre":"Techniques de hacking","auteurLivre":"John Ericson"},{"idLivre":"2","titreLivre":"Le Livre d'Android 4 pour smartphones","auteurLivre":"Henri Lilien"},{"idLivre":"3","titreLivre":"Techniques de hacking","auteurLivre":"John Ericson"},{"idLivre":"4","titreLivre":"Le Livre d'Android 4 pour smartphones","auteurLivre":"Henri Lilien"}]
C'est le résultat attendu: notre liste de livres encodée dans le format JSON. La suite de tutoriel sera consacré à la partie mobile Android, nous verrons comment parser ce JSON et l'afficher dans une ListView.