實現全棧收銀系統（Node+Vue）（一）

前端漸漸趨向後端化，工程化，自動化開發，掌握一門後端語言成了咱們必備的不可少階段，Node的出現讓咱們可以搭建了簡單運算的後臺，實現全棧的開發，如今經過幾個階段來開發一套基於VUE開發的Node後臺系統，區塊式的記錄一些乾貨。

基於Node接口搭建-登陸註冊

1. express搭建服務器

安裝: npm install express
引用: const express = require("express");
複製代碼

設置端口號

const app = express(); 
const port = process.env.PORT || 5000;
app.listen(port,()=>{
    console.log(`Server running on port ${port}`);
})
複製代碼

在控制檯中運行node server.js,便可以開出http://localhost:5000的請求鏈接，那麼咱們能夠根據請求鏈接編寫出第一個請求接口

app.get("/",(req,res) => {
    res.send("Hellow World!")
})
複製代碼

因爲每次保存都要從新執行命令，故咱們能夠安裝npm install nodemon -g避免每次初始執行

2. 鏈接MongoDB數據庫

有了第一步的操做咱們已經可以成功訪問到了一個自定義接口數據了，那麼如今咱們須要根據數據庫的數據執行咱們的接口，在Node中運用封裝好的MongoDB進行操做（此處若有不明白能夠看下以前總結的推文）

安裝：npm install mongoose
引用: const MongoClient = require("mongodb").MongoClient;
複製代碼

建立一個文件keys.js咱們將數據庫鏈接所有編寫進去，方便後期直接調用

module.exports = {
    url: 'mongodb://localhost:27017',
    dbName: 'restful-api-prod',
    secretOrkey: 'secret' //token 調用
}
複製代碼

在server.js頁面中進行引入進行鏈接mongodb

class Mongodb{
    constructor(conf) { //class原型下的構造函數
        //保存conf到構造的集合中
        this.conf=conf //成員變量
        //鏈接
        this.client = new MongoClient(conf.url,{useNewUrlParser:  true}) //建立客戶端
        this.client.connect( err => { //有自動重連的機制
            if(err) {
                throw err
            }
            console.log('鏈接數據庫成功');
        });
    }
}
module.exports = new Mongodb(conf);
複製代碼

3. 搭建路由和數據模型

建立users.js,此處頁面編寫將會涉及到 登陸，註冊，設置Token，密碼加密，用戶，郵箱是否存在判斷，Token識別獲取信息等。

引入router進行接口路由編寫

const express = require("express");
const router = express.Router(); //接口請求
// api/users/test
router.get("/test",(req,res) => {
    res.json({msg:"login works"})
})
module.exports = router;
複製代碼

建立的文件須要到server.js中引用

const users = require("./routes/api/users");
app.use("/api/users",users);
複製代碼

Schema的數據模型建立

const mongoose = require('mongoose');
const Schema = mongoose.Schema;
// Create Schema
const UserSchema = new Schema({
  name: {
    type: String,
    required: true
  },
  email: {
    type: String,
    required: true
  },
  password: {
    type: String,
    required: true
  },
  avatar: { //頭像
    type: String
  },
  identity: {
    type: String,
    required: true
  },
  date: {
    type: Date,
    default: Date.now
  }
});

module.exports = User = mongoose.model('users', UserSchema);

複製代碼

4. 搭建註冊接口並存儲數據

方便後期接口調試的須要安裝下postman，接下來的請求是POST請求，也是相對get請求比較麻煩的一點，POST的請求須要安裝第三方的模塊

npm i body-parser
複製代碼

在 server.js 中引用

const bodyParser = require("body-parser");
 //使用body-parser中間件
 app.use(bodyParser.urlencoded({extended:false})); //開啓往post傳送數據
 app.use(bodyParser.json()); //讓數據json化
複製代碼

引入Schema建立的數據模型 若是引用了那麼咱們能夠根據模型直接 User.findOne 就能在數據庫中查詢，可是未知緣由，在執行時一直沒進去，便接下來都使用了封裝的Promise請求進行操做

註冊

router.post("/register",async(req,res) => {})

1. 判斷註冊郵箱是否存在

var userFind = mongoHelper.findOne("test",{email: req.body.email});
複製代碼

2. 羅列填寫的數據

const newUser = new User({
       name: req.body.name,
       email: req.body.email,
       avatar,
       password:req.body.password,
       identity:req.body.identity
   })
複製代碼

2. 密碼處理

密碼加密操做安裝（使用參考npm） npm install bcrypt -S

3. 數據儲存

await mongoHelper.insertOne("test",newUser);
return res.status(200).json(newUser); //打印在控制檯的數據
複製代碼

4. avatar的獲取全國通用頭像的連接

安裝：npm i gravatar
const avatar = gravatar.url(req.body.email, {s: '200', r: 'pg', d: 'mm'});
複製代碼

登陸(獲取token)

router.post("/login",async(req,res) => {})

1. 查詢數據庫，判斷用戶是否存在

mongoHelper.findOne("test",{email}).then(user => {})
複製代碼

2. 密碼是否匹配（bcrypt.compare）
3. Token 設置

安裝 npm install jsonwebtoken
複製代碼

在判斷匹配密碼成功後進行操做,此處須要注意到的是 token: "Bearer "+token

jwt.sign("規則","加密名字","過時時間","箭頭函數")

const rule = {
        id:user.id,
        name:user.name,
        avatar:user.avatar,
        identity: user.identity,
 };
 jwt.sign(rule,keys.secretOrkey,{expiresIn: 3600},(err,token) => {
    if(err) throw err;
    res.json({
        success: true,
        token: "Bearer "+token
    })
})
複製代碼

使用passport-jwt驗證token（運用在須要請求用戶信息的接口）

安裝 npm i passport-jwt passport

引用 const passport = require("passport"); //對請求進行身份驗證

初始化 app.use(passport.initialize());

代碼抽離模式 require("./config/passport")(passport); //傳對象過去

router.get("/current","驗證token",(req,res) => {
    res.json(req.user);
})
複製代碼

建立passport文件直接在這個頁面操做再拋出，在passport-jwt官網中引用須要的數據

const JwtStrategy = require('passport-jwt').Strategy,
    ExtractJwt = require('passport-jwt').ExtractJwt;
const mongoose = require("mongoose");
// const User = mongoose.model("users");
const keys =require("../config/keys");
const mongoHelper = require('../models/mongoHelper')
const opts = {}
opts.jwtFromRequest = ExtractJwt.fromAuthHeaderAsBearerToken();
opts.secretOrKey = keys.secretOrkey;

複製代碼

//server
router.get("/current",passport.authenticate("jwt",{session:false}),(req,res) => {
    res.json(req.user);
})
//passport.authenticate 驗證token
複製代碼

權限管理（identity）

註冊

登陸

根據token在請求頭的數據請求到用戶的信息

代碼已上傳github，請給star，後續繼續更新，多謝支持