mvc三层架构

• mvc， 即 model 、controller、view；
• mvc模式将model、view、controller分离；使用mvc分层是系统更加灵活，扩展性更强。让程序更加直观、复用性更强、可维护性更强。
  • model 负责数据访问；
  • controller 负责消息处理；
  • view 负责视图呈现。
    

利用mvc模式实现后端分层

• mvc分层开发模式: web server : 用户发起请求 => 分析用户请求，处理路由 => 处理数据（操作数据库，操作缓存）=> view（data+template）=> response。即 controller => model => view。
  

实现一个koa框架的web服务

• app.js

const Koa = require('koa');
const KoaRouter = require('koa-router');
const KoaStaticCache = require('koa-static-cache');
const koaBody = require('koa-body');
// 控制器加载
const mainController = require('./contollers/main');
const userController = require('./contollers/user');
const itemController = require('./contollers/item');
const server = new Koa();
const router = new KoaRouter();
// 静态资源处理
server.use( KoaStaticCache('./public', {prefix: '/public',gzip: true,dynamic: true
}) );
// body 解析中间件
server.use( koaBody({multipart: true,// 处理上传的二进制文件formidable: {// 上传目录uploadDir: __dirname + '/public/upload',// 是否保留上传文件名后缀keepExtensions: true}
}));
router.get('/', mainController.index);
router.get('/user/register', userController.register);
router.get('/user/login', userController.login);
router.get('/item/add', itemController.add);
router.post('/item/add', itemController.addPost);
server.use( router.routes() );
server.listen(8081, () => {console.log('服务启动成功：http://localhost:8081')
});

• controller/main.js

const tpl = require('../libs/tpl');
const itemsModel = require('../models/items');
module.exports = {index: async ctx => {let items = await itemsModel.getItems();ctx.body = tpl.render('index.html', {items});  }
}

• controller/user.js

const tpl = require('../libs/tpl');
module.exports = {register: async ctx => {ctx.body = '注册';},login: async ctx => {ctx.body = '登陆'}
}

• controller/item.js

const tpl = require('../libs/tpl');
const categoriesModel = require('../models/categories');
const itemsModel = require('../models/items');
module.exports = {add: async ctx => {let categories = await categoriesModel.getCategories();ctx.body = tpl.render('add-item.html', {categories});},addPost: async ctx => {let data = ctx.request.body;let files = ctx.request.files;let filename = '';if (files && files.cover) {let lastPos = files.cover.path.lastIndexOf('/');filename = files.cover.path.substring(lastPos+1);}let rs = await itemsModel.addItem([data.category_id,data.name,data.price,filename]);console.log('rs', rs);ctx.body = '添加成功';   }
}

• libs/tpl.js

const nunjucks = require('nunjucks');
// 载入模板引擎
const tpl = new nunjucks.Environment(// FileSystemLoader => node 模板文件加载new nunjucks.FileSystemLoader('views', {watch: true,noCache: true})
);
module.exports = tpl;

• models/items.js

const db = require('./model');
module.exports = {getItems() {return new Promise( (resolve, reject) => {db.query("select * from `items`", function(err, rs) {if (err) {reject(err);} else {resolve(rs);}});} )},addItem(newData) {return new Promise( (resolve, reject) => {db.query("insert into `items` (`category_id`, `name`, `price`, `cover`) values (?, ?, ?, ?)", newData, function(err, rs) {if (err) {reject(err);} else {resolve(rs);}});} )}
}

• models/categories.js

const db = require('./model');
module.exports = {getCategories() {return new Promise( (resolve, reject) => {db.query("select * from `categories`", function(err, rs) {if (err) {reject(err);} else {resolve(rs);}});} )}
}

• models/model.js

const mysql2 = require('mysql2');
// 数据链接不推荐使用use中间件
let db = mysql2.createConnection({host: '127.0.0.1',port: 3306,user: 'root',password: 'Chen@123',database: 'test'
});
module.exports = db;

• views/index.html

登录注册
 
{%for item in items%}
{item.cover}}" alt="" class="cover">
{{item.name}}
¥ {{(item.price / 100).toFixed(2)}}
{%endfor%}
上一页12345678下一页

• views/add-item.html

 
登录注册
添加新商品
商品分类：请选择商品分类{%for category in categories%}{category.id}}">{{category.name}}{%endfor%}
商品名称：
价格：
封面：
确认添加
    

• public下的静态文件省略…