基于express框架實現簡單的注冊登錄Web功能

作為一個從設計轉到前端的菜鳥,很想知道一個登錄注冊流程到底是怎樣的,但是又不懂那么多的東西,從網上看到一些文章,自己動手試了下,希望對大家有一定的啟發。

使用技術

  • node.js
  • express
  • mongodb

下載安裝

git clone git@github.com:dctxf/node_sign.git

npm i

設計思路

  1. home 進入網站首頁,判斷是否登錄,登錄即跳轉到home頁,沒登錄跳轉到login頁
  2. login 輸入用戶名,密碼,點擊登錄,判斷用戶是否存在,存在即登錄,不存在提示
  3. regist 輸入用戶名,密碼,點擊注冊,判斷用戶是否存在,不存在即創建用戶,并登錄

mongodb

MongoDB是一個基于分布式文件存儲的數據庫。由C++語言編寫。旨在為WEB應用提供可擴展的高性能數據存儲解決方案。 他的特點:高性能、易部署、易使用,存儲數據非常方便

在Mac上安裝MongoDB

使用Mac上面的Homebrew安裝

首先更新Homebrew的package數據庫

brew update

更新完成之后,直接安裝MongoDB

brew install mongodb
Downloading https://homebrew.bintray.com/bottles/mongodb-3.0.6.yosemite.bottle.tar.gz Already downloaded:
/Library/Caches/Homebrew/mongodb-3.0.6.yosemite.bottle.tar.gz ==> Pouring mongodb-3.0.6.yosemite.bottle.tar.gz ==> Caveats To have
launchd start mongodb at login: ln -sfv /usr/local/opt/mongodb/*.plist ~/Library/LaunchAgents Then to load mongodb now: launchctl load
~/Library/LaunchAgents/homebrew.mxcl.mongodb.plist Or, if you don't
want/need launchctl, you can just run: mongod --config
/usr/local/etc/mongod.conf ==> Summary ??
/usr/local/Cellar/mongodb/3.0.6: 17 files, 159M

啟動MongoDB

上面最后的提示的是直接啟動Mongodb的方法

mongod --config /usr/local/etc/mongod.conf

mongoose

Mongoose是MongoDB的一個對象模型工具,是基于node-mongodb-native開發的MongoDB nodejs驅動,可以在異步的環境下執行。

同時它也是針對MongoDB操作的一個對象模型庫,封裝了MongoDB對文檔的的一些增刪改查等常用方法,讓NodeJS操作Mongodb數據庫變得更加靈活簡單。

我們通過Mongoose去創建一個“集合”并對其進行增刪改查,就要用到它的三個屬性:Schema(數據屬性模型)、Model、Entity

這里簡單介紹一下,更詳細的用法可以自行查閱~

Schema

一種以文件形式存儲的數據庫模型骨架,無法直接通往數據庫端,也就是說它不具備對數據庫的操作能力,僅僅只是數據庫模型在程序片段中的一種表現,可以說是數據屬性模型(傳統意義的表結構),又或著是“集合”的模型骨架。

比如定義一個Schema:

var mongoose = require("mongoose");

var TestSchema = new mongoose.Schema({
    name : { type:String },//屬性name,類型為String
    age  : { type:Number, default:0 },//屬性age,類型為Number,默認為0
    time : { type:Date, default:Date.now },
    email: { type:String,default:''}
});

Model

由Schema構造生成的模型,除了Schema定義的數據庫骨架以外,還具有數據庫操作的行為,類似于管理數據庫屬性、行為的類。

比如定義一個Model:

var db = mongoose.connect("mongodb://127.0.0.1:27017/test");

// 創建Model
var TestModel = db.model("test1", TestSchema);

Entity

由Model創建的實體,使用save方法保存數據,Model和Entity都有能影響數據庫的操作,但Model比Entity更具操作性。

比如定義一個Entity:

var TestEntity = new TestModel({
      name : "Lenka",
      age  : 36,
      email: "lenka@qq.com"
});
console.log(TestEntity.name); // Lenka
console.log(TestEntity.age); // 36

基本就介紹到這里

因為我們要使用數據庫,那就來創建它。使用的就是上述的方法

首先,在項目根目錄下建立一個database文件夾,建立文件 models.js 然后建立model處理文件 dbHandel.js

寫入文件 models.js 一個user集合,里面有name和password屬性

module.exports = {
    user:{
        name:{type:String,required:true},
        password:{type:String,required:true}
    }
};

寫入文件 dbHandel.js 里邊主要是獲取 Schema 然后處理獲取 model ,最后就是返回一個model了(提供其他文件對model的操作 -- Entity是使用)

var mongoose = require('mongoose');
var Schema = mongoose.Schema;
var models = require("./models");

for(var m in models){
    mongoose.model(m,new Schema(models[m]));
}

module.exports = {
    getModel: function(type){
        return _getModel(type);
    }
};

var _getModel = function(type){
    return mongoose.model(type);
};

app.js中加上

var multer = require('multer');
var mongoose = require('mongoose');

global.dbHandel = require('./database/dbHandel');
global.db = mongoose.connect("mongodb://localhost:27017/nodedb");

// 下邊這里也加上 use(multer())
app.use(bodyParser.urlencoded({ extended: true }));
app.use(multer());
app.use(cookieParser());

session

安裝express-session 模塊

然后在app.js中引用它并作初始設置:

var session = require('express-session');

var app = express();
app.use(session({
    secret: 'secret',
    cookie:{
        maxAge: 1000*60*30;
    }
}));

app.use(function(req,res,next){
    res.locals.user = req.session.user;  // 從session 獲取 user對象
    var err = req.session.error;  //獲取錯誤信息
    delete req.session.error;
    res.locals.message = "";  // 展示的信息 message
    if(err){
        res.locals.message = '<div class="alert alert-danger" style="margin-bottom:20px;color:red;">'+err+'</div>';
    }
    next();  //中間件傳遞
});

當然了,把所以路徑的處理放在同一個index.js事實上有點糟糕,可以考慮分著寫:(這里提供一種思路分出模塊)

比如一個home.js模塊里邊:

module.exports = function ( app ) {
    app.get('/logout', function(req, res){
        req.session.user = null;
        req.session.error = null;
        res.redirect('/');
    });
}

從而只需要在index.js模塊里邊引用即可

module.exports = function ( app ) {
    require('./logout')(app);
};

在app.js模塊中再引用一下就可以(routes目錄下index.js是默認文件,所以可以省略index)

require('./routes')(app);

啟動項目

npm start

瀏覽器輸入 http://localhost:3000 訪問(期間可以自己查看mongodb數據庫里邊nodedb --> user 數據的改動,使用mongoVUE或者命令查看)

原文看起來有點費勁我擅自改動了,希望作者不要打我
http://www.cnblogs.com/Leo_wl/p/4361289.html

最后編輯于
?著作權歸作者所有,轉載或內容合作請聯系作者
平臺聲明:文章內容(如有圖片或視頻亦包括在內)由作者上傳并發布,文章內容僅代表作者本人觀點,簡書系信息發布平臺,僅提供信息存儲服務。
  • 序言:七十年代末,一起剝皮案震驚了整個濱河市,隨后出現的幾起案子,更是在濱河造成了極大的恐慌,老刑警劉巖,帶你破解...
    沈念sama閱讀 228,505評論 6 533
  • 序言:濱河連續發生了三起死亡事件,死亡現場離奇詭異,居然都是意外死亡,警方通過查閱死者的電腦和手機,發現死者居然都...
    沈念sama閱讀 98,556評論 3 418
  • 文/潘曉璐 我一進店門,熙熙樓的掌柜王于貴愁眉苦臉地迎上來,“玉大人,你說我怎么就攤上這事。” “怎么了?”我有些...
    開封第一講書人閱讀 176,463評論 0 376
  • 文/不壞的土叔 我叫張陵,是天一觀的道長。 經常有香客問我,道長,這世上最難降的妖魔是什么? 我笑而不...
    開封第一講書人閱讀 63,009評論 1 312
  • 正文 為了忘掉前任,我火速辦了婚禮,結果婚禮上,老公的妹妹穿的比我還像新娘。我一直安慰自己,他們只是感情好,可當我...
    茶點故事閱讀 71,778評論 6 410
  • 文/花漫 我一把揭開白布。 她就那樣靜靜地躺著,像睡著了一般。 火紅的嫁衣襯著肌膚如雪。 梳的紋絲不亂的頭發上,一...
    開封第一講書人閱讀 55,218評論 1 324
  • 那天,我揣著相機與錄音,去河邊找鬼。 笑死,一個胖子當著我的面吹牛,可吹牛的內容都是我干的。 我是一名探鬼主播,決...
    沈念sama閱讀 43,281評論 3 441
  • 文/蒼蘭香墨 我猛地睜開眼,長吁一口氣:“原來是場噩夢啊……” “哼!你這毒婦竟也來了?” 一聲冷哼從身側響起,我...
    開封第一講書人閱讀 42,436評論 0 288
  • 序言:老撾萬榮一對情侶失蹤,失蹤者是張志新(化名)和其女友劉穎,沒想到半個月后,有當地人在樹林里發現了一具尸體,經...
    沈念sama閱讀 48,969評論 1 335
  • 正文 獨居荒郊野嶺守林人離奇死亡,尸身上長有42處帶血的膿包…… 初始之章·張勛 以下內容為張勛視角 年9月15日...
    茶點故事閱讀 40,795評論 3 354
  • 正文 我和宋清朗相戀三年,在試婚紗的時候發現自己被綠了。 大學時的朋友給我發了我未婚夫和他白月光在一起吃飯的照片。...
    茶點故事閱讀 42,993評論 1 369
  • 序言:一個原本活蹦亂跳的男人離奇死亡,死狀恐怖,靈堂內的尸體忽然破棺而出,到底是詐尸還是另有隱情,我是刑警寧澤,帶...
    沈念sama閱讀 38,537評論 5 359
  • 正文 年R本政府宣布,位于F島的核電站,受9級特大地震影響,放射性物質發生泄漏。R本人自食惡果不足惜,卻給世界環境...
    茶點故事閱讀 44,229評論 3 347
  • 文/蒙蒙 一、第九天 我趴在偏房一處隱蔽的房頂上張望。 院中可真熱鬧,春花似錦、人聲如沸。這莊子的主人今日做“春日...
    開封第一講書人閱讀 34,659評論 0 26
  • 文/蒼蘭香墨 我抬頭看了看天上的太陽。三九已至,卻和暖如春,著一層夾襖步出監牢的瞬間,已是汗流浹背。 一陣腳步聲響...
    開封第一講書人閱讀 35,917評論 1 286
  • 我被黑心中介騙來泰國打工, 沒想到剛下飛機就差點兒被人妖公主榨干…… 1. 我叫王不留,地道東北人。 一個月前我還...
    沈念sama閱讀 51,687評論 3 392
  • 正文 我出身青樓,卻偏偏與公主長得像,于是被迫代替她去往敵國和親。 傳聞我的和親對象是個殘疾皇子,可洞房花燭夜當晚...
    茶點故事閱讀 47,990評論 2 374

推薦閱讀更多精彩內容