Coding style

Une des craintes qui remonte régulièrement de la part des mes interlocuteurs clients sur les applicatifs AJAX concerne leur sécurité. En effet, l’idée reçue voudrait qu’en raison des traitements effectués principalement côté client, la sécurité s’en trouverait réduite. Nous allons voir ici qu’il n’en est rien, si les bonnes pratiques techniques sont respectées.

Client-serveur AJAX

Il est important d’ouvrir tout d’abord une parenthèse sur AJAX et son mode de fonctionnement.
Il s’agit d’un design de client-serveur web très classique reposant sur du HTTP. Le format d’échange passant via le tuyau tend vers les deux mêmes standards, JSON et XML.
Les différences concernent principalement :

• les requêtes HTTP elles mêmes, puisqu’elles sont effectuées de façon sous-jacente, par le biais des objets XmlHttpRequest,
• les traitements à la réception par le navigateur, puisque Javascript sert d’intermédiaire pour le rendu HTML, en lieu et place du moteur HTML du navigateur directement

Au final, les données transitent de la même façon que pour des pages classiques, seuls leur format et le traitement par le navigateur changent.

Actions à entreprendre

Côté serveur, il faut respecter scrupuleusement les bonnes pratiques de sécurité d’un applicatif classique :

• utilisation de HTTPS lorsque des données utilisateur sensibles transitent sur le canal client-serveur (informations administratives, numéro de sécu, login/mot de passe…)
• filtrer toutes les données entrantes, et encore plus lorsqu’elles proviennent d’une saisie utilisateur côté client.
• utilisation de sessions utilisateur pour s’assurer que le navigateur client a les permissions adéquates

Côté client, la subtilité supplémentaire est que le contenu n’est pas du HTML à rendre directement dans le navigateur. Ici encore, la cohérence des données entrantes est primordiale. Vous vous devez donc de contrôler proprement et d’assainir si nécessaire ce qui est renvoyé par le serveur, contre des attaques potentielles (injection de HTML fraudulueux par exemple).

Edit : un excellent article paru sur Ajaxian aujourd’hui traite concrètement des problèmes de sécurité sur les applicatifs Web. A lire absolument.

Vous en avez marre de l’horrible console de Yahoo qui fait ramer la page en mode Debug ? Voici un petit bout de code qui redirige la fonction YAHOO.log() dans la console de Firebug.
Lire la suite »

Suite à la publication d’un billet de Mathieu Collet sur Ergonomic Garden, voici une implémentation avec Yahoo! UI d’un indicateur de chargement.

Dans cet article, je vous présente le code d’un widget YUI fait par mes soins, permettant de créer ce petit indicateur et le relie à un élement de la page.

Lire la suite »

Voici un petit morceau de code développé par mes soins pour traiter le cas d’un envoi de données “à l’ancienne”, c’est-à-dire via un formulaire posté par HTTP avec rechargement de page, avec la librairie Yahoo!UI.

Lire la suite »

La “graceful degradation”, est une notion qui devrait se retrouver derrière la plupart des sites Web. Son principe général repose sur le fait que tout le monde ne possède pas la technologie dernier cri, et que par conséquent le site doit en douceur savoir se mettre au niveau des ressources de l’utilisateur.
En pratique, cela consiste le plus souvent à proposer une alternative adaptée suivant les possibilités de l’utilisateur, et peut couvrir beaucoup de cas : HTML, CSS, Javascript, Applet, ActiveX….

Lire la suite »

S’il est un choix difficile et consciencieux à faire pour un codeur, c’est bien celui de son environnement de développement intégré. Comme le cavalier et sa monture, c’est avec lui que vous allez passer la plupart de vos heures de geekitude absolue. Conséquence, autant bien choisir son partenaire, avant d’hurler avec un fort accent latino que le monde du web est à vous !

Lire la suite »

Les grands rechargements de page interminables à cause d’un fichier de 3 Mo, c’est désormais fini ! Le Ouaibe 2.0 fournit des outils pour envoyer des fichiers de façon plus agréable et surtout non-bloquante. Et c’est l’utilisateur qui est gagnant.

Lire la suite »

IE 5 et 6 souffrent d’un problème grave : certains composants graphiques se contrefichent de la propriété CSS z-index qui définit le niveau de profondeur de l’élément dans la hiérarchie.
Les coupables, en l’occurence SELECT, les ActiveX et les plug-ins (Java etc.) sont rendus via la librairie graphique standard de Windows et pas par le moteur MSHTML, ce qui les rend insensibles au z-index. Pas pratique lorsqu’on veut afficher un élement en surimpression (un DIV avec un calendrier par exemple).

A ce sujet, il y a plusieurs manières de faire.

Lire la suite »

Si vous avez déjà rencontré des problèmes avec la fonction Array.sort() en Javascript avec IE, tandis que Firefox vous donne un résultat très rapide, alors cette page est pour vous.
Ce code va vous sauver la vie, en particulier si vous vous êtes lancés dans AJAX et dans le tri dynamique de tableaux HTML !

Grand sujet que l’édition de contenu par l’utilisateur, via une administration de site. La plupart de ces sites comportent des formulaires dédiés à la saisie ou l’édition d’une donnée, mais que se passe t’il lorsque l’utilisateur ferme la fenêtre ou clique sur un lien présent dans la page ?

Lire la suite »