本文是刨去express的基本使用,对于express框架下重要部分的学习记录
涉及到的知识点主要以下几点:
- express路由封装使用
- 请求传值获取
- session/cookie使用
- ejs模板使用
- mongoDB操作封装使用
express路由封装使用
将项目中的各路由中间件拆分各自作用的模块,各模块中使用express路由并实例化,实例化后的对象上使用中间件,
最后通过commonjs规范module.exports暴露这个实例化对象, 例如:
登录模块login.js
const express = require('express')
const router = express.Router() //实例化express路由对象
router.get('/login', function(req,res){
res.send('登录页')
})
router.get('/logOut', function(req,res){
res.send('退出页')
})
...
module.exports = router //导出模块
项目主文件app.js中`
const loginmodule = require('./appserver/login/login.js') //引入 (相对路径)
app.use('/login', loginmodule) //使用模块 (项目中请求地址为父级加子级,例子中登录也就是'/login/login')
请求传值获取
- 普通的表单数据获取, 基于body-parser插件
//配置`body-parser`
var bodyParser = require('body-parser');
router.use(bodyParser.urlencoded({ extended: false }))
router.use(bodyParser.json());
- 获取get传值
app.get('/login', function(req, res){
let getdata = req.query; //string
JSON.stringify(getdata) //json
})
- 获取post传值
app.post('/login', function(req, res){
let getdata = req.body; //string
})
- 含有图片文件流的表单获取, 基于multiparty插件
var multiparty = require('multiparty'); /*获取form表单的数据*/
/* 使用步骤
1.var form = new multiparty.Form();
2.form.uploadDir='upload' 上传图片保存的地址
3.form.parse(req, function(err, fields, files) {
fields --->获取表单的数据
files --->图片上传成功返回的信息
4.html form标签添加 enctype="multipart/form-data" 或js Formdata上传
*/
});
例子:`
router.post('/updategoods', function(req, res){
var form = new multiparty.Form();
form.uploadDir='upload' //同app.js路径
form.parse(req, function(err, fields, files) {
console.log(fields); /*获取表单的数据*/
console.log(files); /*图片上传成功返回的信息*/
...
})
})
session/cookie使用
- cookie设置使用
基于是cookie-parser插件
配置
var cookieParser = require('cookie-parser');
app.use(cookieParser('123321')); //参数为加密cookie的基础参数
例子`
app.post('/dologin', (req, res)=>{
/*option参数
maxAge 过期时间
domain:'.aaa.com' 多个二级域名共享cookie
path 表示在哪个路由下面可以访问cookie
httpOnly:true 表示只有在nodejs服务端可以操作cookie
signed:true 加密cookie
*/
//设置cookie
res.cookie('user'+req.body.username, req.body.password, {maxAge: 60*1000*10, signed:true, httpOnly:true})
return res.send('保存cookie成功')
})
- session设置使用
基于express-session
配置`
var session = require("express-session");
app.use(session({
secret: 'this is string key', //String 类型的字符串,作为服务器端生成 session 的签名
name:'session_id', //保存在本地cookie的一个名字 默认connect.sid 可以不设置
resave: false, //强制保存 session 即使它并没有变化,默认为 true。建议设置成 false
saveUninitialized: false, //强制将未初始化的 session 存储。 默认值是true 建议设置成true
cookie: {
maxAge:1000*60*30 //session过期时间
secure:true //只有https可以访问session
},
rolling:true //在每次请求时强行设置 cookie,这将重置cookie过期时间(默认:false)
}))
- 获取session值
let userinfo = req.session.userinfo //获取session中的userinfo
- 设置session值`
req.session.userinfo = '小明'
- 销毁session
req.session.destroy(function(err){
if(err){
console.log(err);
}else{
res.end('session删除成功')
}
})
//或者
req.session.cookie.maxAge=0
- session的存储
主要起到负载均衡的目的, 如多个服务器记录单个session的问题.
基于connect-mongo和express-session插件, 该插件在指定mongodb中新建一个session集合, 用于存储session对象
const session = require("express-session");
const MongoStore = require("connect-mongo")(session);
app.use(session({
... 同上session配置
store: new MongoStore({
url: 'mongodb://127.0.0.1:27017/demo', //数据库地址
touchAfter: 24*60*60 //在24小时内只更新一次会话,不管有多少请求(除了在会话数据上更改某些内容的除外)
})
}))
ejs使用
¶配置
const ejs = require('ejs');
app.set('view engine', 'ejs'); //默认配置
/* 其他配置
app.engine('html', ejs.__express) //修改ejs模板为html引擎
app.set('view engine', 'html'); //设置渲染html文件
app.set('views', __dirname+'/render') //设置模板位置 为render目录
*/
- 渲染模板
router.get('/goods', (req, res)=>{
//模板文件名, ejs变量
res.render("goodslist",{goods:data})
})
-
全局ejs变量赋值
app.locals['abc'] = 20
-
前端使用
输出变量<%=userInfo.username%>
引用公共<%- include ./public/footer.html%>
(相对路径)
逻辑输出
<% for(var i=0;i<goods.length;i++){ %>
<tr>
<% if(goods[i].pic) { %>
<td><img src="/<%=goods[i].pic %>"></td>
<% } else { %>
<td><img src="/upload/error.png"></td>
<% } %>
<td><%=goods[i].name %></td>
<td><%=goods[i].price %></td>
<td><%=goods[i].num %></td>
<td>
<button class="update" data-id="<%=goods[i]._id %>">修改</button>
<button class="delete" data-id="<%=goods[i]._id %>">删除</button>
</td>
</tr>
<% } %>