koa全攻略

1.什么是洋葱模型

简单介绍

用一句话来说，koa，express框架的中间件的执行顺序，可以比喻成洋葱模型。

我们先看一张图

洋葱模型.png

接下来我们用代码演示一下，猜一下执行结果是什么？

const Koa = require ('koa');
const app = new Koa ();

app.use ((ctx, next) => {
  console.log (1);
  next ();
  console.log (2);
});
app.use ((ctx, next) => {
  console.log (3);
  next ();
  console.log (4);
});
app.listen (4000, () => {
  console.log ('服务器启动成功，端口为4000');
});

执行完之后，我们可以看到输出结果为：1，3，4，2，ok，我们看到输入结果是符合洋葱模型的，看到这可能还有些同学不明白，不着急我们慢慢看。

2.async/await在中间件里面的使用

async/await在koa中的使用，以及背景

async/await 是koa，express这俩大web框架最大的区别，可以说koa的衍变就是为了解决express对于异步编程不友好的问题。

我们看一个示例

错误代码

const Koa = require ('koa');
const app = new Koa ();
var count = 0;
app.use ((ctx, next) => {
  console.log ('第一步');
  next ();
  console.log (`第三步执行完毕，count：${count}`);
});
app.use (async (ctx, next) => {
  console.log ('第二步');
  var a = await asyncFunc ();
  count = a;
});
function asyncFunc () {
  return new Promise ((resolve, reject) => {
    setTimeout (() => {
      resolve (10);
    }, 3000);
  });
}
app.listen (5000, () => {});

我们需要异步函数asyncFunc（这个函数也就相当于一个网络请求）的返回值来赋值给count，按照koa中间件的执行顺序，也就是洋葱模型，我们期望的最后输出count的值是10；

但是

我们执行之后，输出count的值为0

出现这样的原因是什么？

image.png

正确的代码

const Koa = require ('koa');
const app = new Koa ();
var count = 0;
app.use (async (ctx, next) => {
  console.log ('第一步');
  await next ();

  console.log (`第三步执行完毕，count：${count}`);
});
app.use (async (ctx, next) => {
  console.log ('第二步');
  var a = await asyncFunc ();
  count = a;
});

function asyncFunc () {
  return new Promise ((resolve, reject) => {
    setTimeout (() => {
      resolve (10);
    }, 3000);
  });
}
app.listen (5000, () => {});

输出count的值为10