Express + Session 實(shí)現(xiàn)登錄驗(yàn)證功能
1. 寫在前面
當(dāng)我們登錄了一個(gè)網(wǎng)站,在沒(méi)有退出登錄的情況下,我們關(guān)閉了這個(gè)網(wǎng)站 ,過(guò)一段時(shí)間,再次打開這個(gè)網(wǎng)站,依然還會(huì)是登錄狀態(tài)。這是因?yàn)椋?dāng)我們登錄了一個(gè)網(wǎng)站,服務(wù)器會(huì)保存我們的登錄狀態(tài),直到我們退出登錄,或者保存的登錄狀態(tài)過(guò)期。那服務(wù)器是通過(guò)什么存儲(chǔ)我們的登錄狀態(tài)的呢? 答案就是 Session ,服務(wù)通過(guò) Session 能夠記錄每個(gè)客戶端連接的狀態(tài)。關(guān)于 Session 的原理,在這就不多說(shuō)了,本文主要介紹在 Express 框架中,如何使用 Session 來(lái)實(shí)現(xiàn)用戶登錄身份驗(yàn)證。
2. 環(huán)境配置
在Node 環(huán)境中, 并沒(méi)有集成 Express 和 Session 的庫(kù),因此需要進(jìn)行安裝,首先進(jìn)入建立一個(gè)項(xiàng)目目錄,然后在項(xiàng)目根目錄中,利用下面命令安裝四個(gè)模塊。
1) Express
該模塊能夠讓我們快速的搭建一個(gè) Web 開發(fā)框架。
2) body-parser
該模塊是 Express 模塊的中間件,方便我們解析瀏覽器發(fā)送來(lái)的 body 數(shù)據(jù)。
3) express-session
該模塊也是 Express 模塊中間件,方便我們處理客戶端的 session。
4) ejs
該模塊是一個(gè)渲染引擎。 方便我們將后臺(tái)變量數(shù)據(jù)綁定到前臺(tái)頁(yè)面上。
安裝如下:
npm install express --save npm install body-parser --save npm install express-session --save npm install ejs --save
3. 登錄與驗(yàn)證
Session 能夠標(biāo)記客戶端在服務(wù)器上的狀態(tài)。利用這一點(diǎn),我們能夠?qū)崿F(xiàn)客戶端的登錄驗(yàn)證。Session 登錄驗(yàn)證的流程大致為:客戶端若在未登錄的狀態(tài)下請(qǐng)求主頁(yè),那么服務(wù)器將該請(qǐng)求重定向到登錄頁(yè)面;客戶端在登錄后,服務(wù)器需要記錄保存該客戶端的登錄狀態(tài),并給予一個(gè)活動(dòng)期限,這樣下一次服務(wù)器請(qǐng)求主頁(yè)的時(shí)候,就能夠判斷該客戶端的登錄狀態(tài),若登錄狀態(tài)有效,直接返回客戶端需要的頁(yè)面,否則重定向到登錄頁(yè)面。
對(duì)于 Session 的過(guò)期時(shí)間,如果沒(méi)有設(shè)置 Session 的過(guò)期時(shí)間,服務(wù)器會(huì)根據(jù)自己配置中默認(rèn)有效期,將長(zhǎng)期不與服務(wù)器交互的 Session 進(jìn)行刪除。
下面貼出實(shí)例代碼,界面比較簡(jiǎn)單,服務(wù)器后臺(tái)代碼注釋寫的很清楚,因此就不再進(jìn)行說(shuō)明了。
項(xiàng)目的目錄結(jié)構(gòu)如下:
登錄頁(yè)面(login.html) 代碼如下:
<!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>
主頁(yè)(home.html)代碼如下:
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Title</title> </head> <body> <div>用戶名:<span><%= username %> </span> <a href="/logout" rel="external nofollow" >退出登錄</a></div> </body> </html>
服務(wù)器(app.js)代碼如下:
/** * Created by tjm on 9/7/2017. */ var express = require('express'); var app = express(); var session = require('express-session'); var bodyparser = require('body-parser'); // 下面三行設(shè)置渲染的引擎模板 app.set('views', __dirname); //設(shè)置模板的目錄 app.set('view engine', 'html'); // 設(shè)置解析模板文件類型:這里為html文件 app.engine('html', require('ejs').__express); // 使用ejs引擎解析html文件中ejs語(yǔ)法 app.use(bodyparser.json()); // 使用bodyparder中間件, app.use(bodyparser.urlencoded({ extended: true })); // 使用 session 中間件 app.use(session({ secret : 'secret', // 對(duì)session id 相關(guān)的cookie 進(jìn)行簽名 resave : true, saveUninitialized: false, // 是否保存未初始化的會(huì)話 cookie : { maxAge : 1000 * 60 * 3, // 設(shè)置 session 的有效時(shí)間,單位毫秒 }, })); // 獲取登錄頁(yè)面 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; // 登錄成功,設(shè)置 session res.redirect('/'); } else{ res.json({ret_code : 1, ret_msg : '賬號(hào)或密碼錯(cuò)誤'});// 若登錄失敗,重定向到登錄頁(yè)面 } }); // 獲取主頁(yè) app.get('/', function (req, res) { if(req.session.userName){ //判斷session 狀態(tài),如果有效,則返回主頁(yè),否則轉(zhuǎn)到登錄頁(yè)面 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') })
到此,session 實(shí)現(xiàn)登錄驗(yàn)證就完成。上面的例子 session 是保存在服務(wù)內(nèi)存中,當(dāng)然還可以保存在文件或數(shù)據(jù)庫(kù)中,只需要配置 session 中間件即可。
app.use(session({ secret: 'secretkey', store: new MongoStore({ db: 'sessiondb' }) }));
上面的代碼則是將 session 保存到 MongoDB 數(shù)據(jù)庫(kù),當(dāng)然 Session 的配置還有一些,具體參考:
https://www.npmjs.com/package/express-session
總結(jié)
以上所述是小編給大家介紹的Express + Session 實(shí)現(xiàn)登錄驗(yàn)證功能,希望對(duì)大家有所幫助,如果大家有任何疑問(wèn)請(qǐng)給我留言,小編會(huì)及時(shí)回復(fù)大家的。在此也非常感謝大家對(duì)腳本之家網(wǎng)站的支持!
- Nodejs進(jìn)階:express+session實(shí)現(xiàn)簡(jiǎn)易登錄身份認(rèn)證
- Node.js+Express+MySql實(shí)現(xiàn)用戶登錄注冊(cè)功能
- 用node和express連接mysql實(shí)現(xiàn)登錄注冊(cè)的實(shí)現(xiàn)代碼
- Node+Express+MongoDB實(shí)現(xiàn)登錄注冊(cè)功能實(shí)例
- express框架中使用jwt實(shí)現(xiàn)驗(yàn)證的方法
- express + jwt + postMan驗(yàn)證實(shí)現(xiàn)持久化登錄
- Vue+Express實(shí)現(xiàn)登錄狀態(tài)權(quán)限驗(yàn)證的示例代碼
- nodejs使用express獲取get和post傳值及session驗(yàn)證的方法
- DevExpress實(shí)現(xiàn)GridControl單元格編輯驗(yàn)證的方法
- Express實(shí)現(xiàn)登錄驗(yàn)證
相關(guān)文章
node實(shí)現(xiàn)批量上傳本地圖片轉(zhuǎn)為圖片CDN的項(xiàng)目實(shí)踐
本文主要介紹了node實(shí)現(xiàn)批量上傳本地圖片轉(zhuǎn)為圖片CDN的項(xiàng)目實(shí)踐,文中通過(guò)示例代碼介紹的非常詳細(xì),對(duì)大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值,需要的朋友們下面隨著小編來(lái)一起學(xué)習(xí)學(xué)習(xí)吧2023-07-07Node.js發(fā)出請(qǐng)求走Proxyman代理調(diào)試tip詳解
這篇文章主要為大家介紹了Node.js發(fā)出請(qǐng)求走Proxyman代理調(diào)試tip詳解,有需要的朋友可以借鑒參考下,希望能夠有所幫助,祝大家多多進(jìn)步,早日升職加薪2023-08-08linux服務(wù)器快速卸載安裝node環(huán)境(簡(jiǎn)單上手)
這篇文章主要介紹了linux服務(wù)器快速卸載安裝node環(huán)境(簡(jiǎn)單上手),文中通過(guò)示例代碼介紹的非常詳細(xì),對(duì)大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值,需要的朋友們下面隨著小編來(lái)一起學(xué)習(xí)學(xué)習(xí)吧2021-02-02node?NPM庫(kù)glob通配符匹配文件名minimatch模式匹配字符串學(xué)習(xí)
這篇文章主要為大家介紹了node?NPM庫(kù)glob通配符匹配文件名minimatch模式匹配字符串學(xué)習(xí),有需要的朋友可以借鑒參考下,希望能夠有所幫助,祝大家多多進(jìn)步,早日升職加薪2023-07-07如何使用nvm實(shí)現(xiàn)nodejs版本管理(版本刪除,版本切換及版本添加)
這篇文章主要給大家介紹了關(guān)于如何使用nvm實(shí)現(xiàn)nodejs版本管理(版本刪除,版本切換及版本添加)的相關(guān)資料,nvm是一個(gè)node版本管理工具,通過(guò)它可以安裝多種node版本并且可以快速、簡(jiǎn)單的切換node版本,需要的朋友可以參考下2023-10-10nodejs簡(jiǎn)單訪問(wèn)及操作mysql數(shù)據(jù)庫(kù)的方法示例
這篇文章主要介紹了nodejs簡(jiǎn)單訪問(wèn)及操作mysql數(shù)據(jù)庫(kù)的方法,結(jié)合實(shí)例形式分析了nodejs創(chuàng)建mysql連接、執(zhí)行sql語(yǔ)句及關(guān)閉連接等相關(guān)操作技巧,需要的朋友可以參考下2018-03-03node.js報(bào)錯(cuò):Cannot find module ''ejs''的解決辦法
最近發(fā)現(xiàn)了node.js居然報(bào)錯(cuò)了,錯(cuò)誤提示為:Cannot find module 'ejs',后來(lái)找了找資料發(fā)現(xiàn)解決的方法其實(shí)很簡(jiǎn)單,下面通過(guò)這篇文章來(lái)一起看看吧,希望對(duì)同樣遇到這個(gè)問(wèn)題的朋友們能有所幫助。2016-12-12