文章目录
一、express 安装
1、使用脚手架 express-generator
npm install express-generator -g #全局安装
express blog-express #创建一个名为blog-express的项目
2、使用webstorm
3、添加依赖
yarn add nodemon cross-env -D
4、修改package.json
"dev": "cross-env NODE_ENV=development nodemon ./bin/www",
"prod": "cross-env NODE_ENV=production nodemon ./bin/www"
二、app.js
var createError = require('http-errors');// 404 页面
var express = require('express');
var path = require('path');
var cookieParser = require('cookie-parser');//解析cookie req.cookies
var logger = require('morgan'); // 记录日志
var indexRouter = require('./routes/index');
var usersRouter = require('./routes/users');
var app = express();
// view engine setup
app.set('views', path.join(__dirname, 'views'));
app.set('view engine', 'pug');
app.use(logger('dev')); //日志
app.use(express.json()); //处理 postData req.body
app.use(express.urlencoded({ extended: false })); //解析application/x-www-form-urlencoded 表单参数 req.body
app.use(cookieParser()); // 解析cookie req.cookies
app.use(express.static(path.join(__dirname, 'public')));
//处理路由
app.use('/', indexRouter);
app.use('/users', usersRouter);
// catch 404 and forward to error handler
app.use(function(req, res, next) {
next(createError(404));
});
// error handler
app.use(function(err, req, res, next) {
// set locals, only providing error in development
res.locals.message = err.message;
res.locals.error = req.app.get('env') === 'development' ? err : {};
// render the error page
res.status(err.status || 500);
res.render('error');
});
module.exports = app;
三、路由
1、加路由
var express = require('express');
var router = express.Router();
/* GET users listing. */
router.get('/list', function (req, res, next) {
res.json({errno: 0, data: [1, 2, 3]})
});
module.exports = router;
app.js
var blogRouter = require('./routes/my/blog');
app.use('/api/blog', blogRouter);
2、完整示例:
var express = require('express');
const {SuccessModel, ErrorModel} = require('../../model/resModel');
var router = express.Router();
const loginCheck = require('../../middleware/loginCheck')
/* GET users listing. */
router.get('/list', function (req, res, next) {
let author = req.query.author || '';
let keyword = req.query.keyword || '';
getList(author, keyword).then(list => {
res.json(new SuccessModel(list))
})
});
router.get('/detail', loginCheck, function (req, res, next) {
let id = req.query.id;
getDetail(id).then(data => {
res.json(new SuccessModel(data))
})
});
router.get('/new', loginCheck, function (req, res, next) {
newBlog(body).then(data => {
res.json(new SuccessModel(data))
})
});
router.get('/update', loginCheck, function (req, res, next) {
let id = req.query.id
updateBlog(id, body).then(result => {
if (result) {
res.json(new SuccessModel())
} else {
res.json(new ErrorModel('更新博客失败'))
}
})
});
router.get('/del', loginCheck, function (req, res, next) {
let id = req.query.id;
let author = req.query.author || '';
delBlog(id, author).then(result => {
if (result) {
res.json(new SuccessModel())
} else {
res.json(new ErrorModel('删除博客失败'))
}
})
});
module.exports = router;
四、express中间件
本质上就是请求的拦截器
const express = require('express')
// 本次 http 请求的实例
const app = express()
app.use((req, res, next) => {
console.log('请求开始...', req.method, req.url)
next()
})
app.use((req, res, next) => {
// 假设在处理 cookie
req.cookie = {
userId: 'abc123'
}
next()
})
app.use((req, res, next) => {
// 假设处理 post data
// 异步
setTimeout(() => {
req.body = {
a: 100,
b: 200
}
next()
})
})
app.use('/api', (req, res, next) => {
console.log('处理 /api 路由')
next()
})
app.get('/api', (req, res, next) => {
console.log('get /api 路由')
next()
})
app.post('/api', (req, res, next) => {
console.log('post /api 路由')
next()
})
// 模拟登录验证
function loginCheck(req, res, next) {
setTimeout(() => {
console.log('模拟登陆失败')
res.json({
errno: -1,
msg: '登录失败'
})
// console.log('模拟登陆成功')
// next()
})
}
app.get('/api/get-cookie', loginCheck, (req, res, next) => {
console.log('get /api/get-cookie')
res.json({
errno: 0,
data: req.cookie
})
})
app.post('/api/get-post-data', loginCheck, (req, res, next) => {
console.log('post /api/get-post-data')
res.json({
errno: 0,
data: req.body
})
})
app.use((req, res, next) => {
console.log('处理 404')
res.json({
errno: -1,
msg: '404 not fount'
})
})
app.listen(3000, () => {
console.log('server is running on port 3000')
})
五、express登录
1、使用 express-session 和 connect-redis
yarn add express-session
app.js
let session = require('express-session'); // session
app.use(session({
secret: 'asdXXnkj_asdnsk_90789_sad',
cookie: {
path: '/',//默认
httpPnly: true,//默认
maxAge: 24 * 60 * 60 * 1000
}
})); // 处理session
测试:
router.get('/session-test', function (req, res, next) {
let session = req.session;
if (session.vievCount == null) {
session.vievCount = 0;
}
session.vievCount++;
res.json(session.vievCount)
});
2、req.session 保存登录信息到redis
yarn add redis connect-redis
redis.js
const redis = require('redis')
const {REDIS_CONF} = require('../conf/db')
//创建客户端
let redisClient = redis.createClient(REDIS_CONF.port, REDIS_CONF.host);
redisClient.on('error', err => {
console.log(err)
});
module.exports = redisClient
app.js
let RedisStore = require('connect-redis')(session);
let redisClient = require('./db/redis');
let sessionStore = new RedisStore({
client: redisClient
});
app.use(session({
secret: 'asdXXnkj_asdnsk_90789_sad',
cookie: {
path: '/',//默认
httpPnly: true,//默认
maxAge: 24 * 60 * 60 * 1000
},
store: sessionStore
})); // 处理session
3、登录校验做成express中间件
loginCheck.js
const {SuccessModel, ErrorModel} = require('../model/resModel');
module.exports = (re, res, next) => {
if (require.session.username) {
next()
} else {
res.json(new ErrorModel("未登录"))
}
}
路由里面:
blog.js
const loginCheck = require('../middleware/loginCheck')
router.post('/new', loginCheck, (req, res, next) => {
req.body.author = req.session.username
const result = newBlog(req.body)
return result.then(data => {
res.json(
new SuccessModel(data)
)
})
})
五、日志配置
1、access log 记录 直接使用脚手架推荐的morgan
app.use(logger('dev')); //直接打印控制台日志
- 默认是输出到控制台,即:
app.use(logger('dev',{
stream: process.stdout
}));
-
dev:表示日志的格式,可以改成combined
-
配置详情:https://github.com/expressjs/morgan
-
修改日志输出文件:
最终配置:
let env = process.env.NODE_ENV;
if (env === 'developement') {
//开发环境或测试环境
app.use(logger('dev')); //日志
} else {
//线上环境
let accessPath = path.join(__dirname, 'logs', 'access.log');
let writeStream = fs.createWriteStream(accessPath, {
flags: 'a'
})
app.use(logger('combined', {
stream: writeStream
})); //日志
}
六、中间件原理
- app.use 用来注册中间件,先收集起来
- 遇到http请求,根据path和method判断触发哪些
- 实现next机制,即上一个通过next触发下一个
类似于express的代码:
const http = require('http');
const slice = Array.prototype.slice;
class LikeExpress {
constructor() {
//存放中间件的列表
this.routes = {
all: [],
get: [],
post: []
}
}
register(path) {
let info = {};
if (typeof path === 'string') {
info.path = path;
//从第二个参数开始,转换为数组,存入stack
info.stack = slice.call(arguments, 1)//数组
} else {
info.path = '/'
//从第1个参数开始,转换为数组,存入stack
info.stack = slice.call(arguments, 0)//数组
}
return info;
}
use() {
let info = this.register.apply(this, arguments);
this.routes.all.push(info);
}
get() {
let info = this.register.apply(this, arguments);
this.routes.get.push(info);
}
post() {
let info = this.register.apply(this, arguments);
this.routes.post.push(info);
}
match(method, url) {
let stack = [];
if (url === '/favicon.ico') {
return stack;
}
//获取routers
let currentRoutes = [];
currentRoutes = currentRoutes.concat(this.routes.all);
currentRoutes = currentRoutes.concat(this.routes[method]);
currentRoutes.forEach(routerInfo => {
// url === '/api/get-cookie' 且 routeInfo.path === '/'
// url === '/api/get-cookie' 且 routeInfo.path === '/api'
// url === '/api/get-cookie' 且 routeInfo.path === '/api/get-cookie'
if (url.indexOf(routerInfo.path) === 0) {
stack = stack.concat(routerInfo.stack);
}
})
return stack;
}
//核心的next机制
handle(req, res, stack) {
let next = () => {
//拿到第一个匹配的中间件
let middleWare = stack.shift();
if (middleWare) {
middleWare(req, res, next)
}
};
next();
}
callBack() {
return (req, res) => {
res.json = (data) => {
res.setHeader('Content-Type', 'application/json');
res.end(JSON.stringify(data));
};
let url = req.url;
let method = req.method.toLowerCase();
let resultList = this.match(method, url);
this.handle(req, res, resultList);
}
}
listen(...args) {
let server = http.createServer(this.callBack());
server.listen(...args)
}
}
//工厂函数
module.exports = () => {
return new LikeExpress();
}
测试:
let express = require('./simple')
//本次http请求的实例
let app = express();
app.use((req, res, next) => {
console.log('请求开始...', req.method, req.url)
next()
})
app.use((req, res, next) => {
// 假设在处理 cookie
console.log('处理 cookie ...')
req.cookie = {
userId: 'abc123'
}
next()
})
app.use('/api', (req, res, next) => {
console.log('处理 /api 路由')
next()
})
app.get('/api', (req, res, next) => {
console.log('get /api 路由')
next()
})
// 模拟登录验证
function loginCheck(req, res, next) {
setTimeout(() => {
console.log('模拟登陆成功')
next()
})
}
app.get('/api/get-cookie', loginCheck, (req, res, next) => {
console.log('get /api/get-cookie')
res.json({
errno: 0,
data: req.cookie
})
})
app.listen(8000, () => {
console.log('server is running on port 8000')
})