摘要：學習新技術最快捷的方式就是做項目。利用了來避免回調地獄，使得代碼能夠更好的被讀懂和維護。

學習新技術最快捷的方式就是做項目。這兩天我寫了個基于express和MongoDB的Web登錄功能

Node.js

MongoDB

express

mongoose

Bootstrap

其中MongoDB的簡單使用可以看我上一篇博文

.
├── database 
│?? ├── entity.js //實體Entity
│?? ├── model.js //模型Model
│?? └── schema.js //骨架Schema
├── package.json
├── public
│?? ├── home.html //主頁
│?? ├── login.html //登陸頁
│?? ├── register.html //注冊頁
│?? └── source
│??     ├── login.css
│??     ├── login.less
│??     └── reset.css
├── routes
│?? ├── home.js //主頁路由
│?? ├── login.js //登錄路由
│?? ├── login_process.js //登錄POST處理
│?? ├── register.js //注冊路由
│?? └── register_process.js //注冊POST處理
└── server
    └── index.js //入口文件
    

進入登陸頁面

點擊登錄按鈕并利用POST方法提交

提交的數據傳給后臺與數據庫取出的數據進行匹配按情況分配路由

index.js

app.use("/", loginRouter);
app.use("/login_process", loginProcessRouter);
app.use("/home", homeRouter);
app.use("/register", registerRouter);
app.use("/register_process", registerProcessRouter);

在入口文件中分配路由

login.js

var express = require("express");
var app = express();
var path = require("path");
var router = express.Router();

router.get("/", function (req, res) {
  res.sendFile(path.join(__dirname, "../public", "login.html"));     
});

module.exports = router;

簡單說明一下，當瀏覽器的地址欄變為localhost:3000/的時候，渲染login.html

login_process.js

var express = require("express");
var path = require("path");
var bodyParser = require("body-parser");
var app = express();
var router = express.Router();
var UserModel = require("../database/model");
var UserEntity = require("../database/entity");
var urlencodedParser = bodyParser.urlencoded({ extended: false });

router.post("/", urlencodedParser, function (req, res) { 
  response = {
    username: req.body.username,
    password: req.body.password
  };
  var input_username = response.username;
  var input_password = response.password;
  function getUser() {
    var user;
    user = UserModel.findOne({ USERNAME: input_username })
    .exec()
    .then(function (result) {
      return result;
    })
    .error(function (error) {
      return "Promise Error:" + error;
    })
    return user;
  }
    
  getUser()
    .then(function(result){
      if(result === null) {
        res.redirect("/");
      } else if (input_username === result.USERNAME || input_password === result.PASSWORD) {
        console.log("true");
        res.redirect("/home");    
      } else {
        console.log("false");
        res.redirect("/");
      }
    })
    .error(function(error){
      return "Promise Error:" + error;
    })
});

module.exports = router;

在login_process.js文件內，我們接收到了前端頁面POST過來的數據，并利用mongoose的Model來查詢數據庫與之比較。利用了Promise來避免回調地獄，使得代碼能夠更好的被讀懂和維護。

注：Model模型，是經過Schema構造來的，除了Schema定義的數據庫骨架以外，還具有數據庫行為模型，他相當于管理數據庫屬性、行為的類

這畢竟只是個小demo，有很多不完善的地方，就在這里列出來，以便日后補上

前端輸入提示不友好

沒有利用session和cookie進行登錄攔截

就寫到這里，祝大家have a nice day ；）