Heim > Web-Frontend > js-Tutorial > Verwendung von Session im Express-Framework zur Implementierung der Authentifizierung bei der Anmeldung

Verwendung von Session im Express-Framework zur Implementierung der Authentifizierung bei der Anmeldung

巴扎黑
Freigeben: 2017-09-09 09:51:41
Original
1681 Leute haben es durchsucht

In diesem Artikel wird hauptsächlich die Verwendung von Session zum Implementieren der Benutzeranmeldeauthentifizierung im Express-Framework vorgestellt. Für diejenigen, die daran interessiert sind, die Anmeldebestätigung für Express-Sitzungen zu implementieren, werfen Sie bitte einen Blick darauf

1 Schreiben Sie es vor

Wann Wir melden uns an: Bei einer Website schließen wir die Website, ohne uns abzumelden. Nach einer Weile, wenn wir die Website erneut öffnen, sind wir immer noch angemeldet. Denn wenn wir uns auf einer Website anmelden, speichert der Server unseren Anmeldestatus, bis wir uns abmelden oder der gespeicherte Anmeldestatus abläuft. Wie speichert der Server unseren Anmeldestatus? Die Antwort lautet Sitzung, über die der Dienst den Status jeder Clientverbindung aufzeichnen kann. Ich werde hier nicht viel über das Prinzip von Session sagen. In diesem Artikel wird hauptsächlich die Verwendung von Session zur Implementierung der Benutzeranmeldeauthentifizierung im Express-Framework vorgestellt.

2. Umgebungskonfiguration

In der Node-Umgebung gibt es keine integrierte Bibliothek für Express und Session, daher muss diese installiert werden. Geben Sie zunächst das Projektverzeichnis der Einrichtung A ein und installieren Sie dann mit den folgenden Befehlen vier Module im Projektstammverzeichnis.

1) Express

Mit diesem Modul können wir schnell ein Webentwicklungs-Framework erstellen.

2) Body-Parser

Dieses Modul ist die Middleware des Express-Moduls, die es uns ermöglicht, die vom Browser gesendeten Body-Daten zu analysieren.

3) Express-Sitzung

Dieses Modul ist auch die Express-Modul-Middleware, die uns die Verarbeitung von Client-Sitzungen erleichtert.

4) ejs

Dieses Modul ist eine Rendering-Engine. Für uns ist es praktisch, Hintergrundvariablendaten an die Titelseite zu binden.

Die Installation erfolgt wie folgt:


npm install express --save
npm install body-parser --save
npm install express-session --save
npm install ejs --save
Nach dem Login kopieren

3. Anmeldung und Verifizierung

Sitzung kann den Status des Clients auf dem Server markieren. Damit können wir eine clientseitige Anmeldeüberprüfung implementieren. Der Prozess der Sitzungsanmeldeüberprüfung ist ungefähr wie folgt: Wenn der Client die Startseite anfordert, während er nicht angemeldet ist, leitet der Server die Anforderung nach der Anmeldung des Clients um. Der Server muss den Anmeldestatus des Clients aufzeichnen und speichern und geben Sie einen Aktivitätszeitraum an, damit der Server bei der nächsten Anforderung der Homepage den Anmeldestatus des Clients ermitteln kann. Wenn der Anmeldestatus gültig ist, kehrt er direkt zu der Seite zurück, die der Client benötigt, andernfalls wird er zur Anmeldung weitergeleitet Seite.

Was die Ablaufzeit der Sitzung betrifft: Wenn die Ablaufzeit der Sitzung nicht festgelegt ist, löscht der Server Sitzungen, die längere Zeit nicht mit dem Server interagiert haben, entsprechend der Standardgültigkeitsdauer in seiner eigenen Konfiguration.

Der Beispielcode ist unten aufgeführt. Die Benutzeroberfläche ist relativ einfach und die Kommentare zum Server-Hintergrundcode sind klar geschrieben, daher werde ich sie nicht noch einmal erklären.

Die Verzeichnisstruktur des Projekts ist wie folgt:

Anmeldeseite (login.html) Der Code lautet wie folgt:


<!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>
Nach dem Login kopieren
Der

Home.html)-Code lautet wie folgt:


<!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>
Nach dem Login kopieren

Der Servercode (app.js) lautet wie folgt:


/**
 * 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;)
})
Nach dem Login kopieren

Zu diesem Zeitpunkt ist die Überprüfung der Sitzungsanmeldung abgeschlossen. Im obigen Beispiel wird die Sitzung im Dienstspeicher gespeichert. Sie kann natürlich auch in einer Datei oder Datenbank gespeichert werden. Sie müssen lediglich die Sitzungs-Middleware konfigurieren.


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

Der obige Code speichert die Sitzung in der MongoDB-Datenbank. Natürlich gibt es einige Konfigurationen für die Sitzung:

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

Das obige ist der detaillierte Inhalt vonVerwendung von Session im Express-Framework zur Implementierung der Authentifizierung bei der Anmeldung. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Verwandte Etiketten:
Quelle:php.cn
Erklärung dieser Website
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn
Beliebte Tutorials
Mehr>
Neueste Downloads
Mehr>
Web-Effekte
Quellcode der Website
Website-Materialien
Frontend-Vorlage