前言
不多说,开始愉快的干活吧。
权限控制
我们设计了注册和登入,肯定要考虑到权限控制的,假如没有登录的话只能浏览,登陆后才能发帖或写文章,即使登录了你也不能修改或删除其他人的文章,这就是权限控制。
我们也来给blog添加权限控制,如何实现页面的权限控制呢?一般流行的办法是把用户状态的检查封装成一个中间件,在每个需要权限控制的路由加载该中间件,来判断用户是否登入的状态即可实现页面的权限控制。
在 myblog 下新建 middlewares 目录,在该目录下新建 check.js,添加如下代码:
module.exports = {
/*checkLogin: 当用户信息(req.session.user)不存在,即认为用户没有登录,
则跳转到登录页,同时显示 未登录 的通知,用于需要用户登录才能操作的页面*/
checkLogin: function checkLogin (req, res, next) {
if (!req.session.user) {
req.flash('error', '未登录')
return res.redirect('/signin')
}
next()
},
/*checkNotLogin: 当用户信息(req.session.user)存在,即认为用户已经登录,
则跳转到之前的页面,同时显示 已登录 的通知,如已登录用户就禁止访问登录、注册页面*/
checkNotLogin: function checkNotLogin (req, res, next) {
if (req.session.user) {
req.flash('error', '已登录')
return res.redirect('back')// 返回之前的页面
}
next()
}
}
路由有三种写法:
第一种,直接把路由地址和返回的数据添加到app.js中
//app.js
app.get('/test.html', function(req, res) {
res.send('Hello from route handler');
});
第二种,把路文件一个一个分类加入到app.js中
//app.js
var routes = require('./routes');
app.get('/',routes.index);
//routes/index.js
exports.index=function(req,res){
res.render('index',{title:'Express'});
}
第三种,这是添加到主路由,然后再2级导向,可以最合适的把路由模块分离出来。
//app.js
routes(app);//最佳
//或者
app.use(express.router(routes));
//routes/index.js
module.exports = function(app){
app.get('/',function(req,res){
res.render('index', { title: 'Express' });
});
app.get('/reg', function(req, res) {
res.render('reg', {
title: '用户注册',
});
});
};
路由规则
express
封装了多种 http
请求方式,我们主要只使用 get
和 post
两种,即 app.get()
和 app.post()
app.get()
和 app.post()
的第一个参数都为请求的路径,第二个参数为处理请求的回调函数,回调函数有两个参数分别是 req
和 res
,代表请求信息和响应信息 。路径请求及对应的获取路径有以下几种形式:
req.query
// GET /search?q=tobi+ferret
req.query.q
// => "tobi ferret"
// GET /shoes?order=desc&shoe[color]=blue&shoe[type]=converse
req.query.order
// => "desc"
req.query.shoe.color
// => "blue"
req.query.shoe.type
// => "converse"
req.body
// POST user[name]=tobi&user[email]=tobi@learnboost.com
req.body.user.name
// => "tobi"
req.body.user.email
// => "tobi@learnboost.com"
// POST { "name": "tobi" }
req.body.name
// => "tobi"
req.params
// GET /user/tj
req.params.name
// => "tj"
// GET /file/javascripts/jquery.js
req.params[0]
// => "javascripts/jquery.js"
req.param(name)
// ?name=tobi
req.param('name')
// => "tobi"
// POST name=tobi
req.param('name')
// => "tobi"
// /user/tobi for /user/:name
req.param('name')
// => "tobi"
不难看出:
- req.query: 处理 get 请求,获取 get 请求参数
- req.params: 处理 /:xxx 形式的 get 或 post 请求,获取请求参数
- req.body: 处理 post 请求,获取 post 请求体
- req.param(): 处理 get 和 post 请求,但查找优先级由高到低为
- req.params→req.body→req.query
路径规则还支持正则表达式,更多请查阅Express 官方文档
最终我们创建以下路由文件: routes/index.js
module.exports = function (app) {
app.get('/', function (req, res) {
//重定向到posts
res.redirect('/posts')
})
app.use('/signup', require('./signup'))
app.use('/signin', require('./signin'))
app.use('/signout', require('./signout'))
app.use('/posts', require('./posts'))
app.use('/comments', require('./comments'))
// 404 page
app.use(function (req, res) {
if (!res.headersSent) {
res.status(404).render('404')
}
})
}
routes/posts.js
const express = require('express')
const router = express.Router()
const checkLogin = require('../middlewares/check').checkLogin
// GET /posts 所有用户或者特定用户的文章页
// eg: GET /posts?author=xxx
router.get('/', function (req, res, next) {
res.send('主页')
})
// POST /posts/create 发表一篇文章
router.post('/create', checkLogin, function (req, res, next) {
res.send('发表文章')
})
// GET /posts/create 发表文章页
router.get('/create', checkLogin, function (req, res, next) {
res.send('发表文章页')
})
// GET /posts/:postId 单独一篇的文章页
router.get('/:postId', function (req, res, next) {
res.send('文章详情页')
})
// GET /posts/:postId/edit 更新文章页
router.get('/:postId/edit', checkLogin, function (req, res, next) {
res.send('更新文章页')
})
// POST /posts/:postId/edit 更新一篇文章
router.post('/:postId/edit', checkLogin, function (req, res, next) {
res.send('更新文章')
})
// GET /posts/:postId/remove 删除一篇文章
router.get('/:postId/remove', checkLogin, function (req, res, next) {
res.send('删除文章')
})
module.exports = router
routes/signup.js
const express = require('express')
const router = express.Router()
const checkNotLogin = require('../middlewares/check').checkNotLogin
// GET /signup 注册页
router.get('/', checkNotLogin, function (req, res, next) {
res.send('注册页')
})
// POST /signup 用户注册
router.post('/', checkNotLogin, function (req, res, next) {
res.send('注册')
})
module.exports = router
routes/signin.js
const express = require('express')
const router = express.Router()
const checkNotLogin = require('../middlewares/check').checkNotLogin
// GET /signin 登录页
router.get('/', checkNotLogin, function (req, res, next) {
res.send('登录页')
})
// POST /signin 用户登录
router.post('/', checkNotLogin, function (req, res, next) {
res.send('登录')
})
module.exports = router
routes/signout.js
const express = require('express')
const router = express.Router()
const checkLogin = require('../middlewares/check').checkLogin
// GET /signout 登出
router.get('/', checkLogin, function (req, res, next) {
res.send('登出')
})
module.exports = router
routes/comments.js
const express = require('express')
const router = express.Router()
const checkLogin = require('../middlewares/check').checkLogin
// POST /comments 创建一条留言
router.post('/', checkLogin, function (req, res, next) {
res.send('创建留言')
})
// GET /comments/:commentId/remove 删除一条留言
router.get('/:commentId/remove', checkLogin, function (req, res, next) {
res.send('删除留言')
})
module.exports = router
最后,修改 app.js 如下:
const path = require('path')
const express = require('express')
const session = require('express-session')
const MongoStore = require('connect-mongo')(session)
const flash = require('connect-flash')
const config = require('config-lite')(__dirname)
const routes = require('./routes')
const pkg = require('./package')
const app = express()
// 设置模板目录
app.set('views', path.join(__dirname, 'views'))
// 设置模板引擎为 ejs
app.set('view engine', 'ejs')
// 设置静态文件目录
app.use(express.static(path.join(__dirname, 'public')))
// session 中间件
app.use(session({
name: config.session.key, // 设置 cookie 中保存 session id 的字段名称
secret: config.session.secret, // 通过设置 secret 来计算 hash 值并放在 cookie 中,使产生的 signedCookie 防篡改
resave: true, // 强制更新 session
saveUninitialized: false, // 设置为 false,强制创建一个 session,即使用户未登录
cookie: {
maxAge: config.session.maxAge// 过期时间,过期后 cookie 中的 session id 自动删除
},
store: new MongoStore({// 将 session 存储到 mongodb
url: config.mongodb// mongodb 地址
})
}))
// flash 中间件,用来显示通知
app.use(flash())
// 路由
routes(app)
// 监听端口,启动程序
app.listen(config.port, function () {
console.log(`${pkg.name} listening on port ${config.port}`)
})
注意:中间件的加载顺序很重要。如上面设置静态文件目录的中间件应该放到 routes(app) 之前加载,这样静态文件的请求就不会落到业务逻辑的路由里;flash 中间件应该放到 session 中间件之后加载,因为 flash 是基于 session 实现的。
运行supervisor index
启动博客,访问以下地址查看效果:
待续。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。