recherche

Maison  >  Article  >  interface Web  >  Utilisation de Session dans le framework Express pour implémenter l'authentification lors de la connexion

Utilisation de Session dans le framework Express pour implémenter l'authentification lors de la connexion

巴扎黑
巴扎黑original
2017-09-09 09:51:411638parcourir

Cet article présente principalement comment utiliser Session pour implémenter l'authentification de connexion utilisateur dans le framework Express. Pour ceux qui souhaitent mettre en œuvre la vérification de connexion pour une session express, veuillez y jeter un œil

1 Écrivez-le devant

Quand. nous nous connectons Pour un site Web, nous fermons le site Web sans nous déconnecter. Après un certain temps, lorsque nous ouvrons à nouveau le site Web, nous serons toujours connectés. En effet, lorsque nous nous connectons à un site Web, le serveur enregistre notre statut de connexion jusqu'à ce que nous nous déconnections ou que le statut de connexion enregistré expire. Alors, comment le serveur stocke-t-il notre statut de connexion ? La réponse est Session, grâce à laquelle le service peut enregistrer l'état de chaque connexion client. Je ne dirai pas grand-chose ici sur le principe de Session. Cet article présente principalement comment utiliser Session pour implémenter l'authentification de connexion utilisateur dans le framework Express.

2. Configuration de l'environnement

Dans l'environnement Node, il n'y a pas de bibliothèque intégrée pour Express et Session, elle doit donc être installée. Entrez d'abord dans le répertoire du projet de l'établissement A, puis utilisez les commandes suivantes pour installer quatre modules dans le répertoire racine du projet.

1) Express

Ce module nous permet de construire rapidement un framework de développement web.

2) body-parser

Ce module est le middleware du module Express, qui nous permet d'analyser les données corporelles envoyées par le navigateur.

3) express-session

Ce module est également le middleware du module Express, qui nous permet de traiter plus facilement les sessions client.

4) ejs

Ce module est un moteur de rendu. Il est pratique pour nous de lier les données variables d’arrière-plan à la première page.

L'installation est la suivante :


npm install express --save
npm install body-parser --save
npm install express-session --save
npm install ejs --save

Connexion et vérification

La session peut marquer le statut du client sur le serveur. Grâce à cela, nous pouvons implémenter la vérification de connexion côté client. Le processus de vérification de la connexion à la session est à peu près le suivant : si le client demande la page d'accueil alors qu'il n'est pas connecté, le serveur redirigera la demande vers la page de connexion une fois le client connecté, le serveur doit enregistrer et sauvegarder l'état de connexion du client ; et donnez une période d'activité, afin que la prochaine fois que le serveur demandera la page d'accueil, il puisse déterminer le statut de connexion du client. Si le statut de connexion est valide, il reviendra directement à la page dont le client a besoin, sinon il sera redirigé vers la page. page de connexion.

Concernant le délai d'expiration de la session, si le délai d'expiration de la session n'est pas défini, le serveur supprimera les sessions qui n'ont pas interagi avec le serveur depuis longtemps selon la période de validité par défaut dans sa propre configuration.

L'exemple de code est publié ci-dessous. L'interface est relativement simple et les commentaires du code d'arrière-plan du serveur sont clairement écrits, je ne l'expliquerai donc pas à nouveau.

La structure des répertoires du projet est la suivante :

Page de connexion (login.html) Le code est le suivant : 


<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>Title</title>
  <style type="text/css">

  </style>
</head>
<body>
  <form action="/login" method="POST">
    用户名: <input type="text" name="username"/> <br>
    密码: <input type="password" name="pwd"/>
    <input type="submit" value="Submit"/>
  </form>
</body>
</html>

Le code de la page d'accueil (home. html) est le suivant : 


<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>Title</title>
</head>
<body>
  <p>用户名：<span><%= username %> </span> <a href="/logout" rel="external nofollow" >退出登录</a></p>
</body>
</html>

Le code du serveur (app.js) est le suivant : 


/**
 * Created by tjm on 9/7/2017.
 */
var express = require(&#39;express&#39;);
var app = express();
var session = require(&#39;express-session&#39;);
var bodyparser = require(&#39;body-parser&#39;);
// 下面三行设置渲染的引擎模板
app.set(&#39;views&#39;, __dirname); //设置模板的目录
app.set(&#39;view engine&#39;, &#39;html&#39;); // 设置解析模板文件类型：这里为html文件
app.engine(&#39;html&#39;, require(&#39;ejs&#39;).__express); // 使用ejs引擎解析html文件中ejs语法
app.use(bodyparser.json()); // 使用bodyparder中间件，
app.use(bodyparser.urlencoded({ extended: true }));
// 使用 session 中间件
app.use(session({
  secret : &#39;secret&#39;, // 对session id 相关的cookie 进行签名
  resave : true,
  saveUninitialized: false, // 是否保存未初始化的会话
  cookie : {
    maxAge : 1000 * 60 * 3, // 设置 session 的有效时间，单位毫秒
  },
}));
// 获取登录页面
app.get(&#39;/login&#39;, function(req, res){
  res.sendFile(__dirname + &#39;/login.html&#39;)
});
// 用户登录
app.post(&#39;/login&#39;, function(req, res){
  if(req.body.username == &#39;admin&#39; && req.body.pwd == &#39;admin123&#39;){
    req.session.userName = req.body.username; // 登录成功，设置 session
    res.redirect(&#39;/&#39;);
  }
  else{
    res.json({ret_code : 1, ret_msg : &#39;账号或密码错误&#39;});// 若登录失败，重定向到登录页面
  }
});
// 获取主页
app.get(&#39;/&#39;, function (req, res) {
  if(req.session.userName){ //判断session 状态，如果有效，则返回主页，否则转到登录页面
    res.render(&#39;home&#39;,{username : req.session.userName});
  }else{
    res.redirect(&#39;login&#39;);
  }
})
// 退出
app.get(&#39;/logout&#39;, function (req, res) {
  req.session.userName = null; // 删除session
  res.redirect(&#39;login&#39;);
});
app.listen(8000,function () {
  console.log(&#39;http://127.0.0.1:8000&#39;)
})

À ce stade, la vérification de la connexion à la session est terminée. Dans l'exemple ci-dessus, la session est enregistrée dans la mémoire du service. Bien entendu, elle peut également être enregistrée dans un fichier ou une base de données. Il vous suffit de configurer le middleware de session. 


app.use(session({
  secret: &#39;secretkey&#39;,
  store: new MongoStore({
    db: &#39;sessiondb&#39;
  })
}));

Le code ci-dessus enregistre la session dans la base de données MongoDB. Bien sûr, il existe quelques configurations pour la session pour référence spécifique :

. https://www.npmjs.com/package/express-session

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!

Déclaration：
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn
Article précédent：Comment utiliser js pour implémenter un carrousel d'images de pages WebArticle suivant：Comment utiliser js pour implémenter un carrousel d'images de pages Web

Articles Liés

Voir plus