Lorsque votre application web a besoin de « se souvenir » des utilisateurs, elle utilise généralement l’un des deux mécanismes suivants : les cookies ou les sessions. Un cookie est une petite zone de stockage dans le navigateur où vous pouvez conserver des données relatives à l’utilisateur, comme les préférences de recherche, par exemple. Les sessions vous permettent de stocker des informations sensibles sur le serveur.
Découvrez comment configurer des sessions dans un serveur Express propulsé par Node.js.
Ce dont vous aurez besoin
Pour suivre ce tutoriel, vous devez installer Node.js et npm. Toute version récente de Node.js est livrée avec npm, un gestionnaire de paquets pour l’installation des dépendances.
Vous utiliserez npm pour installer Express et express-session. Ce sont les outils que vous utiliserez pour créer le serveur web et la session.
Qu’est-ce qu’une session en Node.js ?
Un cookie est un petit fichier que votre navigateur utilise pour stocker des données. Vous pouvez utiliser les cookies pour stocker des données non sensibles telles que les préférences de recherche.
Vous ne devez pas stocker de données sensibles (telles que les noms d’utilisateur et les mots de passe) dans les cookies. Lorsque votre navigateur envoie des cookies via HTTP, ils sont vulnérables aux pirates qui pourraient les intercepter. Ils sont également stockés en texte clair sur votre ordinateur, de sorte que les pirates peuvent potentiellement les inspecter et voler vos données.
Au lieu d’enregistrer les données sensibles sous forme de cookie sur le client, il est préférable de les stocker sur le serveur. Cela permet de les protéger du monde extérieur.
Les sessions vous permettent de stocker des données sensibles dont votre application a besoin pour identifier l’utilisateur. Il s’agit par exemple du nom d’utilisateur, du mot de passe et de l’adresse électronique. Elles sont plus sûres car elles se trouvent sur le serveur et non sur le client.
Chaque fois que vous avez des données que vous souhaitez conserver au fil des requêtes, enregistrez-les sur le serveur à l’aide d’une session. Vous apprendrez à créer une session dans la section suivante.
Création d’une session dans un serveur Express
Express est un framework web populaire pour Node.js. Il vous permet de mettre en place une application de serveur web qui écoute les requêtes des clients sur le numéro de port que vous avez choisi. Vous pouvez créer des routes API, appliquer un middleware et même connecter l’application à une base de données, tout cela grâce aux API fournies par le framework.
1. Créer un projet Node.js
Créez un tout nouveau dossier pour votre projet, puis lancez votre outil de ligne de commande et accédez à ce dossier.
Ensuite, exécutez la commande suivante pour initialiser un projet Node.js :
npm init -y Cela génère un fichier package.json dans le dossier racine du projet avec la configuration par défaut. Le fichier package.json pour l’exécution des scripts npm.
2. Installer Express et express-session
Vous utiliserez Express pour créer l’application serveur web. Et express-session pour créer des sessions sur cette application serveur.
Dans le terminal, exécutez la commande suivante pour installer les deux dépendances :
npm i express express-session Après avoir installé les deux paquets, l’étape suivante consiste à créer le serveur.
3. Créer des sessions dans l’application
Créez un fichier nommé App.js dans le dossier racine de votre projet et importez les dépendances :
const express = require('express')
const session = require('express-session')
app = express()
Ensuite, enregistrez l’intergiciel de session. Transmettez un objet avec l’attribut secret (pour signer le cookie sessionID) et le cookie.
app.use(
session({
secret: "some secret",
cookie: { maxAge: 30000 },
saveUninitialized: false,
})
); Vous fixez ici l’âge maximal de la session à 30 secondes (30000 millisecondes). Il est essentiel de fixer la valeur de saveUnitialized à false si vous disposez d’un système de connexion. Si vous ne le faites pas, votre serveur générera un nouvel identifiant de session à chaque fois que l’utilisateur enverra une requête.
Ensuite, créez une route de connexion pour changer la session. Lorsqu’un utilisateur accède à cette route, vous vous attendez à ce que le client envoie le nom d’utilisateur et le mot de passe dans le corps de la requête. Tout d’abord, vous accédez à ces valeurs et vérifiez si elles existent (et si l’utilisateur s’est authentifié) :
app.post("/login", (req, res) => {
const { username, password } = req.body;
if (username && password) {
if (req.session.authenticated) {
res.json(session);
} else {
if (password === "123") {
req.session.authenticated = true;
req.session.user = { username };
res.json(req.session);
} else {
res.status(403).json({ msg: "Bad credentials" });
}
}
} else {
res.status(403).json({ msg: "Bad credentials" });
}
}); Avec la première instruction if, vous effectuez une vérification fictive. Cette vérification permet de s’assurer que l’on ne procède que si le nom d’utilisateur et le mot de passe sont présents.
Ensuite, vous vérifiez si l’utilisateur est déjà authentifié. Si c’est le cas, renvoyez la session au client. Si ce n’est pas le cas, définissez la propriété authenticated à true et enregistrez le nom d’utilisateur dans la session. Puis renvoyez-la au client.
Avec le code ci-dessus, le serveur se souviendra de chaque utilisateur qui lui envoie une requête. Cela est dû au fait qu’ils se sont authentifiés et que leurs informations uniques (nom d’utilisateur et mot de passe) ont été sauvegardées dans la session.
Démarrez votre serveur en ajoutant le code suivant au bas de App.js :
app.listen(3000, () => {
console.log("Server is running on port 3000");
}); Pour tester cette route, utilisez un client API pour envoyer une requête à la route de connexion que vous avez créée. Assurez-vous d’envoyer le nom d’utilisateur et le mot de passe dans le corps de la requête. Voici à quoi ressemblerait votre requête API si vous utilisiez Rest Client :
POST http://localhost:3000/login HTTP/1.1
Content-Type: "application/json"
{ username: "Kingsley", password: "123"} Si tout se passe bien, vous obtiendrez l’objet suivant :
{
"cookie": {
"originalMaxAge": 30000,
"httpOnly": true,
"path": "https://www.makeuseof.com/"
},
"authenticated": true,
"user": {
"username": "Kingsley",
"password": "123"
}
} Avec ce code, deux choses se sont produites. Premièrement, vous vous êtes authentifié sur le serveur. Deuxièmement, la session contient désormais vos informations de connexion, de sorte que le serveur sait qui vous êtes. Chaque fois que vous enverrez une nouvelle requête, il se souviendra de vous jusqu’à ce que la session expire et que le serveur la supprime.
Les sessions améliorent l’expérience des utilisateurs
Les sessions sont un élément essentiel des applications Node.js. En effet, elles vous permettent de maintenir un état d’interaction à travers de nombreuses requêtes et réponses. Les sessions sont particulièrement importantes pour les applications qui nécessitent une connexion.
Utilisez les sessions dans votre application dorsale pour garder une trace des données spécifiques à l’utilisateur. Par exemple, les articles que l’utilisateur a ajoutés à son panier d’achat.
Sans les sessions, vous devriez maintenir un magasin de données distinct pour chaque utilisateur de votre application. Cela serait inefficace et augmenterait la complexité de l’application.
Express.js simplifie les sessions, le routage, etc.
Express.js est le framework web Node.js le plus populaire actuellement. Il fournit de nombreux outils et bibliothèques pour créer des applications dorsales, et la bibliothèque express-session n’est que l’une d’entre elles.
Si vous souhaitez utiliser Node.js pour le développement d’applications web dorsales, jetez un coup d’œil à Express.
