一.什么是Express汰翠？
Express是最流行的Node框架家浇，是許多其他流行 Node框架的底層庫(kù)
1.Express框架核心特性
可以設(shè)置中間件來(lái)響應(yīng)HTTP請(qǐng)求
定義了路由表用于執(zhí)行不同的HTTP請(qǐng)求動(dòng)作
可以通過(guò)向模板傳遞參數(shù)來(lái)動(dòng)態(tài)渲染HTML頁(yè)面。
二.安裝express
1.express 肯定基于在node 環(huán)境中安裝翁垂，我們可以通過(guò)終端輸入npm -v來(lái)查看我們是否安裝了node環(huán)境
2.通過(guò)終端來(lái)安裝express框架（全局下安裝）
1匀油、npm install -g express
2凑懂、npm install -g express-generator
三.express創(chuàng)建項(xiàng)目
1.express項(xiàng)目名
2.執(zhí)行完畢后終端會(huì)出現(xiàn)步驟螺句，按照下面的步驟依次執(zhí)行
執(zhí)行完之后會(huì)在本地文件夾中創(chuàng)建好項(xiàng)目
- 文件
app.js ： 是工程的配置文件
bin : 創(chuàng)建服務(wù)器的文件夾
node_modules ：是安裝node后用來(lái)存放包管理器虽惭，下載安裝包的文件夾
public : 把所有的靜態(tài)資源(html或者css之類的) 指定放置到入口文件
routes : 路由，儲(chǔ)存數(shù)據(jù)
views ： 是創(chuàng)建express項(xiàng)目自帶的jade文件
3.通過(guò)終端安裝熱更新
在終端輸入npm install nodemon
安裝好之后蛇尚，找到package.json文件芽唇，將start下的node改為 nodemon
4.通過(guò)終端安裝模板引擎（使用jade就不用安裝，這里使用的是html）
npm install express-art-template
安裝好以后需要更改在文件夾中的名字
4.1 首先得找到app.js,在設(shè)置模板引擎前引入引擎（view enginer setup（視圖引擎設(shè)置））
4.2 在設(shè)置模板引擎中的jade改為html
5.啟動(dòng)項(xiàng)目
npm start
6.查看項(xiàng)目
- 輸入本地路徑取劫，端口號(hào)為3000
在瀏覽器輸入127.0匆笤。0.1:3000
創(chuàng)建數(shù)據(jù)庫(kù)，mvc流程
- 一.mvc組成：由model谱邪、view炮捧、controller組成
1.model: 負(fù)責(zé)跟數(shù)據(jù)庫(kù)映射（一個(gè)變量映射一個(gè)表）關(guān)系的操作數(shù)據(jù)庫(kù)
2.view：前端頁(yè)面的渲染（也叫視圖層）
3.controller: 控制層，富足對(duì)數(shù)據(jù)庫(kù)進(jìn)行處理惦银，前端給后端發(fā)送的請(qǐng)求（req）和后端給前端發(fā)送的響應(yīng)（res）都要在controller層處理
最終由API創(chuàng)建路徑咆课，同時(shí)調(diào)用controller層的方法，完成整個(gè)接口開(kāi)發(fā)
- 二. mvc中文件的關(guān)系
1.一個(gè)model文件對(duì)應(yīng)一個(gè)server文件
2.一個(gè)server文件對(duì)應(yīng)一個(gè)controller文件
3.一個(gè)controller文件對(duì)應(yīng)一個(gè)API文件
4.這些文件名都要保持一致扯俱，方便維護(hù)
7.在當(dāng)前項(xiàng)目中創(chuàng)建一個(gè)config文件夾傀蚌，用來(lái)建立數(shù)據(jù)庫(kù)
- 創(chuàng)建database.js文件
database.js 文件導(dǎo)出的是一個(gè)對(duì)象，對(duì)象中包含著所有跟數(shù)據(jù)庫(kù)有關(guān)的參數(shù)
//導(dǎo)出
module.exports={
database : 'data', //數(shù)據(jù)庫(kù)名
username:'root', //數(shù)據(jù)庫(kù)用戶名
password：' ', //數(shù)據(jù)庫(kù)密碼蘸吓，沒(méi)有設(shè)置就是為空
dialect ：'mysql', //數(shù)據(jù)庫(kù)
host：'localhost', // 數(shù)據(jù)庫(kù)主機(jī)名
port：'3306',//數(shù)據(jù)庫(kù)端口號(hào),//數(shù)據(jù)庫(kù)端口號(hào) navicat中是多少就寫(xiě)多少善炫，如果被占用可以更改（3000-9000）
timezone：'+08:00'；//中國(guó)時(shí)區(qū)//因?yàn)橹袊?guó)事件采用東八時(shí)區(qū)的
}
//pool 數(shù)據(jù)庫(kù)連接池库继，減少數(shù)據(jù)庫(kù)壓力
pool ： {
max : 10,
min: 0,
acquire :
}
在當(dāng)前項(xiàng)目中箩艺，通過(guò)終端安裝sequelize模塊
8.我可以在pages文件夾創(chuàng)建一個(gè)page.html∠芴眩可以通過(guò)這個(gè)文件夾賴家成html模板艺谆，方便我們寫(xiě)代碼
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
<link rel="stylesheet" href="stylesheets/style.css">
<link rel="stylesheet" href="stylesheets/{{file}}.css">
{{block 'head'}}{{/block}}
</head>
<body>
{{block 'content'}}{{/block}}
</body>
<script src="javascripts/{{file}}.js"></script>
</html>
-
在路由的文件中設(shè)置file
file這一條鍵值對(duì)是當(dāng)前頁(yè)面下所說(shuō)的css 和 js的文件名
- 在其他頁(yè)面中繼承page.html
{{extend './page.html '}}//extend 繼承
{{block 'content'}}
<h1>這里繼承了page中的模板</h1>
{{/block}}
9.在當(dāng)前項(xiàng)目中創(chuàng)建model 文件夾，用來(lái)映射數(shù)據(jù)表
-
創(chuàng)建index.js
1.sequelize 模塊拜英，并解析出Sequelize和 Datatypes
2.導(dǎo)出數(shù)據(jù)庫(kù)設(shè)置模塊(config/database)
3.實(shí)例化數(shù)據(jù)庫(kù)對(duì)象
4.引入數(shù)據(jù)庫(kù)
5.更新數(shù)據(jù)庫(kù)
6.導(dǎo)出數(shù)據(jù)表
//引入sequelize模塊
let {Sequelize,DataTypes} = require('sequelize');
//引入數(shù)據(jù)庫(kù)設(shè)置 （require 引入）
let db = require ('../config/database');
//實(shí)例化數(shù)據(jù)庫(kù)對(duì)象
let sequelize = new Sequelize（db）静汤；
//引入數(shù)據(jù)表
let user = require('../user')(sequelize,DataTypes);
//更新數(shù)據(jù)庫(kù)
sequelize.sync()';
//導(dǎo)出數(shù)據(jù)表
module.exports = {
user,
}
-
創(chuàng)建數(shù)據(jù)表文件user.js
-
設(shè)置數(shù)據(jù)表
1.文件名跟數(shù)據(jù)表名保持一致，此文件導(dǎo)出的是一個(gè)方法
2.每一個(gè)字段都是一個(gè)對(duì)象居凶，字段名就是這個(gè)對(duì)象的key
3.設(shè)置id虫给，需要設(shè)置主鍵和主鍵自動(dòng)遞增
//直接返回一個(gè)方法
module.exports = (sequelize, DataTypes) => sequelize.define('user', {
//sequelize.define() 是sequelize插件對(duì)數(shù)據(jù)表的映射方法
//第一個(gè)參數(shù)是表名
//第二個(gè)參數(shù)是表字段的設(shè)置
//每一個(gè)字段都是一個(gè)對(duì)象，字段名就是這個(gè)對(duì)象的key
user_id: {
type: DataTypes.INTEGER(11), //設(shè)置字段數(shù)據(jù)類型
allowNull: false, //不允許為空
primaryKey : true, //設(shè)置主鍵
autoIncrement : true, //設(shè)置主鍵自動(dòng)遞增
},
username:{
type: DataTypes.STRING, //設(shè)置字段數(shù)據(jù)類型
allowNull: false, //不允許為空
unique : true, //設(shè)置唯一性
},
password : {
type: DataTypes.STRING, //設(shè)置字段數(shù)據(jù)類型
allowNull: false, //不允許為空
},
phone : {
type: DataTypes.STRING, //設(shè)置字段數(shù)據(jù)類型
allowNull: false, //不允許為空
unique : true, //設(shè)置唯一性
},
});
10.在當(dāng)前項(xiàng)目創(chuàng)建server文件夾侠碧，用來(lái)操作數(shù)據(jù)表
引入model表的映射
設(shè)置添加用戶的方法
1.方法中抹估，會(huì)將前端發(fā)送過(guò)來(lái)的數(shù)據(jù)（req.body/req.query）發(fā)送給數(shù)據(jù)庫(kù)，并將數(shù)據(jù)庫(kù)返回的信息發(fā)送給前端（以回調(diào)函數(shù)的形式）
第一個(gè)參數(shù)是前端發(fā)送過(guò)來(lái)的數(shù)據(jù)
第二個(gè)參數(shù)是回調(diào)函數(shù)
req代表請(qǐng)求
1.post 請(qǐng)求使用req.body 來(lái)接收
2.get 請(qǐng)求使用req.query
res代表響應(yīng)
3.如果數(shù)據(jù)添加成功弄兜，temp會(huì)接收到一個(gè)返回值（成功信息）
4.把所有數(shù)據(jù)庫(kù)的操作方法以對(duì)象的形式導(dǎo)出
-
創(chuàng)建user.js文件
//引入model表的映射
let model = require('../model'); //index可以省略不寫(xiě),其他的不可以省略
//聲明一個(gè)變量 接收user表
let user = model.user;
//添加用戶的方法
function addUser(obj,callback){
let temp = user.create({
username : obj.username,
password : obj.password,
phone : obj.phone,
});
// 如果數(shù)據(jù)添加成功药蜻，temp會(huì)接收到一個(gè)返回值(成功信息)
//如果失敗瓷式，temp不會(huì)接收到任何東西
var data;
if(temp){
//成功
data = {
msg : 'success',
code : 1,
}
}else{
//失敗
data = {
msg : 'error',
code : 0,
}
}
callback(data);
}
module.exports = {
addUser,
}
11.在當(dāng)前項(xiàng)目創(chuàng)建 controller 文件夾，用來(lái)做前后端交互语泽，數(shù)據(jù)處理
引入server表的操作
設(shè)置添加用戶的數(shù)據(jù)處理
在定義的數(shù)據(jù)處理方法中調(diào)用
- server方法中第一個(gè)參數(shù)req.body / req.query
2.server 方法中第二個(gè)參數(shù)贸典，回調(diào)函數(shù)，在回調(diào)函數(shù)中以res.send() 向前端發(fā)送數(shù)據(jù)server方法踱卵。
將所有的數(shù)據(jù)處理方法以對(duì)象的形式導(dǎo)出
-
創(chuàng)建suer.js文件
//交互,數(shù)據(jù)處理 server => contorller
//引入 server表的操作
let user = require('../server/user');
//添加用戶的數(shù)據(jù)處理
function c_addUser(req,res){
user.addUser(req.body,function(data){
res.send(data);
})
}
module.exports = {
c_addUser,
}
12.在當(dāng)前項(xiàng)目中創(chuàng)建 api 文件夾 這是一個(gè)接口
api是傳給前端
引入controller控制器
設(shè)置添加用戶API
使用express 中的路由模塊來(lái)設(shè)置api路徑
使用router 中 get /post方法 定義api 路徑和請(qǐng)求方法
導(dǎo)出路由模塊 router
找到app.js文件瓤漏，在里面設(shè)置引入API、掛載API
1.引入API
//引入API
var userApi = require（'./api/user'）颊埃；
2.API掛載
//API 掛載
app.use('/userapi,userApi')
-
創(chuàng)建user.js文件
//接口 controller => api
//api 傳給前端
var express = require('express');
var router = express.Router( );
var express = require('express');
var router = express.Router ( );
//引入controller 控制器
let user = require（' ../controller/user'）;
//設(shè)置添加用戶ApI
router.post('./add',user.c_addUser);
module.exports = router
13.最后在使用終端蔬充，在本項(xiàng)目中安裝mysql2依賴，然后啟動(dòng)項(xiàng)目
npm install mysql2
npm start
以上就是創(chuàng)建一個(gè)express項(xiàng)目的完整步驟
express 是一個(gè)經(jīng)典的mvc架構(gòu)
-
這是所有express創(chuàng)建好的所有文件夾目錄
-
整個(gè)過(guò)程
前端 => Api => controller = > server = > model => 后端
四. 測(cè)試接口
寫(xiě)好接口之后要進(jìn)行測(cè)試班利，看是否可以正常使用
通過(guò)瀏覽器的插件進(jìn)行測(cè)試（apizza）
1.點(diǎn)擊發(fā)送進(jìn)行測(cè)試饥漫，如果接口可以使用，則返回成功罗标，（這是自定義的返回方法的返回值）
2.點(diǎn)擊發(fā)送進(jìn)行測(cè)試庸队，如果接口不可以使用，則會(huì)返回失敗
3.然后可以看到數(shù)據(jù)庫(kù)中可以查看我們新建的數(shù)據(jù)表
