Vous avez peut-être entendu parler des cookies, mais que sont-ils exactement et que pouvons-nous en faire? Dans ce tutoriel, nous allons nous concentrer sur les bases des cookies et en apprendre davantage sur leurs fonctionnalités dans divers environnements Web et d’applications Web. Nous allons également apprendre à les utiliser dans nos projets PHP et JavaScript, tout en accordant une attention particulière aux problèmes de sécurité pouvant survenir lors de leur utilisation. Après avoir lu ceci, vous aurez acquis les compétences nécessaires pour mettre en place des cookies en toute sécurité dans vos propres applications Web..
La première étape de notre voyage consiste à découvrir ce que sont réellement ces cookies! Même si vous avez déjà travaillé avec eux, vous trouverez peut-être cette partie très utile - alors restez avec moi!
Vous pouvez facilement considérer les cookies comme des fichiers texte, qui sont enregistrés sur votre ordinateur. À la demande d'un serveur Web, votre navigateur crée un tel fichier. Ensuite, le serveur Web peut lire et écrire du contenu depuis et vers ce fichier. Bien que cela semble une fonctionnalité dangereuse - après tout, personne n'aime les autres personnes écrivant des fichiers sur leur ordinateur, quelques restrictions sont en place pour rendre ce processus aussi sûr que possible..
Les cookies ont une date d'expiration. Cette date est définie afin que le navigateur puisse supprimer les anciens cookies lorsqu'ils ne sont plus nécessaires par le serveur Web. Si la date d'expiration est vide, le cookie sera supprimé lors de la fermeture de la connexion avec le serveur. Cela se produit lorsque la fenêtre ou l'onglet du site est fermé par l'utilisateur ou lorsque l'utilisateur ferme l'intégralité du navigateur. Ces cookies, parfois appelés cookies de session, sont principalement utilisés pour stocker des paramètres temporaires..
Voyons à quoi ressemblent ces choses sur le plan technique. Les cookies sont transférés via le protocole HTTP. C'est le protocole utilisé par les navigateurs pour récupérer et envoyer des fichiers au serveur. Lorsqu'un cookie est demandé, il est envoyé au serveur chaque fois qu'un nouvel élément de la page Web est récupéré par le navigateur. Ci-dessous, nous pouvons voir un extrait d'un serveur demandant un nouveau cookie (cet extrait fait partie d'une réponse HTTP)..
Set-Cookie: Nom = données de contenu; expire = ven, 31 décembre 2010 23:59:59 GMT; chemin = /; domaine = .example.net
Maintenant, n'ayez pas peur, c'est très compréhensible.!
Dans la prochaine étape, nous verrons comment ces propriétés peuvent être utilisées dans les langages de programmation.
Les cookies peuvent être créés de nombreuses manières, mais pour les besoins de ce tutoriel, nous allons nous concentrer sur PHP et JavaScript..
La chose la plus importante à retenir lors de la création d’un cookie en PHP est que vous devez définir tous les cookies. avant d'envoyer des données au navigateur. Cela signifie que vous devriez toujours initialiser de nouveaux cookies avant toute sortie. Cela inclut les commandes echo () ou print (), et le ou
Mots clés. Bien sûr, il y a quelques exceptions, mais c'est une règle générale.… // tout le contenu, etc. va ici?>
Cela devrait maintenant sembler familier, sauf pour $ sécurisé et $ httponly. La «sécurisation» consiste à forcer l'envoi du cookie uniquement si une connexion HTTPS a été établie, si elle est définie sur true et doit normalement être définie sur false. "Httponly" rend le cookie uniquement disponible via le protocole HTTP, ce qui signifie que les langages côté client, tels que JavaScript et VBscript, ne peuvent pas accéder au cookie. Cela permet d'éviter des problèmes tels que le Cross Site Scripting, et doit être défini sur true si vous n'avez pas l'intention de modifier les cookies côté client avec un langage tel que JavaScript. En outre, pour éviter les idées fausses, "httponly" ne signifie pas que les cookies ne peuvent pas être envoyés via HTTPS, car ils le peuvent toujours. Cependant, veuillez noter que l'extrait ci-dessus peut être rendu plus petit (et devrait l'être):
Génial! Nous pouvons maintenant créer des cookies, mais nous devons également pouvoir les lire. Heureusement pour nous, PHP rend cela très facile une fois qu'un cookie a déjà été créé. En PHP, il existe une variable d'environnement appelée $ _COOKIE [], qui peut être utilisée pour extraire la valeur du cookie. Pour l'utiliser, il suffit d'insérer le nom du cookie dans les crochets [] comme suit:
Cette variable d'environnement peut être utilisée comme n'importe quelle autre. Tout comme $ _GET [] et $ _POST [], il peut être traité directement comme une variable normale (une fois que vous avez vérifié si le cookie existe bien sûr) si vous voulez.
Si vous souhaitez modifier la date d'expiration, le chemin ou le domaine, vous devez écraser un cookie existant avec setcookie () en utilisant le même nom que le cookie d'origine. Si vous modifiez la date d'expiration pour qu'elle soit dans le passé (time () - 30 * 60 par exemple), le cookie sera supprimé..
Les cookies peuvent également être lus et écrits côté client. Bien que JavaScript n'offre pas une solution intéressante pour lire et écrire des cookies, il est possible et largement utilisé. JavaScript utilise l'objet document.cookie pour la manipulation des cookies, comme le montre l'extrait suivant:
// récupère la date actuelle var expiredate = new Date (); // augmente la date de 5 heures expiredate.setHours (expiredate.getHours () + 5); document.cookie = 'cookiename = cookievalue; expires = "+ expiredate.toUTCString () +" chemin = / exemple /; domaine = test.envato.com ';
Comme vous l'avez peut-être remarqué, cette syntaxe est assez similaire à la notation du protocole HTTP. Cela a l’avantage d’être plus maîtrisé, mais pose également certains problèmes potentiels. Ci-dessous est la
var cookieName = 'testcookiename'; var textArray = document.cookie.split (';'); // place toutes les parties de la chaîne dans un tableau pour (var i = 0; i < textArray.length; i++) // loop though all string pieces var textPiece = textArray[i]; //contains 1 string piece //filter beginning spaces while(textPiece(0)==") textPiece = textPiece.substring(1,textPiece.length); //if the textpiece contains our cookies name if (textPiece.indexOf(cookieName)== 0) //return whats after the cookies name return textPiece.substring(cookieName.length,c.length);
Je sais je sais; c'est une douleur. Heureusement pour vous, je poste quelques fonctions pré-écrites ci-dessous (vous voudrez peut-être créer vos propres fonctions à des fins d'apprentissage, et vous devriez le faire!).
function writeCookie (cookieName, cookieValue, expireHours, chemin d'accès, domaine) var date = new Date (); date.setHours (date.getHours + expireHours); document.cookie = cookieName + '=' + cookieValue + '; expires = "+ date +"; chemin = "+ chemin +"; domain = "+ domain; fonction readCookie (cookieName) var textArray = document.cookie.split ("; '); pour (var i = 0; i < textArray.length; i++) var textPiece = textArray[i]; while(textPiece(0)==") textPiece = textPiece.substring(1,textPiece.length); if (textPiece.indexOf(cookieName)== 0) return textPiece.substring(cookieName.length,c.length);
Veuillez garder à l'esprit que ces extraits ne contiennent aucune vérification d'erreur.
Le saviez-vous? -
Les cookies ont été inventés par Netscape, qui souhaitait les utiliser pour créer un panier d'achat pour une boutique en ligne. Grâce aux cookies, les gens ont pu garder leurs articles dans leur panier, même après leur déconnexion du magasin..
De nos jours, nous utilisons des cookies pour presque tous les objectifs auxquels vous pouvez penser. Vous pouvez les utiliser pour enregistrer des paramètres utilisateur tels que le nom, la langue, l'emplacement ou la taille de l'écran. Cela peut améliorer la qualité du service que vous souhaitez fournir à un client, car vous pouvez optimiser le service pour un client et vous rappeler de cette optimisation à l'avenir. Par exemple, vous pouvez enregistrer la langue préférée du client dans un cookie, puis afficher le contenu de votre site dans la langue préférée chaque fois que le client visite votre site..
Bien sûr, il y a beaucoup plus de choses amusantes à faire avec les cookies que cela! Dans l'étape suivante, je vais vous montrer un exemple d'extrait de code génial..
Finalement! Nous pouvons maintenant commencer à écrire du code génial! Ci-dessous se trouve un extrait de bonus, qui utilise des cookies pour créer un mécanisme de reconnexion.
Avant de commencer, cet extrait contient du code MySQL. Si vous n'êtes pas familier avec MySQL, ne paniquez pas. Même si cet extrait est un peu difficile, il devrait être compréhensible avec un peu de connaissances de base sur PHP et les cookies..
Pour créer une implémentation "Souviens-toi de moi", nous devons avoir quelques éléments. Tout d'abord, nous avons besoin d'une table de base de données contenant un nom d'utilisateur, un mot de passe et un champ d'identification. Deuxièmement, nous avons besoin d'une chaîne ou d'un numéro unique pour identifier les clients en toute sécurité grâce aux cookies (il s'agit de l'identification dans la table de la base de données). Dans cet extrait, nous allons utiliser un résumé SHA-1, qui est juste une chaîne, en tant qu'identificateur. Utilisé correctement, il offre une excellente sécurité.
La plupart des gens insèrent simplement un nom d’utilisateur et un mot de passe dans le cookie et l’envoient automatiquement au serveur.. Cela devrait être évité à tout moment! Les cookies sont généralement envoyés via une connexion non sécurisée, de sorte que le contenu puisse être facilement vu par tout attaquant potentiel..
Nom d'utilisateur; // ici, vous devez définir un nouveau résumé pour la prochaine relogin en utilisant le code ci-dessus! echo 'Vous vous êtes connecté avec succès'. $ username; else // digest n'existe pas (ou plusieurs digests identiques ont été trouvés, mais cela ne se produira pas) echo "Echec de la connexion!"; ?>
En utilisant un digest comme nous l'avons fait, les chances d'obtenir deux du même digest sont minimes. Un condensé est une chaîne de quarante caractères qui, en théorie, devrait toujours fournir une sortie aléatoire complète si l'entrée est modifiée. En pratique, vous devez ajouter une limite de temps dans le code côté serveur afin que le résumé ne soit pas valide après X minutes. Cela empêche les attaquants de copier les cookies de quelqu'un et de les utiliser pour se connecter..
Nous avons presque atteint la fin de ce tutoriel. En conclusion, je voudrais résumer quelques bonnes pratiques:
J'espère que vous avez appris un peu du didacticiel Nettuts + d'aujourd'hui. Si vous avez des questions, n'hésitez pas à laisser un commentaire ou à dire bonjour sur Twitter.