使用nuxt,express,mysql,nginx创建个人博客系列-06

132
2020-01-24 18:37
5 个月前

添加admin路由中间件

开始编写之前我把端口改回了3000。不会改的可以看前面文章,需要改的地方有两处。
在server目录添加admin目录然后添加index.js文件看起来是这样的server/admin/index.js
文件内容如下

import express from 'express'
import ejs from 'ejs' // 使用ejs模板引擎
import path from 'path'
import bodyParser from 'body-parser'  //引入body_parser解释请求体
import session from 'express-session'  // 引入express-sesiion记录session登陆态
import config from '../config' // 引入 server/config/index.js
import router from './routers' // 引入 server/admin/routers/index.js
const admin = express()
let jsonParser = bodyParser.json({
  limit: '50mb'
})
let urlPaser = bodyParser.urlencoded({
  extended: true,
  limit: '50mb'
})
admin.use(jsonParser); //jsonParser 中间件
admin.use(urlPaser); //urlParser 中间件
/**
 * 通过配置设置session的名字,和保存时间,加密字符等
 */
admin.use(session({
  name: config.admin.session.name, // 设置 cookie 中保存 session id 的字段名称
  secret: config.admin.session.secret, // 通过设置 secret 来计算 hash 值并放在 cookie 中,使产生的 signedCookie 防篡改
  cookie: {
    maxAge: config.admin.session.maxAge // 过期时间,过期后 cookie 中的 session id 自动删除
  },
  resave:config.admin.session.resave,
  saveUninitialized:config.admin.session.saveUninitialized
}))
admin.set('views', path.join(__dirname,'./views')) //设置页面目录
admin.engine('html', ejs.__express) //设置html引擎,因为我在views里使用了html的文件
admin.set('view engine', 'html') //设置视图引擎
//设置静态路径
admin.use('/static',express.static(path.join(__dirname,'./public'))) //设置静态资源路径
admin.use(router); //使用admin路由

export default admin

下面是配置文件server/config/index.js

export default{
"admin":{
    "route":"/myadmin", //进入admin路由配置
    "session":{ //session配合
      "name":"mysession:s",
      "secret":"你的加密字符",
      "maxAge":2500000,
      "resave":false,//每次请求都会重新设置
      "saveUninitialized" :false,//为空不保存
    }
  }
}

以下是server/admin/routers/index.js

import {
  Router
} from 'express'
const router = Router()
import _ from 'lodash'
import config from '../../config' //引入配置文件
/**
 * 合并请求内容到body,然后传递给下一个中间件
 */
router.use((req, res, next) => {
  req.body = _.assign({}, _.cloneDeep(req.query), _.cloneDeep(req.body));
  next()
})
/**
 * 定义检查是否已登录的中间件,检测到已登录的进到路由会跳转到dashboard路由
 */
let checklogin = (req, res, next) => {
  if (req.session && req.session.user && req.session.user.id) {
    return res.redirect(`${config.admin.route}/dashboard`)
  } else {
    next();
  }
}
/**
 * 定义检查是否未登录的中间件,检测到未登录会跳转到login路由
 */
let checkNoLogin = (req, res, next) => {
  if (req.session && req.session.user && req.session.user.id) {
    next();
  } else {
    return res.redirect(`${config.admin.route}/login`)
  }
}
/**
 * 首页会跳到登录页面
 */
router.get('/', (req, res, next) => {
  return res.redirect(`${config.admin.route}/login`)
})
/**
 * login页面渲染
 */
router.get('/login', checklogin, (req, res, next) => {
  res.render('login', {
    'module_dir': config.admin.route
  })
})
/**
 * register页面渲染
 */
router.get('/register', checklogin, (req, res, next) => {
  res.render('register', {
    'module_dir': config.admin.route
  })
})
/**
 * 后台首页dashboard页面渲染
 */
router.get('/dashboard', checkNoLogin,(req, res, next) => {
  res.render('dashboard', {
    'module_dir': config.admin.route
  })
})

由于篇幅过长余下内容我挪到下一章再讲解,下一章会讲解到login.html,register.html等


上一篇-使用nuxt,express,mysql,nginx创建个人博客系列-05
下一篇-使用nuxt,express,mysql,nginx创建个人博客系列-07