02-個人部落格筆記-登入註冊介面的實現

loveli發表於2019-02-16

安裝mongodb

參考 http://www.runoob.com/mongodb…
推薦使用 brew 安裝

安裝完成後執行mongodb

配置資料庫,啟動服務端

1.安裝mongoose
使用npm下載模組時候會發現很慢,所以推薦淘寶的映象。

cnpm i mongoose --save

2.在index.js中連線資料庫

// 載入資料庫模組
const mongoose = require("mongoose");
mongoose.connect(`mongodb://localhost:27017/testblog`,function(err){
    if(err){
        console.log(`資料庫連線失敗`);
    }else{
        console.log(`資料庫連線成功`);
        app.listen(4000);
    }
});

這裡的testblog 是我們建立的資料庫名稱,終端執行node . 或者node index.js 列印資料庫連線成功就說明服務已經啟動

註冊介面實現

1.在寫介面之前還需要安裝一個body-parser外掛,body-parser是非常常用的一個express中介軟體,作用是對post請求的請求體進行解析。

cnpm i body-parser --save

在index.js中引入

var bodyParser = require(`body-parser`);
app.use(bodyParser.urlencoded({ extended: false }))
app.use(bodyParser.json())

2.在routers下新建user.js,配置路由

const express = require(`express`);
const router = express.Router();

router.get(`/regiest`, function(res, rep) {
    rep.send(`Hello, word!`);
});

module.exports = router;

在index.js中使用app.use(`/user`,require(`./routers/user`));這種方式載入路由

var express = require(`express`);
var app = express();
var bodyParser = require(`body-parser`);

//  注意解析要放在上面
app.use(bodyParser.urlencoded({ extended: false }))
app.use(bodyParser.json())

app.use(`/user`,require(`./routers/user`));

// 載入資料庫模組
const mongoose = require("mongoose");

mongoose.connect(`mongodb://localhost:27017/testblog`,function(err){
    if(err){
        console.log(`資料庫連線失敗`);
    }else{
        console.log(`資料庫連線成功`);
        app.listen(4000);
    }
});

重新啟動服務,在瀏覽器中輸入http://localhost:4000/user/regiest,可以看到列印資訊說明路由配置成功。

3.在schemas資料夾下新建user.js , 使用者相關的Schema

var mongoose = require(`mongoose`)

module.exports = new mongoose.Schema({
    // 使用者名稱
    userName: String,
    // 密碼
    passWord: String,
    // 註冊日期
    creatDate: Date,
    token: String
})

4.在models資料夾下新建user.js, 建立使用者相關的模型,資料庫的相關操作都是通過models下面我們建立的模型來操作的。

var mongoose = require(`mongoose`)
var userSchema = require(`../schemas/user`)
module.exports = mongoose.model(`User`, userSchema)

5.註冊介面

router.post(`/regiest`, function(req, res, next) {
    var userName = req.body.userName
    var password = req.body.passWord
    var rePassWord = req.body.rePassWord

    if (userName === ``) {
        responseData.success = false
        responseData.message = `使用者名稱不能為空`
        res.json(responseData)
        return
    }
    if (password === ``) {
        responseData.success = false
        responseData.message = `密碼不能為空`
        res.json(responseData)
        return
    }
    if (password !== rePassWord) {
        responseData.success = false
        responseData.message = `兩次輸入的密碼不一致`
        res.json(responseData)
        return
    }

    User.findOne({
        userName: userName
    }).then((userInfo) => {
        if (userInfo) { // 資料庫中有
            responseData.success = false
            responseData.message = `該使用者已存在`
            res.json(responseData)
            return
        } else {
            // 寫入資料庫
            //獲取hash值  密碼加密
            var hash = bcrypt.hashSync(password, 10)
            //把hash值賦值給password變數
            password = hash

            var user = new User({
                userName: userName,
                passWord: password,
                creatDate: new Date(),
            })
            return user.save()
        }
    }).then((newUserInfo) => {
        responseData.success = true
        responseData.message = `恭喜您,註冊成功`
        responseData.data = {
            userName: newUserInfo.userName,
            userId: newUserInfo._id
        }
        res.json(responseData)
    })
});

其中bcrypt是加密相關的庫

cnpm i bcrypt --save

重啟服務,測試註冊介面。

6.啟動blogclient,我們現在頁面上放置幾個簡單的文字框來測試登入介面,關於blogclient的具體網路配置部分可參考具體的demo

7.登入介面的要注意的是token的生成規則,依賴框jsonwebtoken和express-jwt

cnpm i jsonwebtoken --save
cnpm i express-jwt  --save
// 登入
const jwt = require(`jsonwebtoken`);
router.post(`/login`, function (req, res, next) {
    var userName = req.body.userName
    var password = req.body.passWord

    User.findOne({
        userName: userName
    }).then((userInfo) => {
        if (userInfo) {
            // 判斷密碼是否正確
            const pwdMatchFlag = bcrypt.compareSync(password, userInfo.passWord);
            if (pwdMatchFlag) {
                responseData.success = true
                responseData.message = `登入成功`
                responseData.data = {
                    userName: userInfo.userName,
                    userId: userInfo._id,
                    // token 有效期12h(60 * 60 * 12)
                    token: jwt.sign({
                        data: {_id:userInfo._id,username:userInfo.userName},
                        exp: Math.floor(Date.now() / 1000) + (60 * 60 * 12)
                    }, `jwt-secret`)
                }
                res.json(responseData)
                return
            } else {
                responseData.success = false
                responseData.message = `密碼錯誤`
                res.json(responseData)
                return
            }
        } else {
            responseData.success = false
            responseData.message = `該使用者不存在`
            res.json(responseData)
            return
        }
    })
});

在index.js中匯入

var jwt = require(`express-jwt`);

// token相關regiest和login不需要token驗證
var jwt = require(`express-jwt`);
app.use(jwt({secret: `jwt-secret`, debug: true}).unless({
    path: [`/user/regiest`, `/user/login`]
}))

demo

demo-02-個人部落格筆記-登入註冊介面的實現

相關庫

express-jwt

jsonwebtoken

bcrypt

body-parser

專案上傳  github 每次提交都是一個分支

線上地址

相關文章