Arnaud Georgin

Je viens de mettre à disposition dans les contributions du site d’ezPublish ma toute dernière extension : ezgeolocalization.

Celle comme son nom l’indique vous permet de géolocaliser les internautes à partir de leur IP. La géolocalisation est de plus en plus utilisée notamment pour proposer des contenus aux internautes en fonction de leur position géographique (par exemple les salles de cinéma proches de chez moi) ou alors pour protéger des contenus (par exemple j’ai l’exclusivité sur les actualités de la formule 1 mais seuls les internautes de france métropolitaine peuvent y accéder).

J’ai donc développé une extension ezPublish proposant une solution de géolocalisation. L’extension utilise les bases de données de géolocalisation gratuites des pays et des villes fournies par la société Maxmind. Elle utilise de plus l’API virtualearth de microsoft afin de vous permettre d’afficher sur une carte interactive et dans le navigateur la position de la ville ou du pays de l’internaute comme présenté sur la capture d’écran :

J’ai préféré utiliser virtualearth plutot que googlemap tout simplement car l’API de microsoft (virtualearth) contrairement à celle de google ne nécessite pas de génération de clé d’authentification pour l’utiliser ce qui était un objectif capital pour pouvoir diffuser mon extension.

Fonctionnalités de l’extension

1. pour le front, des opérateurs de templates et une classe métier PHP afin de pouvoir géolocaliser un internaute via son IP
2. une interface backoffice permettant d’effectuer les mises à jours manuelle des bases de données ainsi qu’une interface permettant de géolicaliser une IP
3. un cron de mise à jour automatique de la base de géolocalisation des pays (la base des villes est trop grosse pour cela) à partir du site de Maxmind

Vous pouvez télécharger cette extension à l’adresse suivante : http://agdeveloppement.e3b.org/ezpublish/ezgeolocalization.zip (22Mo).

Installation

1. décompresser l’archive zip et la copier dans le repertoire extension d’ezPublish
2. décompresser le fichier /sql/dump_ezgeo.zip et exécuter le script SQL afin de créer les tables de géolocalisation
3. activer l’extension dans le backoffice
4. vider le cache d’ezPublish

Ce n’est pour l’instant que la version 1 de cette extension et je travaille encore dessus afin de lui apporter de nouvelles fonctionnalités.

N’hésitez pas à me laisser vos commentaires ils me seront très utiles pour faire évoluer ce projet.

developpement, ezPublish ezPublish, php

Il est parfois utile d’avoir à déterminer les caractéristiques d’un objet (méthodes, attributs) ou bien de vouloir instancier de manière dynamique un objet à partir d’un code générique. Pour cela on utilise un mécanisme appelé l’introspection ou Reflection.

Tous les languages de haut niveau proposent ce type de fonctionnement et Actionscript ne déroge pas à la règle. Il y a cependant certaines subtilités à connaitre afin de faire fonctionner l’introspection en ActionScript.

L’utilisation de l’introspection en ActionScript passe par l’utilisation des fonctions disponibles dans le package flash.utils. Nous allons étudier par la suite deux de ces fonctions en détails, celle permettant de déterminer les caractéristiques d’un objet et celle permettant de faire des instanciation dynamique.

Déterminer dynamiquement les caractéristiques d’un objet

Pour déterminer de manière dynamique les caractéristiques d’un objet, il faut utiliser la fonction describeType dont voici la signature :

Cette fonction prend en paramètre tout type d’objet (* signifiant type indéfini) et retourne un XML décrivant la classe.

Instancier dynamiquement un objet

Pour intancier dynamiquement un objet il faut utiliser la méthode getDefinitionByName dont voici la signature :

Cette fonction retourne une référence de la classe (un pointeur) définie par la chaine de caractère passée en paramètre (le paramètre name).

Prenons tout de suite un exemple. Si on veut instancier de manière dynamique un objet Flex Button le code sera le suivant :

Avec ce code on retrouve dans la variable myObject une instance de la classe Flex Button. Ce code compile parfaitement mais malheureusement à ne fonctionne pas à l’execution et générer l’erreur 1065 (variable n’est pas définie). En effet dans ce code, le moteur flash n’embarque à aucun moment la définition de la classe Button car il n’existe aucune variable faisant référence à la classe Button. Pour que le code fonctionne il faut donc créer une variable “bidon” faisant référence à la classe Button pour que le moteur flash l’embarque.
Le code devient donc :

Avec l’ajout de cette variable le code fonctionne parfaitement et la variable myObject devient utilisable.

En conclusion, l’introspection est parfaitement fonctionnelle et utilisable en ActionScript. Elle nécessite cependant quelques astuces indispensable.

developpement, flex actionscript 3, flex

Mysql offre la possibilité d’afficher à l’utilisateur le plan d’exécution pour une requête données. Pour cela, il suffit de précéder la requête à analyser de l’instruction EXPLAIN.

Ainsi utilisé, MySql affiche en résultat à l’utilisateur un tableau permettant de détailler comment l’optimiseur de requête va exécuter celle-ci. C’est ce qu’on appelle le plan d’exécution. Le tableau affiché en résultat peu contenir de 1 à plusieurs lignes.

Dans le cas d’une requête simple, ce tableau contiendra une ligne.

Dans le cas d’une requête contenant deux instructions SELECT associées avec la clause UNION, le tableau contiendra trois lignes :

• une ligne pour chaque exécution de l’instruction SELECT,
• une ligne pour le résultat de l’instruction UNION

Le tableau affiché contient les colonnes suivantes :

• id : L’identifiant de l’instruction SELECT. Correspond au numéro de l’instruction SELECT au sein de la requête. Est utilisé dans le cas où l’optimiseur va effectuer plusieurs instructions SELECT (comme dans l’utilisation de la clause UNION par exemple),
• select_type : le type d’instruction SELECT que l’optimiseur va exécuter. Les différents types sont :
  1. SIMPLE : exécution d’une instruction SELECT simple (par de select imbriqué ou de clause UNION)
  2. PRIMARY : SELECT principal dans une requête avec des instructions select imbriquées
  3. UNION : seconde ou dernière instruction SELECT d’une requête contenant la clause UNION
  4. DEPENDANT UNION : seconde ou dernière instruction SELECT d’une requête contenant la clause UNION qui dépend d’une requête externe
  5. UNION RESULT : le résultat de la clause UNION (après exécution de l’ensemble des instructions SELECT)
  6. SUBQUERY : première instruction SELECT dans une requête contenant des select imbriqués
  7. DERIVED : résultat de l’instruction SELECT d’une requête imbriquée dans la clause FROM

• table : le nom de la table contenant les lignes retournées par la clause SELECT de la requête
• type : le type de jointure utilisé sur la table dans la requête
• possible_keys : cette colonne indique les index que MySQL peut utiliser pour trouver les lignes utiles dans la tables
• key : cette colonne indique l’index que MySQL a décidé d’utiliser. La valeur de cette colonne vaut NULL si MySQL n’a pas utilisé d’index.
• key_len : cette colonne indique la longueur de l’index que MySQL a décidé d’utiliser.
• ref : cette colonne affiche qu’elles colonnes de la table ou constantes ont été comparées à l’index afin de trouver les lignes utiles dans la table
• rows : cette colonne affiche le nombre de lignes de la table que MySQL devra exéminer pour exécuter cette partie de la requête
• extra : cette colonne affiche des informations supplémentaires sur la manière utilisée par MySQL pour résoudre la requête

L’utilisation du plan d’exécution est indispensable afin de comprendre comment MySQL exécute une requête et ainsi optimiser les performances. Cette instruction vous permet notamment d’identifier si la requête utilise des index ou pas.

MySQL, developpement MySQL, optimisation

Je travaille actuellement sur une application web dont le front est développé en flex. Ce client flex communique avec le serveur en postant les données à traiter vers du code PHP.

Dans ce genre de communication, j’aime bien poster un checksum en supplément des données à traiter afin de valider que la requête est bien issue du client flex et pas d’un hacker qui appelle le code en direct.

Le principe est simple. L’application flex calcule le checksum à partir des données à traiter et encode le tout en MD5. Du côté PHP on applique le même calcul et on compare la chaine calculée au checksum reçu. Si ils ont égaux on considère que la requête provient bien du flex.

Seul problème, le language Actionscript ne permet pas en standard d’encrypter une chaine en MD5 comme c’est par exemple le cas en PHP.

Heureusement, une implémentation open source existe. Il s’agit de la libriarie as3corelib disponible sur google code.

Pour utiliser cette bibliothèque, il suffit de télécharger le fichier zip, de le décompresser et de copier le contenu du répertoire “src” à la racine de votre projet flex.

Ensuite, dans votre code actionscript, il suffit de procéder comme suit :

Dans la variable hash, vous trouverez le résultat de l’encodage en MD5 de la chaine “test”.

developpement, flex actionscript 3, flex, md5, sécurité

Des dixaines d’experts informatiques se sont regroupés le 12 janvier 2009 à Washington DC afin d’établir la liste des 25 erreurs de développement à éviter absolument.

Cette liste a été rédigée fort du constat qu’en 2008, avec seulement 2 des 25 erreurs listées, plus de 1,5 millions de sites internet dans le monde étaient vulnérables à du piratage et des failles de sécurité.

Tous les plus grands acteurs de l’informatique (Symanctec, Microsoft, la division cybercriminalité de la NSA, …) ont participé à la rédaction de cette liste dans le but de sensibiliser tous les développeurs à sécuriser leurs codes.

L’objectif de cette liste est multiple :

• permettre à tous les développeurs d’écrire du code sécurisé et ne contenant pas une des 25 erreurs,
• permettre aux développeurs d’identifier et corriger ces erreurs dans les applicatifs existants.

Vous retrouverez dans cette liste les fameuses erreurs d’injection SQL, de cross site scripting, … que l’ont rencontre malheureusement encore trop souvent ainsi que de nombreuses autres.

Cette liste est très intéressante et utile et j’invite tous les developpeurs à la lire et la relire à l’adresse suivante http://www.sans.org/top25errors/ afin de rendre nos codes encore plus sûrs.

developpement developpement, sécurité

JQuery est de plus en plus à la mode. Résultat nombreux sont ceux qui veulent l’utiliser pour des développements futur.

Mais quid de l’existant.

En effet, il peut être parfois fastidieux de recoder toutes les fonctions javascript d’un site qui utilisait un autre framework javascript tel que prototype.

Inclure JQuery en même temps que prototype par exemple génère des conflits. Dans ce cas par exemple, il résultera un conflit à cause de la fameuse fonction $ qui existe dans en JQuery et en Prototype.

Heureusement, JQuery répond à la problématique en introduisant le mode de fonctionnement “No Conflict“. Pour cela, il suffit d’invoquer la méthode jQuery.noConflict(); à la suite du chargement de l’ensemble des frameworks.

Ainsi, en reprenant l’exemple de la fonction $, celle-ci n’utilisera pas JQuery mais un autre fremewok (ou une fonction propriétaire) définissant cette fonction.

ATTENTION, pour utiliser les fonctions de JQuery, il faut utiliser l’operateur jQuery.xxx et non plus l’opérateur $.xxx.

developpement framework, javascript, JQuery, prototype

Je viens de débuter depuis quelque jours le développement d’un gadget iGoogle pour un des sites sur lesquels je travaille. Je suis rapidement tombé sur un problème ennuyeux lors de la phase de développement le cache. N’ayant pas trouvé la solution facilement je vous fait partager mon expérience.

Avant d’aller plus loin, voici quelques rappels.

Un gadget iGoogle est une petite application qui s’installe sur la plateforme iGoogle. En général ces applications servent à mettre en avant les contenus d’un site Internet (la météo, les résultats sportifs, …) mais certaines font beaucoup plus qu’être un simple agrégateur du flux RSS ou XML. C’est applications sont en général un document XML contenant de l’HTML couplé à des feuilles de styles CSS pour l’interface utilisateur ainsi que du code javascript pour les interactions.

La plateforme iGoogle est le conteneur de ces applications (à noter qu’il existe d’autres conteneurs d’applications tels que facebook, myspace, …). Elle permet ainsi d’ajouter et/ou supprimer des applications, gérer leur affichage ainsi que leur comportement. Pour finir sur la présentation du conteneur iGoogle, Google fournit toute une série d’API de développement utilisables en javascript (appels ajax, API opensocial, …) au sein d’un gadget.

Pour utiliser iGoogle, il suffit de disposer d’un compte chez google (un compte gmail par exemple). Ensuite, vous pouvez utiliser le service et développer vos premiers gadgets.

Lors du développement d’un gadget, le seul moyen de tester notre code consiste à ajouter ce gadget à notre conteur iGoogle. Or c’est à ce moment que se pose notre problème. Lors de l’ajout d’un gadget dans le conteneur, celui-ci est mis en cache par google. Ce comportement est génial lorsque le gadget est finalisé. En effet, le cache évite que le gadget interroge constament votre serveur ce qui pourrait poser problème si le gadget est utilisé par de nombreuses personnes. Par contre, en phase de développement il est impossible de développer avec du cache surtout que la durée de mise en cache est très importante.

Heureusement (il m’a fallu une après-midi pour trouver la solution), google met à notre disposition un gadget : my gadgets qui permet d’administrer les gadgets au sein du conteneur courant. Ce gadget vous permet d’ajouter un gadget dans votre conteneur et définir si celui-ci doit utiliser le cache google.  Pour cela il suffit de décocher la case cached en face du nom de votre widget et le tour est joué.

developpement gadget, iGoogle, javascript, widget

Aujourd’hui j’aimerai vous parler d’un éditeur de texte que j’affectionne tout particulièrement en tant que développeur : SciTE.

SciTE signifie Scintilla Text Editor. C’est donc un éditeur de texte qui utilise le composant Scintilla. Ce composant est un éditeur de code source particulièrement performant. Pour preuve, c’est ce composant que l’on retrouve dans d’autres logiciels d’édition tels que Notepad2.

Comme nous le verrons par la suite, SciTE est bien plus qu’un éditeur.

SciTE est disponible pour Linux et Windows et est téléchargeable à l’adresse suivante : http://www.scintilla.org/SciTEDownload.html.

Comme tous les éditeurs de texte SciTE offre la possibilité d’ouvrir plusieurs fichiers simultanément et de naviguer entre eux via des onglets.

De plus lors de l’édition de code (ce qui nous interesse sur ce blog) SciTE offre des fonctionnalités dignes des meilleurs IDE :

• coloration syntaxique,
• système de dépliage/repliage de bloc de code
• appel d’un compilateur
• fenêtre d’output
• …

De plus tout est configurable avec SciTE malheureusement sans interface graphique. Il faut donc passer par l’édition des fichiers de properties.

Ces fichiers sont au nombre de trois (plus ceux dédiés aux languages spécifiques) :

1. Le fichier Global définit les options globales par défaut de SciTE (c’est à dire, celles qui s’appliqueront à tous les utilisateurs). Il est préférable de ne pas y touché étant donné que ce fichier sera écrasé à chaque mise à jour
2. Le fichier User,  qui définit les options pour  l’utilisateur courant.
3. Le fichier Local qui définit les options à appliquer lors de l’édition de fichiers dans un fichier précis. Il doit se trouver dans le même dossier que les fichiers auxquels on veut appliquer ces paramètres.

Via ces fichiers vous pouvez complètement configurer le comportement de SciTE pour qu’il réponde à vos besoin.

Par exemple lors de l’édition de sources de balises (HTML ou MXML par exemple) vous pouvez configurer SciTE pour que celui-ci ferme automatiquement la balise que vous venez d’ouvrir en plaçant la curseur entre la balise ouvrante et la balise fermante. Pour cela, il vous suffit d’ajouter la ligne suivante au fichier de configuration :

xml.auto.close.tags=1

Un second exemple, il est possible de définir le look du système de repliage de bloc de code. Pour cela, il vous suffit de modifier la ligne suivante en remplaçant la valeur 1 pour une valeur allant de 0 à 4 (je vous laisse découvrir par vous même le résultat) :

fold.symbols=1

Pour plus d’information sur le paramétrage de SciTE, je vous invite à consulter la documentation en ligne.

En conclusion cet éditeur est vraiment très puissant bien que très léger d’utilisation et je ne peux plus m’en passer.

developpement dev, editeur, SciTE

Utilisant comme framework javascript de plus en plus JQuery (comparaison des frameworks javascript) j’ai été amené à développer des interfaces utilisateur à base de “popup ajax”.

Ne voulant pas réinventer la roue, j’ai cherché quels étaient les plugin JQuery qui offraient cette fonctionnalité. Mon choix s’est arrêté sur Thickbox.

Thickbox est plugin JQuery permettant d’afficher à l’écran du contenu en sur-impression de la page courante.

Ce plugin est très léger : 20ko en version compressée et 58ko en version normale. De plus son mode de fonctionnement est l’un des plus simple que j’ai utiliser et certainement le moins intrusif.

En effet pour ouvrir un contenu dans une “popup ajax”, il suffit (une fois le script chargé dans la page évidemment) de définir un lien HTML portant l’attribut class=”thickbox”. Thickbox se charge donc d’ouvrir la cible du lien dans une popup en sur-impression de la page courante.

La puissance de la bibliothèque ne s’arrête pas là. En effet, le comportement de la popup est paramétrable. Vous pouvez très simplement déterminer par exemple la hauteur ou la largeur de la popup à afficher. Pour cela, rien de plus simple il suffit d’ajouter à la suite de l’url du lien à charger en popup les paramètres height et/ou width.

Par exemple, si nous voulons charger la home de google dans une popup de largeur 200 pixels et de hauteur 300 pixels il suffit de définir un lien dont l’attribut href aura la valeur http://google.fr?height=300&width=200.

de la même manière si nous voulons que notre popup soit modale il nous suffit d’ajouter le paramètre d’url &modal=true.

Je conseille vivement à tous les utilisateurs de JQuery de tester cette bibliothèque très utile et tellement simple d’utilisation qu’elle rendra vos développement javascript encore plus joyeux. Vous remarquerez au passage que le système d’affichage des photos de ce blog utilise thickbox

developpement ajax, javascript, JQuery

Depuis quelques temps sur mon serveur de développement PHP, je suis régulièrement tombé sur l’erreur fatale suivante : Maximum function nesting level of ‘100′ reached.

N’ayant jamais rencontré cette erreur auparavant et ayant installé dernièrement l’extension PHP Xdebug j’ai creusé dans cette direction.

L’extension PHP Xdebug qui permet de faire du debuggage ainsi que du profiling PHP définit le paramètre de configuration xdebug.max_nesting_level (par défaut à la valeur 100). Ce paramètre permet de déterminer le nombre maximum de fonctions imbriquées avant de stopper l’exécution du script.

Il suffit donc d’augmenter la valeur de ce paramètre de configuration et de redémarrer Apache pour ne plus rencontrer le problème.

NB : je n’ai pas trouvé de valeur permettant d’ignorer ce paramètre comme il est possible de le faire pour la variable max_execution_time par exemple.

developpement php