請假審批專案一 環境的搭建

2021-10-12 05:23:36 字數 2897 閱讀 1607

1:後端(提供介面 儲存資料)

準備工作

1:安裝好node

2:安裝好express+express的腳手架

3:利用 express -e 建立專案

4:安裝常用的模組

mongoose 鏈結資料庫

jsonwebtoken 生成token

後端設計

三層

model 資料 (鏈結資料庫+設計每張表)

service 業務 (每張表的增刪改查)

router 控制 (接收呼叫 返回結果)

準備工作  準備設計介面 乙個登陸 乙個註冊 

在model新建兩個檔案db.js usermodel.js(乙個鏈結資料庫的配置  乙個使用者表的結構)

var mongoose = require("mongoose");

var db_url = "mongodb://localhost:27017/2007";

mongoose.connect(db_url,);

//狀態的監聽

mongoose.connection.on("connected",function () );

mongoose.connection.on("error", function (err) );

mongoose.connection.on("disconnected", function () );

//匯出方便其他地方使用 commonjs

module.exports = mongoose;

var mongoose = require("./db.js");

var schema = mongoose.schema; //模型生成器(表生成器)

//建立表 並且指定字段

var userschema = new schema();

//轉成資料模型匯出

module.exports = mongoose.model("userinfo", userschema);

在業務層(service) 新建乙個userinfo.js裡面寫入

let usermodel =require("../model/usermodel");

let userinfo = ,

add:(info)=>

}module.exports = userinfo;//匯出

在控制層(router)

users中宣告兩個介面 router.post("/login")   router.post("/register")

完善登陸和註冊介面

router.post("/register", (req, res, next) =>  = req.body;

var md5 = crypto.createhash('md5'); //crypto模組功能是加密並生成各種雜湊

userpwd = md5.update(userpwd).digest('hex');

//1:判斷使用者名稱是否存在

userinfo.query().then((list) => )

} else ).then(() => )

}, () => )})}

})

router.post("/login",(req,res,next)=> = req.body;

var md5 = crypto.createhash('md5'); //crypto模組功能是加密並生成各種雜湊

userpwd = md5.update(userpwd).digest('hex');

userinfo.query().then((list)=>)

if(list.length)=info;

var token =jwt.sign(,"key",)

res.json()

}else)}})

});

需要引入的一些模組

var express = require('express');

var router = express.router();

var crypto = require("crypto")

var jwt = require("jsonwebtoken")

let userinfo = require("../service/userinfo");

註冊裡面可以驗證使用者名稱是否存在  密碼進行了加密處理

登陸裡面驗證了使用者名稱和密碼是否登入成功   成功以後返回了token

2:前端(頁面展示 呼叫介面)

vue/cli建立專案  vue create  client cli的安裝

建立完以後 配置proxy  安裝好axios   sass(node-sass  sass-loader)  elementui

在vue.config.js中

module.exports = }}

},};

在main.js中

import elementui from 'element-ui';

import 'element-ui/lib/theme-chalk/index.css';

vue.config.productiontip = false

vue.use(elementui);

準備好登入頁面 用的是form表單  (布局  驗證  事件  效果 都封裝好了)

登入重置

webpack react專案搭建一 環境

字數1245 閱讀1180 喜歡4 見知乎文章 tbd mkdir webpack react demo cd webpack react demo npm init touch gitignore touch webpack.config.js 其中.gitignore用於說明 提交時忽略的檔案,...

RobotFramework(一)環境搭建

序號 安裝包名 安裝方法 備註1 python exe檔案,直接雙擊安裝 一切的基礎,安裝路徑不能有空格 設定環境變數 驗證是否成功 cmd輸入python pycharm python ide 2setuptools python 的套件管理程式 安裝在了c python27 lib site p...

ElasticSearch 一 環境搭建

1 2 配置 config elasticsearch.yml network.host 192.168.0.10 本機ip位址 3 啟動 sh bin elasticsearch d 結束 kill 9 pid 啟動成功 head外掛程式是為了更好地查詢和管理es服務的。git clone 執行h...