Heim > Web-Frontend > js-Tutorial > Hauptteil

Express Session implementiert die Funktion zur Anmeldeüberprüfung (Code im Anhang)

php中世界最好的语言
Freigeben: 2018-04-18 11:08:36
Original
1910 Leute haben es durchsucht

Dieses Mal werde ich Ihnen die Express-Sitzung zur Implementierung der Anmeldebestätigungsfunktion (mit Code) vorstellen. Was sind die Vorsichtsmaßnahmen für die Express-Sitzung zur Implementierung der Anmeldebestätigungsfunktion? Schauen Sie mal rein.

Viele Leute erforschen die Verwendung von Express und Session zur Implementierung der Anmeldeüberprüfung. In diesem Artikel wird kurz vorgestellt, wie Express und Session zur Implementierung der Anmeldeüberprüfung verwendet werden. Finden wir es gemeinsam heraus.

1. Schreiben Sie vorne

Wenn wir uns auf einer Website anmelden, 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 näher auf das Prinzip von Session eingehen. In diesem Artikel wird hauptsächlich die Verwendung von Session zur Implementierung der Benutzeranmeldung im Express-Framework vorgestellt.

2. Umgebungskonfiguration

In der Node-Umgebung gibt es keine Bibliothek, die Express und Session integriert. Sie müssen sie daher zunächst installieren, ein Projektverzeichnis eingeben und erstellen und dann die folgenden Befehle verwenden, um vier Module im Projektstammverzeichnis zu installieren.

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 Körperdaten zu analysieren.

3) Express-Sitzung

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

4) ejs

Dieses Modul ist eine Rendering-Engine. Für uns ist es praktisch, die Hintergrundvariable data an die Startseite 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

Die 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, basierend auf dem Standardgültigkeitszeitraum 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, sodass ich sie nicht noch einmal erläutern werde.

Die Verzeichnisstruktur des Projekts ist wie folgt:

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

Ich glaube, dass Sie die Methode beherrschen, nachdem Sie den Fall in diesem Artikel gelesen haben. Weitere spannende Informationen finden Sie in anderen verwandten Artikeln auf der chinesischen PHP-Website.

Empfohlene Lektüre:

Node.js implementiert die Lese- und Schreibsynchronisierungsfunktion

So vergleichen Sie zwei Zeichenfolgen mit gleichen Daten

Das obige ist der detaillierte Inhalt vonExpress Session implementiert die Funktion zur Anmeldeüberprüfung (Code im Anhang). 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