Donnez un coup de jeune à vos applications Web !

Le développement d’application Web a bien évolué avec l’essor émergeant des nouvelles technologies (HTML5, JS, etc.). Autrefois, la complexité des applications étaient déportée sur le serveur hébergeant le service, avec la montée en puissance des navigateurs et technologies clientes, il est possible d’effectuer une partie du travaille dans le navigateur :

  • Mise en forme.
  • Conditionnement technologique. (j’espère que cela va disparaitre ou au moins se réduire …)
  • Traiter l’information avant validation par le serveur pour éliminer le plus d’échange possible.

L’utilisation de ces technologies permettent entre autres d’alléger le serveur hébergeant le système, et de limiter sa fonction à un fournisseur de données.

Le fait de déplacer la complexité des applications du serveur vers le client, ainsi que l’évolution des langages utilisables dans un navigateur, a généré chez les développeurs un manque de structuration des applications coté client.

Les applications serveurs sont souvent intégrées à l’aide d’un ensemble de technologies servant à structurer  les développements, telles que :

  • Plateforme : J2EE, Ruby, Python
  • IoC : Spring, Guice
  • MVC : Spring MVC, Stru…. (désolé j’y arrive pas !), Rails, Django
  • et plein d’autres.

Coté client,  il s’agit souvent de technologie basée JavaScript ou via plugin propriétaire (Flash, Silverlight), mais bon aux vues des tendances actuelles il serait dangereux de croire que le propriétaire va continuer à vivre, face aux technologies standarts (HTML5, SVG, Canvas, etc.) et bien d’autres dérivées (WebGL).

Dans un prochaine article, nous aborderons comment concevoir un écran complet, en utilisant SpringMVC (coté client), ainsi que Backbone.JS (framework JS).
Cet écran sera complètement décorellé du service, et pourra être porté sur une autre technologie sans trop d’effort (Sinatra).

Du JavaScript à toutes les Sauces !!!

Vous n’êtes pas sans savoir (en tout cas ceux qui bossent avec moi le savent ^^), ou alors vous avez vécu sur une autre planète qu’en ce moment (depuis 6mois – 1an), le monde du JavaScript a subit d’énormes mutations.
Et qu’il y trouve ça place au rang des PHP, Ruby, voir même Java;

Les technologies dérivées permettent de mettre à plat un serveur Apache tant au niveau performance, qu’au niveau consommation mémoire. Qu’il peut être utilisé comme interface de communication avec une base de données type NoSQL comme MongoDB, CouchDB.

Ce language, utilisé jusqu’à présent pour ajouter un caractère dynamique au HTML, peut être utilisé pour divers activités, et remets au gout du jour une manière de programmer : la programmation asynchrone.

A tel point que certaines personnes se posent la question simple : Le JavaScript va-t-il détroner les autres langages Web ?

Il y a 20 ans (et oui déjà), les infrastructures « Web 0.1″ utilisaient un rendu complet coté serveur (l’AJAX n’existait pas), ce qui faisait faire un aller-retour pour chaque page demandée. Puis est arrivé, la notion d’AJAX, permettant d’effectuer des requêtes hors cycle de chargement principal, ce qui a permit de mettre en place des chargements partiels d’informations tout en minimisant de fait le trafic Client/Serveur.

Puis sont arrivés les outils de développements « structurés » JavaScript :

Permettant de construire de vraies applications JavaScripts, avec des notions de modèles, de vues, de contrôleurs, de templates. Templates permettant ainsi de mettre en forme d’informations issues du serveur de manière brute (JSON / XML mais surtout JSON !) via la consultation de service Web REST.

L’évolution des machines virtuelles JS permet de nos jours de faire tourner des applications en 3D Temps Rééls (grâce au WebGL ), de concurrencer des plateformes dédiées comme Flash, Silverlight (ExtJS). (ROME) Voir même émuler un noyau linux dans votre navigateur ^^

Alors pourquoi continuer à ignorer une telle technologie, c’est pas comme si c’était nouveau … Tout cela est selon moi, un virage technologique Web et d’autres plateformes (Mobiles) qu’il ne faut pas louper, au risque de devenir vraiment obsolète sur le marché du travail.

Je ne suis volontairement pas rentré dans les détails, car je pense qu’il faudrait bien plus qu’un article pour vous parler des choses que l’on peut faire avec tout ça, chaque élément aura son article associé.

La sécurité informatique une nécessité ou un paradoxe de l’utilisateur ?

facteur humain La sécurité informatique une nécessité ou un paradoxe de lutilisateur ?Voila plus de deux ans que j’ai quitté le monde de la sécurité informatique, pour me diriger vers le développement. Et je me pose une simple question : La sécurité informatique est-ce une nécessité ou un paradoxe induit de son utilisation ?

Pour reformuler, faut-il protéger un utilisateur de son système ou bien protéger le système de l’utilisateur ?

De nos jours, la sécurité est mal comprise : souvent comme une série de contraintes appliquées aux utilisateurs d’un SI.

Il suffit d’aller dans un hôtel en semaine, équipé d’un ordinateur + wifi, pour obtenir des tas d’informations sur les sociétés, où les VRP présents résident. Ils se retrouvent sur un wifi en clair (Hôtel responsable dans ce cas), effectuant des transactions POP/IMAP (Auth PLAIN biensûr ! C’est de la simple Base64).
Je trouve ça particulièrement navrant pour certaines sociétés dont le fer de lance est la sécurité de l’information.

Faut-il se dire que c’est l’entreprise qui ne protège pas la connexion du VRP, ou le VRP lui même qui par négligence /
confiance / méconnaissance utilise des médias non sécurisés pour échanger des informations stratégiques.

Mon expérience me dit qu’en fait c’est souvent les deux cas :

  • l’entreprise qui ne consacre pas le temps nécessaire à la sécurité du SI,
  • mais aussi aux employés, qui ne sont pas sensibilisés / formés.

Ne serait-ce qu’utiliser un simple transport chiffré (SSL/TLS), pour éviter (ralentir) l’interception d’information.
Souvent la même réponse, on verra plus tard ! Mais quand l’évènement sécurité arrive il est trop tard ! C’est des mesures préventives, pas des mesures a posteriori !

Vous me direz, bien sûr personne ne se balade avec un kismet, wireshark dans les hôtels ! Moi je réponds comment en avez vous la preuve ? Sans pour autant tomber dans la paranoïa !

L’espionnage est une réalité, même au culot, j’ai déjà été contacté par un soi disant représentant de café, qui souhaitait simplement entrer pour faire une dégustation, au final il s’est avéré être un journaliste.
Il suffit d’avoir les yeux ouverts pour voir quantité d’informations. D’où le principe de mise en place d’un espace d’accueil clôt immédiat à la porte.

Pour se recentrer sur le sujet, l’utilisateur final, pas un espion, doit connaître les dispositifs de sécurité mis en place par l’entreprise, et surtout pourquoi ils sont là ! Et d’un autre coté, l’entreprise doit comprendre pourquoi l’information doit être protégée.

La négligence d’un seul des protagonistes risquent de rendre public des informations privées, pas forcément exploitable, mais qui pourraient servir à élaborer un scénario d’approche, dans le but d’en obtenir d’autres plus précises (produits, marchés, clients, etc.)

  • Vous êtes responsable d’un SI, pensez à cette phrase : La sécurité est un métier comme un autre, pas forcément le vôtre !
  • Vous êtes utilisateur du SI : Vous êtes la faiblesse du système, pensez-y !

Réferences :

Merci XSL-FO !

Pour des besoins professionnels, j’ai du apprendre à utiliser XSL-FO, au debut j’ai avais vraiment pas envie, mais bon au final si on a une bonne connaissance HTML / CSS2, on s’en sort sans problème.

Du coup j’ai ajouté à partir du XML de mon CV, 3 cibles au travers de XSL-FO :

J’ai essayé de me rapprocher le plus possible du rendu HResume HTML, mais sans les possibilités CSS3 (l’ombre du texte).

Il faudrait que je documente un peu ma machine de génération, peut être pour vous, mais surtout pour moi ^^.

Comment bloquer DropBox ?

Aujourd’hui de nombreuses solutions de stockage sur le « cloud », sont disponibles cependant elles provoquent des problèmes de sécurité liés au fait qu’il passe les firewalls au travers du port HTTPS (443/TCP).

Il est tout à fait possible de bloquer Dropbox, si vous avez (la chance) d’avoir un firewall DPI (Deep Packet Inspection) qui va réussir à lire la payload, cependant ce n’est pas toujours le cas avec ISA Server, ou autres soft firewalls.

Voici comment on peut limiter ou stopper l’activité de DropBox.

Un petit dig pour obtenir des informations sur le domaine :

zenithar:~/ $ dig +short dropbox.com
208.43.202.53
208.43.202.50
zenithar:~/ $

On remarque que les synchronisations sont faites sur un range d’ip 208.43.202.0/24, de ce fait il suffit d’ajouter une règle FW :

DROP FROM lan TO 208.43.202.0/24 ON TCP 443
ACCEPT FROM lan TO 208.43.202.0/24 ON TCP 80 # Si vous souhaitez autoriser le traffic via le site.

De rien !

Comment injecter jQuery dans la page courante ?

Je suis en pleine découverte de Node.JS, MongoDB et tout. Je manipule forcément du Javascript, et dans certains cas il manque les fonctionnalités de son framework préféré pour utiliser un service REST par exemple.

Voici une petite astuce, permettant d’injecter un fichier JS dans le DOM de la page.

javascript:void((function(){
    var s=document.createElement('script');
    s.setAttribute('src','http://ajax.googleapis.com/ajax/libs/jquery/1.6.1/jquery.js');
    document.body.appendChild(s);
    void(s);
})())

Bookmarklet

Il suffit de déplacer ce lien dans votre barre des signets, de ce fait lorsque vous cliquerez dessus le code JS sera executé, et injectera dans mon cas jQuery.

Petites mises à jour

Capture d’écran 2011 05 14 à 13.32.30 300x217 Petites mises à jour

  • Mise à jour du CV
  • Nouveau point d’entrée : http://zenithar.org
  • Travaux sur le référencement pour fusionner mes « deux identités numériques »

ZeroMQ, ça roxe du poney !

Voici un broker peu traditionnel, car ils sont souvent distribués sous la forme d’une application complète (ActiveMQ, RabbitMQ, etc.), ici il s’agit d’une librairie C (~2Mo) LGPL et il existe plus d’une vingtaine de bindings (C++, Java, Ruby, Node.JS, …).

Je vous invite à regarder les présentations à cette adresse : Read the manual

Il faut savoir qu’il est possible d’implémenter plus d’une dizaine de topologies différentes : REQ/REPL, PUB/SUB, etc… mais aussi il est possible de tout mélanger pour obtenir des topologies personnalisées. Ce que j’aime c’est son utilisation, il n’y a pas de fichiers de configurations XML, YAML, ou autres, que neni, du code … simple et efficace.

Voici un exemple de serveur en C++ :

#include <zmq.hpp>
#include <string>
#include <iostream>
#include <unistd.h>

static std::string s_recv (zmq::socket_t & socket) {
  zmq::message_t message;
  socket.recv(&message);

  return std::string(static_cast<char*>(message.data()), message.size());
}

int main() {
  int major, minor, patch;

  zmq::context_t context(1);
  zmq::socket_t socket (context, ZMQ_REP);

  socket.bind("tcp://*:5555");

  zmq::version(&major,&minor,&patch);
  std::cout << "* Current 0MQ version is " << major << "." << minor << "." << patch << std::endl;
  std::cout << "* Listening on *:5555" << std::endl;

  while(true) {
    zmq::message_t request;

    std::string msg = s_recv(socket);
    std::cout << " Received : [" << msg << "]" << std::endl;

    sleep(1);

    zmq::message_t reply(5);
    memcpy ((void *) reply.data (), "World", 5);
    socket.send(reply);
  }
  return 0;
}

Pour compiler l’exemple, voici la ligne de commande :

zenithar:test-zmq/ $ g++ main.cpp -I/opt/zmq/include -L/opt/zmq/lib -lzmq -o main<br />

Et un client en python :

>>> import zmq
>>> context = zmq.Context()
>>> socket = context.socket(zmq.REQ)
>>> socket.connect("tcp://localhost:5555")
>>> a = {}
>>> a["toto"] = "fait du vélo"
>>> message = socket.send_json(a)
>>> msg = socket.recv()
>>> msg
'World'
>>>

On verra apparaitre coté serveur :

zenithar:test-zmq/ $ LD_LIBRARY_PATH=/opt/zmq/lib ./main
* Current 0MQ version is 2.1.7
* Listening on *:5555
 Received : [{"toto":"fait du v\u00e9lo"}]

Quelles sont les cas d’utilisations d’un tel système ?

  • La programmation distribuée
  • Le modèle Acteur et Message(s)
  • L’utilisation de plusieurs technologies différentes (C/C++, Java, etc.)

Je ne vais pas lister tous les cas d’utilisations, je vous laisse découvrir par vous même les possibilités d’un tel système.

A titre d’exemple, je peux citer le projet Depth.JS, qui utilise ZMQ comme broker entre l’analyse via OpenCV de l’image du Kinect et un serveur Web Python (Tornado) pour rallier via WebSockets le navigateur.

Alternatives :

Pourquoi je n’utiliserai plus Struts 2 à l’avenir …

 Pourquoi je nutiliserai plus Struts 2 à lavenir ...
Voila ça fait 2 ans que je l’utilise et que je cherche à le mettre à la porte !
Toi développeur, je te déconseille fortement ce framework Web dit MVC … Parce que c’est un mensonge . Surtout si comme moi tu viens du monde RoR / Node.JS, oublies-le ! Pauvre fou !

C’est un framework Web 2.0 qui n’a que de 2.0 sa version de Struts.

Voici une liste de principaux défauts :

  • Niveau documentation c’est le gros bordel, pour trouver de la documentation à jour c’est un enfer
  • Il existe de nombreux plugins qui ne font pas partie du processus de développement global donc attention en les utilisant vous pouvez vous retrouver avec des problèmes de versions : exemple du plugin dojo qui est basé sur une version 0.4.3 de Dojo, le binding n’est pas complet en plus.
  • Au final, on apprend plus à contourner les problèmes, qu’a utiliser réellement ce framework.
  • Il a un esprit trop vieux, trop lourd : je dois souvent contourner la majorité des fonctionnalités (intercepteurs) pour gagner en performance.
  • Au final, on en vient à tout faire soit même en ce contentant du minimum qu’offre le framework.

Qualités :

  • heu ….

Je sais bien que ce genre de projet est piloté par la communauté, mais encore une fois attention en choisissant des frameworks, veillez bien à observer les indicateurs fondamentaux :

  • l’activité du projet : depuis j’ai tendance à courir devant un projet qui n’a pas d’activité pendant plus d’1 an.
  • la documentation
  • la communication
  • la testabilité (pour certains c’est pas évident)

Je ne vais pas conseiller d’autres frameworks Web, parce que ce n’est pas le but de ce post et puis il pourrait très bien ne pas plaire à d’autres comme moi je n’aime pas Struts.

Je suis biensur prêt à recevoir des exemples d’expériences heureuses avec Struts ^^.

Access control Allow Origin Servlet Filter && JSONP

Voici comment ajouter l’entête HTTP Access-control-allow-origin, bien connu des utilisateurs de JSON, AMF ou tout simplement de service REST.

package org.zenithar.servlet.filters;

import java.io.IOException;
import javax.servlet.Filter;
import javax.servlet.FilterChain;
import javax.servlet.FilterConfig;
import javax.servlet.ServletException;
import javax.servlet.ServletOutputStream;
import javax.servlet.ServletRequest;
import javax.servlet.ServletResponse;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;

/**
 * Add JSONP Support to enunciate.
 *
 * @author Thibault NORMAND
 *
 */
public class JsonpFilter implements Filter {

    private String functionName;

    @Override
    public void destroy() {

    }

    @Override
    public void doFilter(ServletRequest request, ServletResponse servletResponse,
                         FilterChain chain) throws IOException, ServletException {

        if (!(request instanceof HttpServletRequest)) {
            throw new ServletException("This filter can "
                                       + " only process HttpServletRequest requests");
        }

        HttpServletRequest httpRequest = (HttpServletRequest) request;
        HttpServletResponse response = (HttpServletResponse) servletResponse;

        if (isJSONPRequest(httpRequest)) {
            ServletOutputStream out = response.getOutputStream();

            out.println(getCallbackMethod(httpRequest) + "(");
            chain.doFilter(request, response);
            out.println(");");

            response.setContentType("text/javascript");
        } else {
            response.addHeader("Access-Control-Allow-Origin", "*");
            chain.doFilter(request, response);
        }

    }

    @Override
    public void init(FilterConfig filterConfig) throws ServletException {
        this.functionName = filterConfig.getInitParameter("encoding");
        if(this.functionName == null || this.functionName.length() <= 0) {
            this.functionName = "callback";
        }
    }

    private String getCallbackMethod(HttpServletRequest httpRequest) {
        return httpRequest.getParameter(this.functionName);
    }

    private boolean isJSONPRequest(HttpServletRequest httpRequest) {
        String callbackMethod = getCallbackMethod(httpRequest);
        return (callbackMethod != null && callbackMethod.length() > 0);
    }

}

Exemple de configuration de votre fichier web.xml

<?xml version="1.0" encoding="UTF-8"?>
<web-app id="dataservices" xmlns="http://java.sun.com/xml/ns/javaee"
	xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
	xsi:schemaLocation="http://java.sun.com/xml/ns/javaee http://java.sun.com/xml/ns/javaee/web-app_2_5.xsd"
	version="2.5">

	<display-name>DataServices</display-name>

	<filter>
		<filter-name>JSONPRequestFilter</filter-name>
		<filter-class>org.zenithar.servlet.filters.JsonpFilter</filter-class>
		<init-param>
			<param-name>functionName</param-name>
			<param-value>callback</param-value>
		</init-param>
	</filter>

	<filter-mapping>
		<filter-name>JSONPRequestFilter</filter-name>
		<url-pattern>/json/*</url-pattern>
	</filter-mapping>
</web-app>

Et voila, bon code !
[ENUNCIATE-482]

Page 1 sur 28123451020Dernière page »