首先,我必須義正言辭的吐槽一下這個宇宙級框架!exPRess3.x和expss4.x差別怎么就那么大呢?找了好多資料來學習,但總是莫名其妙的報錯,一開始我以為是因為我長得不好看,后來發現。。。我用的是4.x的express,而教程是3.x的,好多都對不上號。我@#¥%……&*()&……¥
好了,吐槽結束,進入正題。作為一個勵志改變世界的程序員,我們必須緊跟時代的潮流,所以nodejs死亡筆記都是基于express4.x的。本篇文章將講解cookie和session。
我之前寫過一篇express項目搭建的博客,所以如何搭建我就不說了。
在web應用中,多個請求之間共享“用戶會話”是非常必要的。但HTTP1.0協議是無狀態的。那這時Cookie就出現了。那Cookie又是如何處理的呢?
在HTML文檔被發送之前,Web服務器通過傳送HTTP 包頭中的Set-Cookie 消息把一個cookie 發送到用戶的瀏覽器中,如下示例:
Set-Cookie: name=value; Path=/; expires=Wednesday, 09-Nov-99 23:12:40 GMT;11其中比較重要的屬性:
name=value:鍵值對,可以設置要保存的 Key/Value,注意這里的 name 不能和其他屬性項的名字一樣Expires: 過期時間(秒),在設置的某個時間點后該 Cookie 就會失效,如 expires=Wednesday, 09-Nov-99 23:12:40 GMTmaxAge: 最大失效時間(毫秒),設置在多少后失效secure: 當 secure 值為 true 時,cookie 在 HTTP 中是無效,在 HTTPS 中才有效Path: 表示 cookie 影響到的路,如 path=/。如果路徑不能匹配時,瀏覽器則不發送這個Cookieexpress 在 4.x 版本之后,管理session和cookies等許多模塊都不再直接包含在express中, `而是需要單獨下載安裝相應模塊。
cookieParser安裝: $ npm install cookie-parser
通過express命令創建的項目會自動將這個模塊安裝。
使用方法:
app.get('/', function (req, res) { // 如果請求中的 cookie 存在 isVisit, 則輸出 cookie // 否則,設置 cookie 字段 isVisit, 并設置過期時間為1分鐘 if (req.cookies.isVisit) { console.log(req.cookies); res.send("再次歡迎訪問"); } else { res.cookie('isVisit', 1, {maxAge: 60 * 1000}); res.send("歡迎第一次訪問"); }});12345678910111234567891011session是另一種記錄客戶狀態的機制,不同的是Cookie保存在客戶端瀏覽器中,而session保存在服務器上。
客戶端瀏覽器訪問服務器的時候,服務器把客戶端信息以某種形式記錄在服務器上,這就是session。客戶端瀏覽器再次訪問時只需要從該Session中查找該客戶的狀態就可以了。
如果說Cookie機制是通過檢查客戶身上的“通行證”來確定客戶身份的話,那么session機制就是通過檢查服務器上的“客戶明細表”來確認客戶身份。
session相當于程序在服務器上建立的一份客戶檔案,客戶來訪的時候只需要查詢客戶檔案表就可以了。
兩者的區別:
cookie數據存放在客戶的瀏覽器上,session數據放在服務器上。
cookie不是很安全,別人可以分析存放在本地的COOKIE并進行COOKIE欺騙 考慮到安全應當使用session。
session會在一定時間內保存在服務器上。當訪問增多,會比較占用你服務器的性能 考慮到減輕服務器性能方面,應當使用COOKIE。
單個cookie保存的數據不能超過4K,很多瀏覽器都限制一個站點最多保存20個cookie。
所以建議:將登陸信息等重要信息存放為session、其他信息如果需要保留,可以放在cookie中
跟cookie一樣都需要單獨的安裝和引用模塊, 安裝模塊:
$npm install express-session11這個模塊沒有默認安裝,需要自己手動安裝,并引入: var session = require('express-session');
這個模塊的主要的方法是 session(options),其中 options 中包含可選參數,主要有:
name: 設置 cookie 中,保存 session 的字段名稱,默認為 connect.sid 。store: session 的存儲方式,默認存放在內存中,也可以使用 redis,mongodb 等。express 生態中都有相應模塊的支持。secret: 通過設置的 secret 字符串,來計算 hash 值并放在 cookie 中,使產生的 signedCookie防篡改。cookie: 設置存放 session id 的 cookie 的相關選項,默認為 (default: { path: ‘/’,httpOnly: true, secure: false, maxAge: null })genid: 產生一個新的 session_id 時,所使用的函數, 默認使用 uid2 這個 npm 包。rolling: 每個請求都重新設置一個 cookie,默認為 false。resave: 即使 session 沒有被修改,也保存 session 值,默認為 true。使用方法:
app.use(session({ secret: 'hubwiz app', //secret的值建議使用隨機字符串 cookie: {maxAge: 60 * 1000 * 30} // 過期時間(毫秒)}));app.get('/session', function (req, res) { if (req.session.sign) {//檢查用戶是否已經登錄 console.log(req.session);//打印session的值 res.send('welecome <strong>' + req.session.name + '</strong>, 歡迎你再次登錄'); } else { req.session.sign = true; req.session.name = 'https://github.com/CleverFan'; res.send('歡迎登陸!'); }});12345678910111213141234567891011121314重新運行npm start,然后刷新訪問測試頁面。我們會發現session丟了! 這是因為session會默認的存儲到內存當中。也就是說session數據都是存儲在內存當中的,當進程退出后,session數據就會丟失。
在開發環境中,這也許并不算什么壞事。但是如果線上的應用是這樣的,用戶絕對是不能忍受的。所以,我們需要將session數據 持久化存儲。
在使用MongoDB存儲時首先要加載一個模塊:connect-mongo以及mongoose
安裝命令: npm install connect-mongo npm install mongoose
基于以上原因,很多Session管理都是基于Redis實現的。所以我們這個示例將用redis管理session。
Express已經將Session管理的整個實現過程簡化到僅僅幾行代碼的配置的地步了,你完全不用理解整個session產生、存儲、返回、過期、再頒發的結構,使用Express和Redis實現Session管理,只要兩個中間件就足夠了:
express-sessionconnect-redis參數
client 你可以復用現有的redis客戶端對象, 由 redis.createClient() 創建host Redis服務器名port Redis服務器端口socket Redis服務器的unix_socket可選參數
ttl Redis session TTL 過期時間 (秒)disableTTL 禁用設置的 TTLdb 使用第幾個數據庫pass Redis數據庫的密碼prefix 數據表前輟即schema, 默認為 “sess:”如何使用:
var express = require('express');var session = require('express-session');var RedisStore = require('connect-redis')(session);var app = express();var options = { "host": "127.0.0.1", "port": "6379", "ttl": 60 * 60 * 24 * 30, //session的有效期為30天(秒)};// 此時req對象還沒有session這個屬性app.use(session({ store: new RedisStore(options), secret: 'express is powerful'}));1234567891011121314151612345678910111213141516最后,用一個簡單的登錄驗證小項目結束本篇文章。
index.ejs:
<form action="/sign" method="post"> <fieldset> <legend>Please sign in</legend> <p>User: <input type="text" name="user"/></p> <p>Pass: <input type="text" name="passWord"/></p> <button>Submit</button> </fieldset></form>123456789123456789sign.ejs
<!doctype html><html><head> <title>session</title></head><body> <!--登錄成功展示的內容--> <p>welecome <strong> <%=session.name%> </strong>, 歡迎你再次登錄<a href="/out"></a></p></body></html>1234567891012345678910user.json
{ "admin":{ "password": "admin", "name": "demo" }}123456123456admin為登錄用戶名,password為登錄密碼,name為用戶昵稱。
app.js
var express = require('express');var path = require('path');var favicon = require('serve-favicon');var logger = require('morgan');var cookieParser = require('cookie-parser');var bodyParser = require('body-parser');var session = require('express-session');var routes = require('./routes/index');var user = require('./user.json');var app = express();// view engine setupapp.set('views', path.join(__dirname, 'views'));app.set('view engine', 'ejs');// uncomment after placing your favicon in /public//app.use(favicon(path.join(__dirname, 'public', 'favicon.ico')));app.use(logger('dev'));app.use(bodyParser.json());app.use(bodyParser.urlencoded({ extended: false }));app.use(cookieParser());app.use(express.static(path.join(__dirname, 'public')));// app.use('/', routes);// app.use('/users', users);app.use(session({ secret: 'secret', //為了安全性的考慮設置secret屬性 cookie: {maxAge: 60 * 1000 * 30}, //設置過期時間 resave: true, // 即使 session 沒有被修改,也保存 session 值,默認為 true saveUninitialized: false, //}));app.get('/', function (req, res) { if (req.session.sign) {//檢查用戶是否已經登錄,如果已登錄展現的頁面 console.log(req.session);//打印session的值 res.render('sign.ejs', {session:req.session}); } else {//否則展示index頁面 res.render('index.ejs', {title: 'index'}); }});//登錄表單處理app.post('/sign', function (req, res) { //登錄的數據和user.json中的數據進行對比 if(!user[req.body.user]){ res.end("input wrong"); } if (req.body.password != user[req.body.user].password || !user[req.body.user]) { res.end('sign failure'); } else { req.session.sign = true; req.session.name = user[req.body.user].name; res.send('welecome <strong>' + req.session.name + '</strong>,<a href="/out">登出</a>'); }});app.get('/out', function(req, res){ req.session.destroy(); res.redirect('/');});// catch 404 and forward to error handlerapp.use(function(req, res, next) { var err = new Error('Not Found'); err.status = 404; next(err);});// error handlers// development error handler// will print stacktraceif (app.get('env') === 'development') { app.use(function(err, req, res, next) { res.status(err.status || 500); res.render('error', { message: err.message, error: err }); });}// production error handler// no stacktraces leaked to userapp.use(function(err, req, res, next) { res.status(err.status || 500); res.render('error', { message: err.message, error: {} });});module.exports = app;12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667686970717273747576777879808182838485868788899091929394959697981234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374757677787980818283848586878889909192939495969798現在啟動項目,就可以使用這個demo了。
項目源代碼我會放在github上,感興趣的可以去下載。 github地址:https://github.com/CleverFan/nodejsStudy/tree/master/expressTest/day02_session
歡迎大家和我討論,畢竟我也是個萌新-.-
|
新聞熱點
疑難解答