ExpressJS:Sessions

Les Sessions sont des données de petite taille de type key-value stockées dans le serveur,avec ExpressJs

Installer express-session

npm install express-session --save
Exemple 1
utilisation de sessions pour suivre un utilisateur connecté et stocker certaines informations pendant sa session.
app.js

  const express = require('express');
const session = require('express-session');
const bodyParser = require('body-parser');
const app = express();

// Utilise le middleware bodyParser pour traiter les données du formulaire
app.use(bodyParser.urlencoded({ extended: true }));

// Utilise le middleware express-session pour gérer les sessions
app.use(session({
  secret: 'votre_clé_secrète', // Clé secrète utilisée pour signer le cookie de session (gardez-la secrète)
  resave: false, // Force la session à être sauvegardée dans le magasin, même si elle n'a pas été modifiée
  saveUninitialized: true, // Force une session qui n'est pas initialisée à être sauvegardée dans le magasin
  cookie: { secure: false } // Si true, le cookie de session ne sera envoyé que sur une connexion HTTPS
}));

// Route pour afficher la page d'accueil
app.get('/', (req, res) => {
  res.send('Bienvenue sur la page d\'accueil !');
});

// Route pour afficher la page de connexion
app.get('/login', (req, res) => {
  res.send(`
    <form method="post" action="/login">
      <label for="username">Nom d'utilisateur:</label>
      <input type="text" id="username" name="username" required>
      <button type="submit">Se connecter</button>
    </form>
  `);
});

// Route pour traiter le formulaire de connexion
app.post('/login', (req, res) => {
  const { username } = req.body;

  // Stocke le nom d'utilisateur dans la session
  req.session.username = username;

  res.send(`Bienvenue, ${username} ! Vous êtes maintenant connecté.`);
});

// Route pour afficher le profil de l'utilisateur
app.get('/profile', (req, res) => {
  // Vérifie si l'utilisateur est connecté en vérifiant la présence du nom d'utilisateur dans la session
  if (req.session.username) {
    res.send(`Profil de l'utilisateur : ${req.session.username}`);
  } else {
    res.status(401).send('Accès non autorisé. Veuillez vous connecter.');
  }
});

// Route pour déconnecter l'utilisateur
app.post('/logout', (req, res) => {
  // Détruit la session pour déconnecter l'utilisateur
  req.session.destroy();

  res.send('Vous êtes déconnecté.');
});

// Démarrage du serveur sur le port 3000
const PORT = 3000;
app.listen(PORT, () => {
  console.log(`Serveur Express en cours d'exécution sur le port ${PORT}`);
});
Exemple 2
simuler un panier d'achat où les informations sur les produits sélectionnés par l'utilisateur seront stockées dans la session.
app.js
const express = require('express');
const session = require('express-session');
const bodyParser = require('body-parser');
const app = express();

// Utilise le middleware bodyParser pour traiter les données du formulaire
app.use(bodyParser.urlencoded({ extended: true }));

// Utilise le middleware express-session pour gérer les sessions
app.use(session({
  secret: 'votre_clé_secrète', // Clé secrète utilisée pour signer le cookie de session (gardez-la secrète)
  resave: false, // Force la session à être sauvegardée dans le magasin, même si elle n'a pas été modifiée
  saveUninitialized: true, // Force une session qui n'est pas initialisée à être sauvegardée dans le magasin
  cookie: { secure: false } // Si true, le cookie de session ne sera envoyé que sur une connexion HTTPS
}));

// Route pour afficher la page d'accueil
app.get('/', (req, res) => {
  res.send('Bienvenue sur la page d\'accueil !');
});

// Route pour afficher la liste des produits
app.get('/products', (req, res) => {
  res.send(`
    <ul>
      <li>Produit 1 - $10<button onclick="addToCart(1)">Ajouter au panier</button></li>
      <li>Produit 2 - $20<button onclick="addToCart(2)">Ajouter au panier</button></li>
      <li>Produit 3 - $30<button onclick="addToCart(3)">Ajouter au panier</button></li>
    </ul>
    <a href="/cart">Voir le panier</a>
    <script>
      function addToCart(productId) {
        fetch('/add-to-cart/' + productId, { method: 'POST' })
          .then(response => response.text())
          .then(message => alert(message));
      }
    </script>
  `);
});

// Route pour ajouter un produit au panier
app.post('/add-to-cart/:productId', (req, res) => {
  const productId = req.params.productId;

  // Vérifie si le panier existe dans la session, sinon initialise un nouveau panier vide
  req.session.cart = req.session.cart || [];

  // Ajoute le produit au panier
  req.session.cart.push(productId);

  res.send(`Produit ajouté au panier (ID: ${productId}).`);
});

// Route pour afficher le contenu du panier
app.get('/cart', (req, res) => {
  // Vérifie si le panier existe dans la session
  if (req.session.cart && req.session.cart.length > 0) {
    res.send(`Contenu du panier : ${req.session.cart.join(', ')}`);
  } else {
    res.send('Le panier est vide.');
  }
});

// Démarrage du serveur sur le port 3000
const PORT = 3000;
app.listen(PORT, () => {
  console.log(`Serveur Express en cours d'exécution sur le port ${PORT}`);
});
Exemple 3
simuler un système d'authentification avec des sessions.
app.js
const express = require('express');
const express = require('express');
const session = require('express-session');
const bodyParser = require('body-parser');
const app = express();

// Utilise le middleware bodyParser pour traiter les données du formulaire
app.use(bodyParser.urlencoded({ extended: true }));

// Utilise le middleware express-session pour gérer les sessions
app.use(session({
  secret: 'votre_clé_secrète',
  resave: false,
  saveUninitialized: true,
  cookie: { secure: false }
}));

// Utilisateurs simulés (à remplacer par une base de données dans un environnement de production)
const users = [
  { id: 1, username: 'john', password: 'password123' },
  { id: 2, username: 'jane', password: 'password456' }
];

// Middleware pour vérifier l'authentification
const authMiddleware = (req, res, next) => {
  // Vérifie si l'utilisateur est connecté en vérifiant la présence de l'ID de l'utilisateur dans la session
  if (req.session.userId) {
    const user = users.find(u => u.id === req.session.userId);
    req.currentUser = user; // Ajoute l'utilisateur actuel à l'objet de la requête
    next(); // Passe à la route suivante
  } else {
    res.status(401).send('Accès non autorisé. Veuillez vous connecter.');
  }
};

// Utilise le middleware d'authentification pour toutes les routes nécessitant une authentification
app.use(['/profile', '/logout'], authMiddleware);

// Route pour afficher la page d'accueil
app.get('/', (req, res) => {
  res.send('Bienvenue sur la page d\'accueil !');
});

// Route pour afficher la page de connexion
app.get('/login', (req, res) => {
  res.send(`
    <form method="post" action="/login">
      <label for="username">Nom d'utilisateur:</label>
      <input type="text" id="username" name="username" required>
      <label for="password">Mot de passe:</label>
      <input type="password" id="password" name="password" required>
      <button type="submit">Se connecter</button>
    </form>
  `);
});

// Route pour traiter le formulaire de connexion
app.post('/login', (req, res) => {
  const { username, password } = req.body;

  // Vérifie les informations d'authentification
  const user = users.find(u => u.username === username && u.password === password);

  if (user) {
    // Stocke l'ID de l'utilisateur dans la session
    req.session.userId = user.id;
    res.send(`Bienvenue, ${username} ! Vous êtes maintenant connecté.`);
  } else {
    res.status(401).send('Échec de l\'authentification. Veuillez vérifier vos informations.');
  }
});

// Route pour afficher le profil de l'utilisateur connecté
app.get('/profile', (req, res) => {
  res.send(`Profil de l'utilisateur : ${req.currentUser.username}`);
});

// Route pour déconnecter l'utilisateur
app.post('/logout', (req, res) => {
  // Détruit la session pour déconnecter l'utilisateur
  req.session.destroy();

  res.send('Vous êtes déconnecté.');
});

// Démarrage du serveur sur le port 3000
const PORT = 3000;
app.listen(PORT, () => {
  console.log(`Serveur Express en cours d'exécution sur le port ${PORT}`);
});
Exemple 4
Dans cet exemple, nous allons simuler une application de gestion de tâches (to-do list) où les utilisateurs peuvent ajouter, supprimer et marquer comme terminées des tâches.
app.js
const express = require('express');
const express = require('express');
const session = require('express-session');
const bodyParser = require('body-parser');
const app = express();

// Utilise le middleware bodyParser pour traiter les données du formulaire
app.use(bodyParser.urlencoded({ extended: true }));

// Utilise le middleware express-session pour gérer les sessions
app.use(session({
  secret: 'votre_clé_secrète',
  resave: false,
  saveUninitialized: true,
  cookie: { secure: false }
}));

// Liste des tâches simulée (à remplacer par une base de données dans un environnement de production)
const tasks = [];

// Middleware pour vérifier si l'utilisateur est connecté (simulation de l'authentification)
const authMiddleware = (req, res, next) => {
  // Vérifie si l'utilisateur est connecté en vérifiant la présence d'un marqueur dans la session
  if (req.session.isLoggedIn) {
    next(); // Passe à la route suivante
  } else {
    res.status(401).send('Accès non autorisé. Veuillez vous connecter.');
  }
};

// Route pour afficher la page d'accueil
app.get('/', (req, res) => {
  res.send(`
    <h1>Ma liste de tâches</h1>
    <ul>
      ${tasks.map(task => `<li>${task.name} (${task.completed ? 'Terminée' : 'En cours'})</li>`).join('')}
    </ul>
    <form method="post" action="/add-task">
      <label for="task">Ajouter une tâche:</label>
      <input type="text" id="task" name="task" required>
      <button type="submit">Ajouter</button>
    </form>
    <form method="post" action="/logout">
      <button type="submit">Déconnexion</button>
    </form>
  `);
});

// Route pour ajouter une tâche à la liste
app.post('/add-task', authMiddleware, (req, res) => {
  const { task } = req.body;
  tasks.push({ name: task, completed: false });
  res.redirect('/');
});

// Route pour marquer une tâche comme terminée
app.post('/complete-task/:index', authMiddleware, (req, res) => {
  const index = parseInt(req.params.index);
  if (index >= 0 && index < tasks.length) {
    tasks[index].completed = true;
  }
  res.redirect('/');
});

// Route pour déconnecter l'utilisateur
app.post('/logout', (req, res) => {
  // Détruit la session pour déconnecter l'utilisateur (simulation de la déconnexion)
  req.session.destroy();
  res.redirect('/');
});

// Démarrage du serveur sur le port 3000
const PORT = 3000;
app.listen(PORT, () => {
  console.log(`Serveur Express en cours d'exécution sur le port ${PORT}`);
});

Exemple 4

Serveur.js

/*importer la bilbiothèque exprejss*/
const express = require('express')
/*Créer une instance du module Router */
let app = express.Router()

/***1***/
/*importer le middleware cookie-parser*/
var cookieParser = require('cookie-parser');
app.use(cookieParser());

/*importer le middleware express-session*/
var session = require('express-session');
app.use(session({secret: "Session ID pour chaque user"}));

app.get('/testSession', function(req, res){
if(!req.session.variabeSession){
res.send("Veuillez se connecter :<a href='seConnecter'>Se connecter</a>");
}
else
{
res.send("Bienvenue");
}
});

/*juste pour tester ,car normalement pour tester la connexion on doit créer un middleware */
app.get('/seConnecter', function(req, res){
req.session.variabeSession=1;
if(req.session.variabeSession){
res.send("vous êtes déjà connecté");
}
});

//.....

//n'importe quelle autre route
app.get('*', function(req, res){
res.send('404 route not found');
});

module.exports = app









Cours et TPs