python 收银系统_实现全栈收银系统(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頁面中進行引入進行連接mongodbclass 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) => {})判斷注冊郵箱是否存在var userFind = mongoHelper.findOne("test",{email: req.body.email});羅列填寫的數據const newUser = new User({
name: req.body.name,
email: req.body.email,
avatar,
password:req.body.password,
identity:req.body.identity
})密碼處理
密碼加密操作安裝(使用參考npm) npm install bcrypt -S數據儲存await mongoHelper.insertOne("test",newUser);
return res.status(200).json(newUser); //打印在控制臺的數據avatar的獲取全國通用頭像的鏈接安裝:npm i gravatar
const avatar = gravatar.url(req.body.email, {s: '200', r: 'pg', d: 'mm'});
登錄(獲取token)
router.post(“/login”,async(req,res) => {})查詢數據庫,判斷用戶是否存在mongoHelper.findOne("test",{email}).then(user => {})密碼是否匹配(bcrypt.compare)
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,后續繼續更新,多謝支持
https://juejin.im/post/5e202fbff265da3e0163eb09
總結
以上是生活随笔為你收集整理的python 收银系统_实现全栈收银系统(Node+Vue)(一)的全部內容,希望文章能夠幫你解決所遇到的問題。
- 上一篇: 如何解决Css属性text-overfl
- 下一篇: 如何利用小程序布局社交电商?