从0到1搭建koa服务端框架

koa框架和express的区别

express:
包含一个完整的应用程序框架 ,有路由和模板等功能 ,占用空间比较庞大
koa:
Koa模块是中间件内核,模块化成度更高,占用内存小,运行快

从0到1搭建express框架

  1. 初始化pakage.json

npm init

  1. 安装依赖
    将一下代码粘入 pakage.json中后执行npm install
"koa": "^2.13.1",
"koa-bodyparser": "^4.3.0",
"koa-onerror": "^4.1.0",
"koa-router": "^10.0.0",
"koa-static": "^5.0.0"
  1. 新建app.js
const Koa = require('koa')//引入koa中间件
const app = new Koa()
const onerror = require('koa-onerror'); //异常记录
const fs = require('fs');

//设置路由中间件
app.use(async (ctx, next) => {
    
    
  await next()
});
//处理post方法接收到的数据
app.use(require('koa-bodyparser')());

//异常处理
onerror(app);

// 建立路由文件
const index = require('./router/index')
app.use(index.routes(), index.allowedMethods());

//设置静态目录
app.use(require('koa-static')(__dirname + '/public'));

// 异常处理
app.on('error', (err, ctx) => {
    
    
	ctx.res.writeHead(200,{
    
    
		'content-Type':'application/json'
	});
	ctx.res.end(JSON.stringify(err));
});

app.listen(3001);

  1. 根目录新建route文件夹
const koaRouter = require('koa-router');
const router = koaRouter();
//处理get请求
router.get('/oindex', async (ctx, next) => {
    
    
	let code="222"
	let msg="成功"
	let data={
    
    name:'111',status:"成功"}
	ctx.body={
    
    
		code,
		msg,
		data
	}
});
//处理post请求
router.post('/index', async (ctx, next) => {
    
    
	let code="222"
	let msg="成功"
	let data={
    
    name:'111',status:"成功"}
	ctx.body=ctx
	//返回异常
	// const error = new Error()
	//  error.code = 10000
	//  error.msg = '无此用户'
	// throw(error);
});

module.exports = router
  1. 根目录新建veiw 和veiw下模板文件index.html文件夹
<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title>123</title>
	</head>
	<body>
		<p>hello</p>
	</body>
</html>

  1. 最终目录
    在这里插入图片描述
    简单框架搭建完成!后期登录/请求头处理/返回统一格式/数据库链接/登录机制处理继续补充

利用koa-generator快速搭建

npm install koa-generator -g

koa 项目名称

成功! 安装依赖运行就可以了
注意一点(踩坑点)
用框架搭建的app.js配置(据说是升级版)

//中间件配置时app.js
app.use(function *(next){
    
    
  var start = new Date;
  yield next;
  var ms = new Date - start;
  console.log('%s %s - %s', this.method, this.url, ms);
});
//使用时 router中
router.get('/', function *(next) {
    
    
  this.body = 'this is a users response!';
});

而网上查询配置基本上都是

//中间件配置时app.js
app.use(async (ctx, next) => {
    
    
  await next()
});
//使用时 router中
router.post('/index', async (ctx, next) => {
    
    
	ctx.body=ctx
}

查了好久,接口部分不会处理,后来发现框架中this即为ctx
框架配置修啊改为:

//中间件配置时app.js
app.use(function *(next){
    
    
  yield next;
 });
//使用时 router中
router.get('/', function *(next) {
    
    
  this.body = 'this is a users response!';
});

关于ctx

https://koa.bootcss.com/
https://blog.csdn.net/weixin_43392420/article/details/85676384添加链接描述

猜你喜欢

转载自blog.csdn.net/qq_40969782/article/details/113565239