Je vais donc vous présenter la méthode permettant de générer le bouton Paypal avec un cryptage SSL des données du formulaire vous garantissant un paiement sécurisé de bout en bout… Attention tout de même cette méthode n’est pas à la portée de tout le monde car il y a certaines contraintes techniques.

Comme je le disais il existe des contraintes techniques et votre environnement doit répondre aux besoins suivants :

• Un accès à la fonction exec de PHP (exit si votre environnement est configuré en safe_mode à on) ou équivalent.
• Avoir un accès SSH en ligne de commande (Pour pouvoir générer les certificats SSL, même si je pense qu’ils peuvent être générés sur votre machine et envoyés ensuite sur votre serveur)
• Avoir OpenSSL d’installé sur le serveur

Etape 1 – Génération des certificats SSL

Connectez vous en SSH sur votre serveur. Si OpenSSL n’est pas installé sur celui-ci, installez le avec cette commande (si vous êtes sous Debian) :

apt-get install openssl

Si vous n’avez pas d’accès à SSH vous pouvez toujours installer OpenSSl sur votre poste sous Windows avec les binaires disponibles ici.

NB: Dans la suite de l’article je n’expliquerais pas les commandes sous Windows mais normalement il suffira de vous placer dans le répertoire où l’exécutable OpenSSL.exe est situé et de remplacer les commandes « openssl » par « openssl.exe ».

Pour commencer mettez vous dans un répertoire disponible par FTP (Il faudra par la suite télécharger un certificat pour l’envoyer à Paypal). Ensuite tapez cette commande pour générer la clé privée :

openssl genrsa -out clepriv.pem 1024

Puis cette commande pour générer le certificat publique :

openssl req -new -key clepriv.pem -x509 -days 365 -out certpub.pem

Remplissez les informations demandées (Pays, Email etc…).

Note importante : Le certificat sera ici valable 1 an, il faudra donc penser que dans un an vous devrez re-générer ce certificat ! Vous pouvez augmenter la durée de vie de celui-ci mais ce n’est pas particulièrement recommandé.

Etape 2 – Envoyer le certificat publique à Paypal et télécharger le certificat publique de Paypal

Maintenant il faut envoyer le certificat publique de votre site à Paypal (certpub.pem) et télécharger le certificat publique de Paypal. Pour se faire connectez vous sur votre compte Paypal et allez dans :

• Mon Compte =>  Préférences => Plus d’Options => Certificats de cryptage pour site marchand (colonne de droite, en bas)

Commencez par télécharger le certificat publique de Paypal en cliquant sur le bouton « Télécharger ». Vous aurez un fichier qui se nomme paypal_cert_pem.txt, renommez le en paypal_cert.pem.

En bas de page, dans la partie « Vos certificats publics » cliquez sur le bouton « Ajouter » et sélectionnez le fichier certpub.pem que vous avez précédemment généré. Vous reviendrez ensuite sur la page de gestion des certificats et vous devriez voir apparaitre une ligne dans le tableau du bas avec comme informations l’ID du certificat, l’autorité de certification (correspondant aux informations saisies lors de la génération de votre certificat publique) et la date d’expiration de celui-ci. Noter dans un coin l’ID du certificat indiqué il servira par la suite.

A cette étape vous aurez donc en votre possession trois fichiers :

• certpub.pem
• clepriv.pem
• paypal_cert.pem

Etape 3 – Mise en place de la génération du bouton en PHP

Tout d’abord placez les trois fichiers pem dans un répertoire de votre serveur inaccessible par le web, pour être plus explicite il doit être en dehors de la racine HTTP de votre serveur mais il doit toujours être accessible par PHP. Si l’option open_base_dir est active sur votre configuration PHP ajoutez ce répertoire pour que PHP puisse y accéder. Si vous ne pouvez pas modifier cette configuration, vous pouvez éventuellement placer les fichiers dans un répertoire de votre site mais vous devrez mettre un .htaccess empêchant l’accès à ces fichiers. Votre .htaccess ressemblera à ceci :

Options -Indexes
<Files ~ "\.(pem)$">
 	order deny,allow
 	deny from all
</Files>

Options -Indexes

A noter que pour un serveur Apache supérieur à la version 1.3 il vaut mieux utiliser :

Options -Indexes
<FilesMatch "\.(pem)$">
 	order deny,allow
 	deny from all
</FilesMatch>

Maintenant il faut générer le bouton en php, pour faire ceci je vais vous fournir une petite classe PHP5 vous permettant de vous simplifier la vie. Créez un fichier qui se nomme PaypalCrypt.class.php et mettez ceci dedans :

<?php
 
class PaypalCrypt{
 
    private $privateKey = '';
    private $publicKey = '';
    private $paypalKey = '';
    private $pathOpenSSL = '/usr/bin/openssl';
    private $data = array(
        'bn' => 'Boutique_BuyNow_WPS_FR',
        'cmd' => '_xclick',
        'lc' => 'FR',
        'custom' => '',
        'invoice' => '',
        'currency_code' => 'EUR',
        'charset' => 'UTF-8', //Définit le charset utilisé sur le site
        'no_shipping' => '1'
    );
 
    public function __construct(){
        // Nothing
    }
 
    public function addData($key, $data){
        $this->data[$key] = $data;
        return $this;
    }
 
    public function setPrivateKey($privateKey){
        $this->privateKey = $privateKey;
        return $this;
    }
 
    public function setPublicKey($publicKey){
        $this->publicKey = $publicKey;
        return $this;
    }
 
    public function setPaypalKey($paypalKey){
        $this->paypalKey = $paypalKey;
        return $this;
    }
 
    public function getCryptedData(){
        if (!file_exists($this->privateKey))
            throw new Exception('ERROR: MY_KEY_FILE '.$this->privateKey.' not found');
        if (!file_exists($this->publicKey))
            throw new Exception('ERROR: MY_CERT_FILE '.$this->publicKey.' not found');
        if (!file_exists($this->paypalKey))
            throw new Exception('ERROR: PAYPAL_CERT_FILE '.$this->paypalKey.' not found');
 
        $openssl_cmd = "$this->pathOpenSSL  smime -sign -signer $this->publicKey  -inkey $this->privateKey ".
                "-outform der -nodetach -binary| $this->pathOpenSSL smime -encrypt ".
                "-des3 -binary -outform pem $this->paypalKey";
 
        $descriptors = array(
            0 => array("pipe", "r"),
            1 => array("pipe", "w"),
        );
 
        $process = proc_open($openssl_cmd, $descriptors, $pipes);
        if (is_resource($process)) {
            foreach ($this->data as $key => &$value)
                if ($value != "")
                    fwrite($pipes[0], "$key=$value\n");
            fflush($pipes[0]);
            fclose($pipes[0]);
 
            $output = "";
            while (!feof($pipes[1]))
                $output .= fgets($pipes[1]);
 
            fclose($pipes[1]);
            $return_value = proc_close($process);
            return $output;
        }
        throw new Exception('ERROR: encryption failed');
    }
 
    public function setOpenSSLPath($path){
        if(!file_exists($path))
            throw new Exception('OpenSSLPath "'.$path.'" don\'t exists');
        $this->pathOpenSSL = $path;
    }
}
?>

Cette classe est au final assez simple, elle permet de définir les certificats à utiliser, d’insérer des valeurs avec la méthode addData (Suivant la documentation Paypal pour les paramètres possibles) et de générer la chaîne cryptée via la méthode getCryptedData. Quelques informations sont prédéfinies dans la propriété $data de l’objet, se sont celles qui ne varient pas. Par défaut le chemin vers l’exécutable OpenSSL sur le serveur est /usr/bin/openssl (valable sous Debian), cette valeur peut être modifiée dans le constructeur de l’objet.

Voici donc un exemple d’utilisation pour la vente d’un objet « Boite à meuh » au prix de 10€ sur le compte Paypal « toto@toto.com » :

<?php
require('/chemin/vers/PaypalCrypt.class.php');
// Initialisation cryptage Paypal
$paypalCrypt = new PaypalCrypt();
$paypalCrypt->setPrivateKey('/chemin/vers/clepriv.pem');
$paypalCrypt->setPublicKey('/chemin/vers/certpub.pem');
$paypalCrypt->setPaypalKey('/chemin/vers/cert/paypal_cert.pem');
$paypalCrypt->addData('cert_id','id_certificat_fourni_par_paypal')
            ->addData('business','toto@toto.com')
            ->addData('no_note','1')
            ->addData('shipping','0')
            ->addData('tax','0')
            ->addData('rm','2')
            ->addData('cbt','Retour sur la boutique')
            ->addData('custom','id_membre')
            ->addData('return','http://mon_site.com/return.php')
            ->addData('cancel_return','http://mon_site.com/cancel.php')
            ->addData('notify_url','http://mon_site.com/ipn.php')
            ->addData('amount','10')
            ->addData('item_name', 'Boite à meuh')
            ->addData('item_number', 'identifiant_produit');
$data = $paypalCrypt->getCryptedData();
?>
<form action="https://www.paypal.com/fr/cgi-bin/webscr" method="post">
    <input type="hidden" name="cmd" value="_s-xclick">
    <input type="hidden" name="encrypted" value="<?php echo $data?>"/>
    <input type="submit" value="Commander" class="input_button">
</form>

Pour l’information cert_id il faut bien entendu fournir la valeur que Paypal vous a donné à l’étape 2 (Oui oui j’ai écrit qu’il fallait le noter ).

Et voilà vous avez un joli bouton Paypal crypté en SSL pour faire vos demandes de paiement. Pour connaître toutes les valeurs possibles que vous pouvez ajouter je vous laisse regarder la documentation Paypal. N’oubliez pas non plus que cela ne vous dispense pas de faire toutes les vérifications nécessaires lors du feedback de Paypal (IPN) pour vérifier la cohérence entre la commande passée chez vous et le paiement que vous avez reçu.

MAJ 30/08/2011: Changement de méthode pour l’appel à OpenSSL pour maximiser la compatibilité avec les différentes plateformes (Windows).

Il existe plusieurs fonctions intégrées à PHP permettant de passer un nombre d’une base à une autre, la plus généraliste étant base_convert. Vous me direz que cette fonction suffit dans la plupart des cas, oui mais le problème c’est qu’on ne peut dépasser la base 36… On va donc faire un petit rappel de ce qu’est une base, et expliciter pourquoi on peut avoir besoin de base « personnalisée » supérieur à 36.

Qu’est ce qu’une base ?

Une base permet de représenter un nombre et il y en a une que l’on utilise tous les jours : La base 10. Dans la base 10 c’est simple, chaque chiffre représente lui même c’est la base permettant de faire le plus facilement des calculs sur des nombres (du point de vue de l’humain, pas de celui de la machine ). Pour être un peu verbeux un nombre en base 10 est un somme de puissance de 10.  En changeant de base, nous changeons la représentation de ce nombre mais pas sa valeur. Alors pourquoi on se torture l’esprit à vouloir représenter un nombre dans d’autres bases ? La première raison est l’informatique ! car une machine ne comprends pas les nombres tel que nous les assimilons en base 10. C’est pour cela que ce nombre est représenté en base 2 pour que la machine puisse faire des calculs sur celui-ci car elle ne sait faire qu’une seule chose : Ouvrir ou fermer des circuits électriques soit 1 ou 0. Voilà pour la petite histoire, maintenant vous allez me dire, pourquoi vouloir représenter un nombre dans une base plus grande que la base 10 ? Pour réduire la taille de la représentation de ce nombre pardi ! En effet, plus votre base est élevée et moins il vous faudra de symboles pour représenter un même nombre. On parle en effet de « symbole » car au dessus de la base 10 les puissances vont être représentées par un symbole, soit des lettres et bien plus encore.

Donc, lorsque l’on veut réduire au maximum la représentation d’un nombre une base 36 c’est un peu limitant dès que l’un atteint des nombres assez grands. Par exemple, 1 milliard en base 36 s’écrit GJDGXS soit 6 caractères au lieu de 10 en base 10… peut mieux faire !

Algorithme de changement de base personnalisé

Voici donc une classe PHP5 avec l’algorithme vous permettant de convertir un nombre d’une base x à une base y. Elle permet, avec sa configuration de base, de convertir un nombre de la base 2 à la base 64, mais vous pouvez aller aussi loin que vous le souhaitez en ajoutant autant de caractères que vous le voulez pour créer des bases de plus en plus grandes.

<?php
 
class BaseConverter {
 
    protected $baseChars = array();
    protected $maxBase = 10;
 
    /**
     * Construct with a specified base or not
     * @param Array $base
     */
    public function __construct($base = null) {
        if($base !== null)
            $this->baseChars = $base;
        else
            $this->baseChars = array_merge(range(0, 9), range('A', 'Z'), range('a', 'z'), array('-', '_'));
        $this->maxBase = count($this->baseChars);
    }
 
    /**
     * Convert a number from a base to an another base
     * @param mixed $number The representation of the number on the current base
     * @param int $fromBase The base of the number to convert (10 by default)
     * @param int $toBase The base to convert the number
     * @return string
     */
    public function convert($number, $fromBase = 10, $toBase = 64) {
        if ($toBase < 2)
            throw new Exception('Min value of toBase are 2');
 
        if ($fromBase < 2)
            throw new Exception('Min value of fromBase are 2');
 
        if ($toBase > $this->maxBase)
            throw new Exception('Max value of toBase are ' . $this->maxBase);
 
        if ($fromBase > $this->maxBase)
            throw new Exception('Max value of fromBase are ' . $this->maxBase);
 
        if ($number != 10)
            $number = (string) $number;
 
        if ($toBase == 10)
            return $this->convertToBase10($number, $fromBase);
 
        if ($fromBase != 10)
            $number = $this->convertToBase10($number, $fromBase);
 
        $datas = array_slice($this->baseChars, 0, $toBase);
 
        $output = '';
        // Calculate value
        while ($number >= $toBase) {
            $output = $datas[$number%$toBase].$output;
            $number = floor($number/$toBase);
        }
        return $datas[$number].$output;
    }
 
    /**
     * Convert a representation of a number to base 10
     * @param string $characters The number to convert
     * @param int $base The base of the number, by default 64
     * @return int
     */
    protected function convertToBase10($characters, $base = 64) {
        if ($base < 2)
            throw new Exception('Min value of base are 2');
 
        if ($base > $this->maxBase)
            throw new Exception('Max value of base are ' . $this->maxBase);
 
        $number = 0;
        $size = strlen($characters);
        $powBase = 1;
        for ($p = $size - 1; $p >= 0; $p--) {
            $char = $characters[$p];
            if (is_numeric($char))
                $char = (int) $char;
            $number += array_search($char, $this->baseChars, true) * $powBase;
            $powBase *= $base;
        }
        return $number;
    }
 
}
 
?>

Voilà pour l’algorithme de base, et un exemple d’utilisation :

<?php
$conv = new BaseConverter();
echo $conv->convert(1000000000, 10, 36);
// Affichera GJDGXS
?>

Voilà avec ceci vous pouvez développer un raccourcisseur d’urls (Pour ceux qui n’avaient pas encore saisi l’astuce pour ce type de service ) ou encore masquer (de façon basique mais c’est mieux que rien) les identifiants numérique que l’on passe parfois dans les URL… Les applicatifs ne manquent pas, je laisse donc libre cours à votre imagination !

Démission, Auto-Entrepreneur, Nouvel employeur… Surbooking !

Cela résume un peu la situation du point de vu professionnel, mouvementé… Fin décembre de l’année dernière, et après 2 ans et demie de bons et loyaux services je décide de quitter mon précédent employeur (Pubeco) pour voir d’autres horizons. Après plusieurs entretiens dans quelques boites assez connues dans le web (Pixmania, Twenga, Oxygem etc) je décide de signer pour un poste à Paris 2ième chez Maximiles dans le pôle R&D. Je devais commencer mi-janvier, branle bas de combat, je déménage quelques affaires chez un ami qui m’héberge pour commencer, en laissant un peu sous le choque ma moitié… Je suis resté quelques jours pour découvrir un peu Paris afin de tenter de m’acclimater à cette « ville ». Au final j’ai fait volte face la veille de commencer, décidément la province me manquait trop. De retour à Valenciennes je commence à faire jouer quelques contacts puisque j’avais prévu un peu le coup en créant mon statut d’auto-entrepreneur à partir du 1er Janvier 2010. J’ai donc pu bricoler un peu les trois premiers mois, avant qu’une entreprise Lilloise me rappelle pour savoir si mon travail à Paris me convenait. J’explique la situation, et donc entretient le lendemain, on m’expose le nouveau projet de l’entreprise, projet qui me plait. Deuxième appel le lendemain pour confirmer mon embauche et démarrage le 1er Mars (Oui cela a été plutôt rapide). En parallèle je garde mon statut d’auto-entrepreneur me permettant de faire quelques prestations, en travaillant beaucoup avec une agence parisienne (Celaneo), en fait c’est mon plus gros client sur cette année 2010.

Les projets EXinsidePHP

Du côtés de ce site cela a beaucoup bougé à vrai dire. La première résolution a été de me re-concentrer sur ce que je savais faire, et ce que je pouvais faire sur ce site. J’ai donc décidé de passer d’un site fait à main, avec pas mal de choses inutiles, à un blog pour recentrer ce site sur l’information et des choses qui apportent vraiment quelque chose. Aujourd’hui EXinsidePHP est un blog ou je partage des informations liées aux web, au développement suite à mes diverses expériences en espérant que cela soit utile pour quelques personnes. Mais ce n’est pas tout, je n’ai pas pour autant oublié l’aspect Open Source qui a fait ce que je suis aujourd’hui. Il y avait 2 projets, un premier qui est EXmail, qui malgré le poids des années est toujours relativement utilisé et semble utile à pas mal de personnes (Même s’il y a bien des choses à revoir dessus). Il reste tout de même un mini-projet secondaire, pour l’instant je le maintiens en vie… Le deuxième projet existant était EXlor, une application de livre d’or… J’avais commencé une réécriture mais elle s’est un peu enlisée, tout comme l’intérêt aujourd’hui pour les livres d’or… De ce fait, je l’ai abandonné, il n’avait plus vraiment de raison d’être ! Il y avait enfin un pseudo troisième projet, un peu « bâtard », qui est ExFramework. Alors lui il est né un peu n’importe comment, il a traversé les années en s’étoffant en le définissant vulgairement « framework », c’était plus, dans sa première version, un ensemble de tout et de rien sans réelle cohérence. A partir de là je me suis dit on va repartir de zéro, « from scratch » comme on dit, avec un réel objectif de faire un Framework correspondant à ma vision de certaines choses, me permettant avant tout de faire mes petits projets avec mes petits outils que je maitrise. La version 2 est donc actuellement en plein chantier sans prétention aucune, et je n’affirmerais pas qu’il est parfait, rien n’est parfait Au final si ce projet est suivi par la suite tant mieux, sinon tant pis, il me servira à moi ne vous inquiétez pas. J’ai d’ailleurs mis en place un tracker et un websvn me permettant d’organiser cela un peu mieux (Tout n’est pas encore totalement configuré, j’ai déjà eu bien du mal à trouver des outils corrects…). Aujourd’hui je me concentre surtout sur ExFramework, et j’ai malheureusement assez peu de temps pour faire des articles sur le blog mais quand j’ai un petit moment j’essaye de le faire.

OpenMailing

Hé oui, même si je n’en parle pas (comme beaucoup de choses en fait), ce projet est très loin d’être abandonné, il murie, il s’affine. C’est un projet auquel je tiens beaucoup et auquel j’y crois beaucoup aussi quant à son potentiel. Quelques personnes me suivent à ce niveau, beaucoup de discutions… Au final un business plan a été rédigé (Il va sans doute être un peu révisé) afin d’avoir les idées claires, de bien définir les tenants et les aboutissants. Qui dit business plan, dit recherche de financement. Nous avançons donc de ce côté, avec un peu de chance cette aventure démarrera officiellement l’année prochaine, comme quoi en 2011 ça risque de bouger aussi ! D’ailleurs si vous avez quelques pécules et que vous ne savez qu’en faire, dites le moi :p J’en dirais plus le moment venu…

Personnel

Ça c’est le moment que vous allez adorer en racontant un peu ma vie, je vais être assez bref quand même. Il y a eu des bas, mais beaucoup de haut quand même. Cette année j’ai découvert que je n’étais pas issu de la divine fécondation et que j’avais ce que vous appelez « un père ». Au final je l’ai vu une fois (de trop ?), c’est déjà pas mal… Un peu plus réjouissant, nous avons fêté avec ma moitié notre première bougie ensemble, en cadeau nous avons emménagé ensemble dans un appartement à Valenciennes. Et comme j’aime faire les choses en grand, on s’est dit qu’à noël il fallait marquer le coup, nous avons donc acheté une maison en VEFA, à Valenciennes toujours et bien entendu. L’offre de prêt vient d’être renvoyée, elle sera livrée courant janvier si tout va bien. Sinon à part ça… Ha si, mon chat vient de se faire castrer

Conclusion

2010 a été un excellent cru, sur tous les niveaux, et vu comme c’est parti… En 2011 cela risque d’être encore plus mouvementé ! Allé je vous souhaite à tous un bon réveillon de fin d’année 2010, mais avec modération bien entendu… Ou pas !

Les boutons d'upload sur les différents navigateurs...

L’élément html input file est sans doute le plus difficile à mettre en forme, en fait (hors HTML5) c’est tout simplement impossible avec seulement des feuilles de style. Une alternative, dans certains cas, est de faire un upload progressif avec Flash mais dans ce cadre nous n’avons plus à proprement parler de champ d’upload de fichier dans le formulaire…

Pourtant il existe bel et bien une solution, avec un peu d’astuce et de javascript (dans ce tutoriel avec Jquery) je vais vous montrer comment mettre en page cet élément html afin d’avoir une intégration cohérente et identique avec tous les navigateurs (et c’est même compatible avec Internet Explorer 6 !).

Tout d’abord il nous faut un objectif, qui sera par exemple l’objectif graphique dicté par le psd du graphiste, dans ce tutoriel nous voulons donc que le bouton d’upload soit comme ceci sur tous les navigateurs :

Et voici la liste des navigateurs avec lesquels nous voulons que cela fonctionne :

• Internet Explorer 6,7,8
• Firefox 2,3
• Google Chrome
• Opera 10
• Safari

Soit une belle petite collection qui peut faire peur au premier abord… Commençons par l’aspect théorique, nous allons déjà définir des styles pour mettre en page individuellement un input text et un bouton, ce qui donne assez simplement ceci en CSS :

div.fakefile input.input_background{
    font-size: 12px;
    line-height: 12px;
    background:url(img/input.gif) no-repeat top left;
    height:16px;
    padding:7px 0 5px 4px;
    _padding:9px 0 3px 4px;
    *padding:9px 0 3px 4px;
    width:252px;
    border: medium none;
    margin: 0;
    display:block;
}
div.fakefile input.input_button{
    background:url(img/upload.gif) no-repeat top left;
    height:25px;
    width:88px;
    border: medium none;
    margin: 0;
    display:block;
    float:left;
    margin-top:1px;
    margin-left:5px;
}

Maintenant que c’est fait, comment appliquer cela au champ d’upload ? En fait nous allons leurrer un peu les navigateurs en jouant notamment sur le z-index. L’idée est ici d’afficher réellement un input text, un bouton juste à coté, et d’avoir le champ d’upload « par dessus » en invisible permettant de garder l’événement de sélection du fichier en jouant sur les z-index. En HTML et CSS pure cela donne quelque chose comme ceci :

<p>Sélectionner le fichier à envoyer :</p>
<div class="fileinputs">
    <input class="file hidden" name="file" type="file">
    <div class="fakefile">
        <input class="input_background" readonly="readonly" type="text">
        <input class="input_button" type="button">
    </div>
</div>

Et la feuille de style correspondante :

div.fileinputs {
    position: relative;
    height: 30px;
    width: 350px;
}
 
div.fileinputs input.file {
    margin-top:5px;
    _margin-top: 3px;
    *margin-top: 3px;
    width: 350px;
    height:25px;
}
 
div.fileinputs input.file.hidden {
    position: relative;
    text-align: right;
    -moz-opacity:0 ;
    filter:alpha(opacity: 0);
    opacity: 0;
    z-index: 2;
}
 
div.fakefile {
    position: absolute;
    top: 0;
    left: 0px;
    width: 370px;
    padding: 0;
    margin: 0;
    z-index: 1;
    line-height: 90%;
}
div.fakefile input {
    margin-bottom: 5px;
    margin-left: 0;
    margin-right:5px;
    float:left;
}
 
div.fakefile input.input_background{
    font-size: 12px;
    line-height: 12px;
    background:url(img/input.gif) no-repeat top left;
    height:16px;
    padding:7px 0 5px 4px;
    _padding:9px 0 3px 4px;
    *padding:9px 0 3px 4px;
    width:252px;
    border: medium none;
    margin: 0;
    display:block;
}
div.fakefile input.input_button{
    background:url(img/upload.gif) no-repeat top left;
    height:25px;
    width:88px;
    border: medium none;
    margin: 0;
    display:block;
    float:left;
    margin-top:1px;
    margin-left:5px;
}

Avec ce code nous avons presque ce que nous souhaitons, la mise en page est conforme et lorsque l’on clique sur le bouton la fenêtre de sélection de fichier s’ouvre. Par contre lorsque l’on sélectionne un fichier, le champ texte ne se rempli pas avec le nom du fichier sélectionné. C’est normal, c’est le champ input file qui reçoit cette information et comme il est invisible… Rien ne s’affiche. C’est ici que Javascript va intervenir, nous allons « binder » l’événement onChange et lors de celui-ci nous allons mettre la valeur du champ input file, dans le champ input text. Nous allons en profiter pour alléger le code HTML en générant la partie « mise en page » avec le Javascript.

Pour le code HTML simplifié cela donne ceci :

<p>Sélectionner le fichier à envoyer :</p>
<div class="fileinputs">
    <input class="file" name="file" type="file">
</div>

Et voici le code javascript avec Jquery :

function initFileUploads() {
    $('input[type=file]').after(
        $('<div></div>').addClass('fakefile').append(
            $('<input/>').attr('type','text').attr('readonly',true).addClass('input_background')
        ).append(
            $('<input/>').attr('type','button').addClass('input_button')
        )
    ).addClass('hidden');
 
    $('input[type=file]').change(
        function(){
            $(this).next().find('input[type=text]').val($(this).val());
        }
    );
}
 
$(document).ready(function(){
    initFileUploads()
});

Pour le code CSS cela sera le même que précédemment, voilà c’est terminé. Nous avons rempli notre objectif initial sans remettre en cause l’intégration HTML « classique », tout en ayant une solution graphique uniforme avec tous les navigateurs et ceci sans dégrader la fonction initiale du bouton d’upload.

Vous pouvez tester l’exemple complet sur cette page : Exemple intégration bouton d’upload

Et vous pouvez télécharger celui-ci ici :

Exemple intégration bouton d’upload
Téléchargé 408 fois

Version BETA 3 :

- Ajout PHPDocs sur les méthodes de la class Exmail
- Modification de la méthode de validation des emails
- Modification de la méthode isEmpty
- Ajout de la méthode cleanMagicQuote permettant la compatibilité avec les serveurs avec les magic_quotes activées
- Compatibilité (suppression Warning) avec PHP 5.3

Téléchargement d’EXmail

Webmaster Tools, pour les intimes, a subit une petite mise à jour, à la limite du visible il faut bien l’avouer… Mais une mise à jour plutôt intéressante dont je me suis rendu compte aujourd’hui. Elle se situe dans Votre site sur le Web, puis Mots clés. Vous voyez ? Non ? Regardez bien votre liste de mots clés… Désormais Google vous donne les mots clés et leurs variantes qu’il a reconnu sur votre site et les rassemble. L’information qui est intéressante (mais que l’on savait déjà) c’est que Google rassemble en fait les mots sous des groupes incluant des variantes. Mais surtout on peut vérifier qu’il a bien reconnu et rassembler certains mots clés sur votre site, intéressant pour suivre notre référencement une fois de plus.

Voilà c’était le micro-article du jour .

Comme vous pouvez le remarquer sur la documentation officielle de PHP vous trouverez ce genre de mention lorsque vous consultez la documentation des fonctions ereg :

Note: preg_match(), qui utilise la syntaxe des expressions rationnelles compatibles PERL, est une alternative plus rapide de ereg()

Notez aussi que vous avez désormais cette mention qui apparait :

Cette fonction est OBSOLETE depuis PHP 5.3.0 et a été SUPPRIMEE depuis PHP 6.0.0. Nous vous encourageons vivement à ne plus l’utiliser.

Alors pourquoi l’utilisation des POSIX est déconseillée, pourquoi depuis PHP 5.3 elles sont devenues obsolètes et enfin pourquoi elles vont être supprimée dans PHP 6 ? La réponse dans la suite de cette article…

Pour faire ce test de performance, on va utiliser le même protocole de test que dans l’article sur la concaténation. Nous allons utiliser sur ce petit test la validation d’une adresse email. Nous étudierons deux cas, le cas ou l’adresse email est bonne et le cas ou elle ne l’est pas. Nous baserons nos tests sur 100 000 itérations pour révéler clairement les différences de performance. Les regex dans les tests seront tirés du très bon site Expreg.

• Cas avec une adresse email correcte

Voici le code que nous allons utiliser pour ce premier test, avec la fonction ereg (POSIX):

<?php
include('Benchmark.class.php');
 
$var = 'info@e-ur-ope.a.n-cards.com';
$perf = new Benchmark();
 
for($i=0;$i<100000;$i++){
    ereg("^[[:alnum:]]([-_.]?[[:alnum:]])*@[[:alnum:]]([-.]?[[:alnum:]])*\.([a-z]{2,4})$",$var);
}
 
$perf->stop();
echo $perf->getStats().' secondes';
?>

Et voici celui pour preg_match (PCRE):

<?php
include('Benchmark.class.php');
 
$var = 'info@e-ur-ope.a.n-cards.com';
$perf = new Benchmark();
 
for($i=0;$i<100000;$i++){
    preg_match('`^[[:alnum:]]([-_.]?[[:alnum:]])*@[[:alnum:]]([-.]?[[:alnum:]])*\.([a-z]{2,4})$`',$var);
}
 
$perf->stop();
echo $perf->getStats().' secondes';
?>

Voici les résultats dans un graphique :

On se rend compte que la fonction ereg est ainsi 38% plus lente que la fonction preg_match sur ce simple test, un écart de performance qui est tout de même assez conséquent et qui commence à confirmer le choix de la team PHP de vouloir supprimer les fonctions POSIX…

• Cas avec une adresse email incorrecte

Nous allons maintenant faire les mêmes tests avec une chaîne invalide qui est :

$var = 'info@e-ur-ope.a.n-cards .com';

Voici les résultats :

On constate ainsi plusieurs choses avec ce graphique, la première c’est que pour l’une ou l’autre des fonctions le temps de réponse est plus court que lors du premier test, ce qui est normal par rapport au fonctionnement d’une expression régulière. Deuxième observation, on  remarque que l’écart de performance est pour ainsi dire identique (37%) que lors du premier test, mais est ce que cet écart est toujours le même avec une chaîne plus longue ? C’est ce que nous allons voir  :

$var = 'une_tr_longu_adresse_email_qui_est_interminable_info@e-ur-ope.a.n-cards .com';

Et voici le résultat :

Vous le voyez vous même… L’écart de performance commence sérieusement à grimper, la fonction ereg est ainsi 73% plus lente que la fonction preg_match, échec et mat !

En conclusion de ce bref test (est-il utile d’en faire plus ?) on remarque bien l’écart important de performance entre les POSIX et les PCRE qui devient d’autant plus important lorsque l’on travaille sur de longues chaînes de caractères mais aussi en fonction de la complexité du masque. L’utilisation des POSIX est donc à bannir de vos scripts et personne ne regrettera le choix de PHP de… L’abandonner !

Pour aller plus loin les expressions régulières sont des fonctions lourdes et je ne saurais trop vous conseiller de ne les utiliser que lorsque vous en avez réellement besoin (cf le bonus ci-dessous).

Bonus: Pour aller plus loin…

Imaginons que vous voulez détecter la présence d’un mot dans une chaîne de caractéres, je remarque souvent que beaucoup utilisent une expression régulière plutôt que strpos. J’ai toujours été partisan d’utiliser strpos dans ce cas de figure car je pense qu’une fonction native dédiée à ce que l’on veut est plus rapide… Voici donc un petit test avec preg_match :

<?php
include('Benchmark.class.php');
 
$var = 'Check this string for finding a GoogleBot !';
$perf = new Benchmark();
 
for($i=0;$i<300000;$i++){
    if(preg_match('`^.*GoogleBot.*$`',$var)){
        // Action
    }
}
 
$perf->stop();
echo $perf->getStats().' secondes';
?>

Et le même avec strpos :

<?php
include('Benchmark.class.php');
 
$var = 'Check this string for finding a GoogleBot !';
$perf = new Benchmark();
 
for($i=0;$i<300000;$i++){
    if(strpos($var,'GoogleBot') !== false){
        // Action
    }
}
 
$perf->stop();
echo $perf->getStats().' secondes';
?>

Ce test consiste simplement à trouver le mot « GoogleBot » dans une chaîne de caractères. Et voici le résultat :

On remarque ici que l’expression régulière est 11% plus lente que la fonction strpos, tout en considérant que plus la chaîne à analyser est longue, plus l’écart sera important. Il est donc préférable dans ce cas d’utiliser strpos plutôt qu’une expression régulière.

Dans le même esprit PHP a introduit récemment les fonctions filter, il est ainsi possible de tester la validité d’une adresse email avec celles-ci. Mais qu’en est il question performance ? Nous allons pour ce faire reprendre les résultats lors de notre premier test avec preg_match et nous allons les confronter avec ce test :

<?php
include('Benchmark.class.php');
 
$var = 'info@e-ur-ope.a.n-cards.com';
$perf = new Benchmark();
 
for($i=0;$i<100000;$i++){
    filter_var($var, FILTER_VALIDATE_EMAIL);
}
 
$perf->stop();
echo $perf->getStats().' secondes';
?>

Voici les résultats :

On se rend malheureusement compte que la fonction filter_var est ainsi environ 10% plus lente que la fonction preg_match… Il y a encore du travail de ce coté, et pour ne pas arranger les choses le filtre FILTER_VALIDATE_EMAIL comporte de nombreux bugs… je vous déconseille donc de l’utiliser à l’heure actuelle et de préférer les expressions régulières.

Version BETA 2.1 :

- Correction dé-sélection des checkboxs lors du succès de l’envoi
- Ajout de la compatibilité avec l’option magic_quote_gpc activée

Téléchargement d’EXmail

C’est ainsi que j’ai découvert le très récent phpMemCacheAdmin dont vous pouvez avoir à aperçu dans le screen ci-joint. Cette application est en PHP est s’installe très simplement, dans mon cas le serveur étant sur la même machine je n’ai même pas eu besoin de le configurer… Vous devrez tout de même penser à mettre un htaccess pour sécuriser l’accès à l’application. Une fois installée vous pouvez ainsi avoir toutes les statistiques de votre serveur memcache, avoir des statistiques en temps réelle mais aussi insérer, supprimer des valeurs dans le cache etc…

Le tout avec un interface claire, un code propre et une utilisation on ne peu plus simple. L’auteur semble être très actif sur le projet qui est peu connu à l’heure actuelle et mérite un peu plus de reconnaissance . Le seul gros manque, à mon goût, est de ne pas avoir accès à une liste des variables actuellement en cache sur le serveur, mis à par ça je vous le recommande chaudement.

Grâce à Google je vais vous partager une petite astuce permettant de gagner 15 à 20% de performances supplémentaires sur Mysql (vérifié), ainsi que pour PHP et Apache (par extension je n’ai pas vérifié avec des benchmarks). En bref, de quoi augmenter de façon significative les temps de réponse de vos pages…

Sachant qu’aujourd’hui Google considère les temps de réponse de vos pages dans son indexation, il est donc important de chercher à les améliorer et donc d’effectuer quelques optimisations de code et de configuration. On utilisera pour se faire la librairie tcmalloc venant des Google Perftools. Cette librairie optimise l’utilisation de malloc() en C/C++ au niveau de la gestion de la mémoire dans un environnement multi-thread.

MAJ: DotDeb nous fourni aujourd’hui tout ce qu’il faut dans leurs dépôts c’est donc désormais bien plus simple pour maintenir cette librairie, procédez donc comme ceci :

Ajoutez (si cela n’est pas déjà fait) les lignes suivantes au fichier sources.list de APT:

nano /etc/apt/sources.list

deb http://packages.dotdeb.org oldstable all
deb-src http://packages.dotdeb.org oldstable all

Remplacez « oldstable » par « stable » si vous utilisez la dernière version de Debian (Squeeze), oldstable n’est valable que pour Debian Lenny.

Ensuite mettez à jour vos listes :

 apt-get update

Si vous avez une erreur du type :

GPG error: http://packages.dotdeb.org oldstable Release: 
The following signatures couldn't be verified because the public key is not available

Exécutez les lignes de commandes suivantes :

gpg --keyserver keys.gnupg.net --recv-key 89DF5277
gpg -a --export 89DF5277 | apt-key add -

Puis installé le paquet désiré :

apt-get install libtcmalloc-minimal0

Maintenant il va falloir modifier les bash de lancement de Mysql et d’Apache comme ceci :

nano /etc/init.d/mysql

Juste après :

 export HOME=/etc/mysql/

Ajoutez :

export LD_PRELOAD="/usr/lib/libtcmalloc_minimal.so.0"<span class="Apple-style-span" style="font-family: 'Segoe UI', Calibri, 'Myriad Pro', Myriad, 'Trebuchet MS', Helvetica, Arial, sans-serif; font-size: 13px; line-height: 19px; white-space: normal;"> </span>

Il vous reste désormais à les relancer :

/etc/init.d/mysql stop
/etc/init.d/mysql start

Question performance j’ai bien noté le gain assez perceptible sous Mysql. Pour Apache je viens de l’intégrer dans l’espoir que PHP, étant en module de celui-ci, en tire parti. Je n’ai pas fait de benchmark donc si vous pouvez tester de votre coté et signaler l’utilité ou non de le mettre sur Apache, n’hésitez pas .

MAJ: N’aillant pas constaté de différence notable il est préférable de ne pas l’ajouter sur Apache, j’ai donc supprimé la partie « Apache » de ce tutoriel.