博客九

2017-12-15 本文已影响0人我为峰2014

前言

不多说，开始愉快的干活吧。

权限控制

我们设计了注册和登入，肯定要考虑到权限控制的，假如没有登录的话只能浏览，登陆后才能发帖或写文章，即使登录了你也不能修改或删除其他人的文章，这就是权限控制。

我们也来给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启动博客，访问以下地址查看效果：

待续。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。

博客九

前言

权限控制

路由规则

猜你喜欢

热点阅读