likes
comments
collection
share

你不能不学的打造高效、灵活的Node.js后端的Koa Web框架

作者站长头像
站长
· 阅读数 20

如果你不知道Koa，别急。我知道你很急，但你先别急。第一级标题并不是去介绍Koa和node.js自带的http模块创建服务器的。只是简单的对比了Koa之前最早的如何直接直接创建服务器，为什么衍生出来了Koa这个东西，在后面会详细介绍Koa，话不多说，进入正题。

没有Koa是怎么样的？

没有使用Koa（或其他Web框架）的代码一般会直接使用Node.js自带的http模块来创建服务器。

const http = require('http');

const hostname = '127.0.0.1';
const port = 3000;

const server = http.createServer((req, res) => {
  res.statusCode = 200;
  res.setHeader('Content-Type', 'text/plain');
  res.end('Hello World\n');
});

server.listen(port, hostname, () => {
  console.log(`Server running at http://${hostname}:${port}/`);
});

  1. 引入http模块：首先需要引入Node.js的http模块。

    const http = require('http');

  2. 设置主机名和端口：定义服务器运行的主机名和端口。

    const hostname = '127.0.0.1';
const port = 3000;

  3. 创建服务器：使用http.createServer方法创建一个服务器实例，并定义请求处理函数。

    const server = http.createServer((req, res) => {
  res.statusCode = 200; // 状态码200为传输正常
  res.setHeader('Content-Type', 'text/plain');//设置响应头为纯文本数据
  res.end('Hello World\n'); //向前端返回一个Hello World
});

    • req表示请求对象，包含请求的所有信息。

    • res表示响应对象，用于返回响应给客户端。

  4. 监听端口：使用server.listen方法使服务器开始监听指定的端口和主机名。

    server.listen(port, hostname, () => {
  console.log(`Server running at http://${hostname}:${port}/`);
});

这样，当你运行这个脚本时，你的服务器将在http://127.0.0.1:3000/上运行，并且当你访问这个地址时，浏览器会显示“Hello World”。

http模块来创建服务器的缺点

  1. 代码冗长且复杂：

    • 使用http模块处理请求和响应需要编写大量的低级代码。例如，手动解析请求体、设置响应头和处理路由等。

    • 这种代码的可读性和可维护性较差，尤其是当应用程序变得复杂时。

  2. 缺乏中间件支持：

    • 没有内置的中间件机制来处理诸如日志记录、认证、错误处理等常见任务。

    • 需要手动实现或集成这些功能，这增加了开发难度和工作量。

  3. 路由管理困难：

    • 处理路由需要手动编写代码来检查请求的URL和方法，这在大型应用中很难管理。

    • 缺少一个简洁的路由定义和管理方式。

  4. 异步代码处理繁琐：

    • 处理异步操作时，直接使用http模块容易产生回调地狱（Callback Hell），导致代码结构混乱。

    • 需要手动处理异步错误，容易遗漏或处理不当。

  5. 缺乏便利功能：

    • 像Koa、Express等框架提供了许多便捷的功能，如解析请求体、处理文件上传、模板引擎支持等。

    • 使用http模块需要手动实现这些功能，增加了开发时间和复杂性。

示例对比

使用http模块处理请求体：

const http = require('http');

const server = http.createServer((req, res) => {
  if (req.method === 'POST' && req.url === '/data') {
    let body = '';
    req.on('data', chunk => {
      body += chunk.toString();
    });
    req.on('end', () => {
      res.end(`Received data: ${body}`);
    });
  } else {
    res.statusCode = 404;
    res.end('Not Found');
  }
});

server.listen(3000, () => {
  console.log('Server running at http://127.0.0.1:3000/');
});

使用Koa处理请求体：

const Koa = require('koa');
const bodyParser = require('koa-bodyparser');
const app = new Koa();

app.use(bodyParser());

app.use(ctx => {
  if (ctx.method === 'POST' && ctx.path === '/data') {
    ctx.body = `Received data: ${JSON.stringify(ctx.request.body)}`;
  } else {
    ctx.status = 404;
    ctx.body = 'Not Found';
  }
});

app.listen(3000, () => {
  console.log('Server running at http://127.0.0.1:3000/');
});

Koa是什么？

Koa是一个由Express的原始开发团队创建的下一代Node.js Web框架。Koa的设计目标是通过利用现代JavaScript特性和简化中间件的使用，使Web应用程序和API的开发变得更加简单、灵活和强大。

Koa的特点

  1. 现代化的JavaScript特性：

    • Koa使用ES6/ES7的新特性，例如async/await，来简化异步操作，避免回调地狱，提升代码的可读性和维护性。

  2. 中间件机制：

    • Koa的中间件机制与Express不同，采用了“洋葱模型”（Onion Model），可以通过async/await的方式顺序执行和处理请求。

    • 中间件的设计更加灵活和简洁，便于开发者构建复杂的请求处理逻辑。

  3. 轻量化：

    • Koa本身是一个非常轻量的框架，不附带任何中间件，需要开发者按需引入所需的功能。

    • 这种设计提供了极大的灵活性，避免了不必要的功能开销。

  4. 没有内置路由和视图引擎：

    • Koa没有像Express那样内置路由和视图引擎，而是鼓励开发者选择最适合自己项目的第三方库来实现这些功能。

    • 这种方式使得Koa更加模块化和可定制化。

示例

// 引入Koa和Koa Router
const Koa = require('koa');
const Router = require('koa-router');

// 创建Koa应用实例
const app = new Koa();

// 创建路由实例
const router = new Router();

// 定义一个简单的GET路由处理根路径
router.get('/', async (ctx) => {
  // 设置响应体内容为主页欢迎信息
  ctx.body = 'Welcome to the homepage';
});

// 定义一个GET路由处理关于页面
router.get('/about', async (ctx) => {
  // 设置响应体内容为关于页面信息
  ctx.body = 'This is the about page';
});

// 使用路由中间件
app
  .use(router.routes()) // 加载路由定义，处理匹配的路由请求
  .use(router.allowedMethods()); // 处理405方法不允许和501未实现的响应

// 记录请求处理时间的中间件
app.use(async (ctx, next) => {
  // 记录请求开始时间
  const start = Date.now();
  // 调用下一个中间件
  await next();
  // 计算请求处理时间
  const ms = Date.now() - start;
  // 输出请求方法、URL和处理时间
  console.log(`${ctx.method} ${ctx.url} - ${ms}ms`);
});

// 设置响应时间的中间件
app.use(async (ctx, next) => {
  // 调用下一个中间件
  await next();
  // 设置响应头中的响应时间
  ctx.set('X-Response-Time', `${Date.now() - start}ms`);
});

// 设置响应内容的中间件
app.use(async (ctx) => {
  // 设置响应体内容
  ctx.body = 'Hello World';
});

// 启动服务器，监听指定端口
app.listen(3000, () => {
  console.log('Server running at http://127.0.0.1:3000/');
});

  1. 中间件：

    • 记录请求处理时间的中间件：

      app.use(async (ctx, next) => {
  const start = Date.now();
  await next();
  const ms = Date.now() - start;
  console.log(`${ctx.method} ${ctx.url} - ${ms}ms`);
});
      • 记录请求开始时间。
      • 调用下一个中间件。
      • 计算请求处理时间并输出日志。

    • 设置响应时间的中间件：

      app.use(async (ctx, next) => {
  await next();
  ctx.set('X-Response-Time', `${Date.now() - start}ms`);
});
      • 调用下一个中间件。
      • 设置响应头中的响应时间。

    • 设置响应内容的中间件：

      app.use(async (ctx) => {
  ctx.body = 'Hello World';
});
      • 设置响应体内容。

  2. 启动服务器：

    • app.listen(3000, () => {...});：启动服务器，监听指定端口（3000），并输出服务器运行信息。

深入理解Koa

中间件机制

洋葱模型（Onion Model）

Koa的中间件机制采用了洋葱模型（Onion Model），这意味着中间件按顺序执行，同时可以控制在请求传递到下一个中间件之前和之后执行代码。每个中间件函数接收两个参数：上下文对象（ctx）和一个表示下一个中间件的next函数。

中间件的执行顺序

中间件按顺序执行，首先执行的中间件位于最外层，然后逐层深入。每个中间件可以选择在调用await next()之前和之后执行代码。

示例

以下是一个简单的Koa应用程序，展示了中间件的执行顺序和洋葱模型：

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

// 第一个中间件
app.use(async (ctx, next) => {
  console.log('第一个中间件 - 开始');
  await next();
  console.log('第一个中间件 - 结束');
});

// 第二个中间件
app.use(async (ctx, next) => {
  console.log('第二个中间件 - 开始');
  await next();
  console.log('第二个中间件 - 结束');
});

// 第三个中间件
app.use(async (ctx, next) => {
  console.log('第三个中间件 - 开始');
  ctx.body = 'Hello World';
  await next();
  console.log('第三个中间件 - 结束');
});

app.listen(3000, () => {
  console.log('Server running at http://127.0.0.1:3000/');
});

运行此代码时，控制台输出如下：

第一个中间件 - 开始
第二个中间件 - 开始
第三个中间件 - 开始
第三个中间件 - 结束
第二个中间件 - 结束
第一个中间件 - 结束

你不能不学的打造高效、灵活的Node.js后端的Koa Web框架

你不能不学的打造高效、灵活的Node.js后端的Koa Web框架

这就像一个洋葱，从最外面剥开，又从最里面出来。当然这种设计模式也和递归有着异曲同工之妙，递归也是属于调用一个函数，再在这个函数内部调用自己，一直调用函数，直到到达了最里面函数条件满足停止调用，从最里面的函数开始返回上一个函数调用，以此类推。

中间件的功能

  1. 请求处理：中间件可以在请求进入应用程序时进行预处理，如解析请求体、处理认证和授权等。
  2. 响应生成：中间件可以生成响应并将其返回给客户端。
  3. 错误处理：中间件可以捕获和处理错误，提供一致的错误处理机制。
  4. 日志记录：中间件可以记录请求和响应信息，便于调试和监控。
  5. 性能监控：中间件可以测量和记录请求处理时间，帮助优化性能。

中间件的编写

编写Koa中间件非常简单，每个中间件都是一个异步函数，接收ctx和next两个参数。ctx是上下文对象，包含请求和响应的相关信息；next是一个函数，调用它可以将控制权传递给下一个中间件。

javascript
复制代码
app.use(async (ctx, next) => {
  // 在请求处理之前执行的代码
  await next();  // 调用下一个中间件
  // 在请求处理之后执行的代码
});

koa-router路由处理

// 引入Koa和Koa Router
const Koa = require('koa');
const Router = require('koa-router');

// 创建Koa应用实例
const app = new Koa();

// 创建路由实例
const router = new Router();

// 定义一个简单的GET路由
router.get('/', async (ctx) => {
  ctx.body = 'Welcome to the homepage';
});

// 定义一个关于页面的GET路由
router.get('/about', async (ctx) => {
  ctx.body = 'This is the about page';
});

// 使用路由中间件
app
  .use(router.routes()) // 加载路由定义
  .use(router.allowedMethods()); // 处理405方法不允许和501未实现的响应

// 启动服务器，监听指定端口
app.listen(3000, () => {
  console.log('Server running at http://127.0.0.1:3000/');
});

路由参数

Koa Router支持动态路由参数和查询参数。

// 引入Koa和Koa Router
const Koa = require('koa');
const Router = require('koa-router');

// 创建Koa应用实例
const app = new Koa();

// 创建路由实例
const router = new Router();

// 定义一个带参数的GET路由
router.get('/user/:id', async (ctx) => {
  // 通过ctx.params获取动态路由参数
  const userId = ctx.params.id;
  ctx.body = `User ID is: ${userId}`;
});

// 定义一个带查询参数的GET路由
router.get('/search', async (ctx) => {
  // 通过ctx.query获取查询参数
  const query = ctx.query.q;
  ctx.body = `Search query is: ${query}`;
});

// 使用路由中间件
app
  .use(router.routes()) // 加载路由定义
  .use(router.allowedMethods()); // 处理405方法不允许和501未实现的响应

// 启动服务器，监听指定端口
app.listen(3000, () => {
  console.log('Server running at http://127.0.0.1:3000/');
});

中间件

Koa Router还支持在路由级别使用中间件。

// 引入Koa和Koa Router
const Koa = require('koa');
const Router = require('koa-router');

// 创建Koa应用实例
const app = new Koa();

// 创建路由实例
const router = new Router();

// 定义一个简单的中间件函数
const logMiddleware = async (ctx, next) => {
  console.log(`Request received: ${ctx.method} ${ctx.url}`);
  await next();
};

// 定义一个带中间件的GET路由
router.get('/log', logMiddleware, async (ctx) => {
  ctx.body = 'Check the console for the log message';
});

// 使用路由中间件
app
  .use(router.routes()) // 加载路由定义
  .use(router.allowedMethods()); // 处理405方法不允许和501未实现的响应

// 启动服务器，监听指定端口
app.listen(3000, () => {
  console.log('Server running at http://127.0.0.1:3000/');
});

路由前缀

你可以为Koa Router定义一个前缀，以便所有的路由都共享这个前缀：

// 引入Koa和Koa Router
const Koa = require('koa');
const Router = require('koa-router');

// 创建Koa应用实例
const app = new Koa();

// 创建带前缀的路由实例
const router = new Router({
  prefix: '/api'
});

// 定义一个带前缀的GET路由
router.get('/status', async (ctx) => {
  ctx.body = 'API is running';
});

// 使用路由中间件
app
  .use(router.routes()) // 加载路由定义
  .use(router.allowedMethods()); // 处理405方法不允许和501未实现的响应

// 启动服务器，监听指定端口
app.listen(3000, () => {
  console.log('Server running at http://127.0.0.1:3000/');
});

嵌套路由

Koa Router支持嵌套路由，使得复杂的路由结构更容易管理：

// 引入Koa和Koa Router
const Koa = require('koa');
const Router = require('koa-router');

// 创建Koa应用实例
const app = new Koa();

// 创建主路由实例
const mainRouter = new Router({
  prefix: '/main'
});

// 创建子路由实例
const subRouter = new Router({
  prefix: '/sub'
});

// 定义主路由中的GET路由
mainRouter.get('/', async (ctx) => {
  ctx.body = 'Main router root';
});

// 定义子路由中的GET路由
subRouter.get('/info', async (ctx) => {
  ctx.body = 'Sub router info';
});

// 将子路由挂载到主路由
mainRouter.use(subRouter.routes(), subRouter.allowedMethods());

// 使用主路由中间件
app
  .use(mainRouter.routes()) // 加载主路由定义
  .use(mainRouter.allowedMethods()); // 处理405方法不允许和501未实现的响应

// 启动服务器，监听指定端口
app.listen(3000, () => {
  console.log('Server running at http://127.0.0.1:3000/');
});
转载自:https://juejin.cn/post/7397285224379121714
评论
请登录