路由
koa-generator是把路由放到了app.js里面了，这里我单独提出来建立router.js，然后app.js引入。
这是我的项目目录
上面是我的项目目录,后面慢慢解释。
routes和api两个文件夹，其实都算路由配置,只不过我把后端渲染的页面数据和提供的接口数据分开放了，routes里面路由是渲染ejs模板，api里面的提供前后端分离的接口。
下面是
router.js代码
const Router = require('koa-router');
const router=new Router();
const index = require('./routes/index');
const users = require('./routes/users');
const api = require('./api/api');
router.use('/', index);//首页
router.use('/api', api);//后端接口
router.use('/users', users);//渲染页面 user
module.exports = router;
首页渲染和api的路由放到前面，需要ejs渲染的一级路由后面都列出来。
路由--页面渲染
下面是routes/index.js
const router = require('koa-router')()
const userController = require('../controllers/user');
router.get('/', async (ctx, next) => {
let data = await userController.getUser();
await ctx.render('index', {
title: 'Hello Koa 2!',
data
})
})
这里是首页渲染(直接把userController也拿过来了)，路由文件里引入controllers里的文件，得到数据ctx.render渲染模板即可。
下面是controllers/user.js
const userController={
getUser(){
return new Promise((resolve,reject)=>{
setTimeout(()=>{
resolve({
name:'koa2',
list:[{
name:'11',age:1
},{
name:'22',age:2
},{
name:'33',age:3
},{
name:'44',age:4
}]
})
},1000)
})
}
}
module.exports=userController;
这里应该是调用数据库获取真实数据，这里简单搞个异步，后面说api的时候再说数据库连接。
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<%- include('layout') -%>
</head>
<body>
<% var aa = '这是一个ejs页面' %>
<div>
<p><%= title %></p>
<span><%= data.name %></span>
<ul>
<% data.list.forEach((item)=>{ %>
<li><%= item.name %></li>
<% }) %>
</ul>
<%= aa %>
</div>
</body>
</html>
实际渲染效果,凑合看看
路由--api接口
这里参考了https://www.jianshu.com/p/3e35db2c8d6c
首先是api入口文件api/api
const Router = require('koa-router');
const router = new Router();
const article = require('./article');
const user = require('./user');
router.use('/article', article);
router.use('/user', user);
module.exports = router.routes();
这里也是分模块来搞,分为了article和user。
模块article.js
const Router = require('koa-router');
const ArticleController = require('../controllers/article');
const router = new Router();
/**
* 文章接口
*/
//创建文章
router.post('/create',ArticleController.create);
//获取文章列表
router.get('/list',ArticleController.list);
//获取文章详情
router.get('/detail/:id',ArticleController.detail);
module.exports = router.routes();
这里就是建立了几个常用的接口，处理接口的Controller文件是单独的，这里引入了controllers/article。
创建文章和文章详情请参考https://www.jianshu.com/p/3e35db2c8d6c
我再这基础上添加了 -- 获取文章列表
static async list(ctx){
// 查询文章列表模型
let data = await ArticleModel.getArticleList(ctx.query);
ctx.response.status = 200;
ctx.body = {
code: 200,
msg: '查询成功',
data
}
}
Model文件也是增加了一点
const Sequelize = require('sequelize');
const Op = Sequelize.Op;
// 引入数据表模型
const Article = require('../schema/article');
class ArticleModel {
/**
* 查询文章列表
* @param query 查询参数 文章标题 模糊查询 分页数据
* @returns {Promise<Model>}
*/
static async getArticleList({title='',pageSize=10,pageIndex=1}){
return await Article.findAndCountAll({
limit:Number(pageSize),
offset:Number((pageIndex-1)*pageSize),
where:{
title:{
[Op.like]:'%'+title+'%'
}
}
});
}
}
module.exports = ArticleModel;
这里Model的实现方式与参考文章有差异，不过只是Sequelize实现方式不一样。参考文章用的import导入的时候建立数据表,我是直接初始化好。
数据表文件schema/article
const Sequelize = require('sequelize');
// 引入sequelize对象
const sequelize = require('../config/db');
const Model = Sequelize.Model;
const DataTypes=Sequelize.DataTypes;
class Article extends Model {}
Article.init({
id: {
type: DataTypes.INTEGER,
primaryKey: true,
allowNull: true,
autoIncrement: true
},
//这里不再多写其他的表结构了，参考文章有
},{
sequelize,
modelName:'article',
freezeTableName: true,
});
module.exports = Article;
语法请参考Sequelize,这里config/db就是用Sequelize来链接的数据库,我先用腾讯云的免费的数据库做了测试
const Sequelize = require('sequelize');
const sequelize = new Sequelize('test','root','*****',{
host:'cd-cdb-nyn9odic.sql.tencentcdb.com',
port:'62711',
dialect:'mysql',
pool:{
max: 5,
min: 0,
acquire: 30000,
idle: 10000
},
timezone: '+08:00' //东八时区
});
module.exports = sequelize;
终于接口算是搞完了,用ajax测试一下。
/api/article/list?title=%E6%A0%87%E9%A2%98&pageIndex=2&pageSize=10
测试结果.png
如果是跨域访问，使用koa-cors中间件即可，这里就不在赘述了。
网友评论