> 웹 프론트엔드 > JS 튜토리얼 > nodejs 미들웨어 Koa와 Express 비교

nodejs 미들웨어 Koa와 Express 비교

青灯夜游
풀어 주다: 2021-02-24 09:52:14
앞으로
2359명이 탐색했습니다.

nodejs 미들웨어 Koa와 Express 비교

관련 추천: "nodejs Tutorial"

미들웨어라고 하면 많은 개발자들이 Koa.js를 떠올릴 것이고, Koa.js의 미들웨어 디자인은 의심할 여지 없이 프론트엔드 미들웨어 사고의 전형적인 대표자 중 하나입니다.

최근에 이 부분의 콘텐츠를 검토하면서 그 훌륭함에 대해 독자 여러분과 이야기를 나누고 싶습니다!


Koa는 사용하기 매우 편리합니다. Express에 비해 "완벽한 미들웨어" 디자인으로 인해 기능이 매우 단순해 보입니다! 저자는 프로젝트에서 이것을 사용했습니다:

const Koa=require('koa')
const app=new Koa()
const Router=require('koa-router')
const router=new Router()
const cors=require('koa2-cors')
const koaBody=require('koa-body')

const ENV='test-mpin2'

app.use(cors({
	origin:['http://localhost:9528'],   // 也可以写为:['*']
	credentials:true
}))
app.use(koaBody({
	multipart:true
}))
app.use(async(ctx,next)=>{
	console.log('访问全局中间件')
	ctx.state.env=ENV   // 全局缓存
	await next()
})

const playlist=require('./controller/playlist.js')
router.use('/playlist',playlist.routes())
const blog=require('./controller/blog.js')
router.use('/blog',blog.routes())

app.use(router.routes()).use(router.allowedMethods())

app.listen(3000,()=>{
	console.log('服务已开启')
})
로그인 후 복사

라우팅 라우터를 추출하여 별도의 미들웨어로 사용하며, 앱은 전역 처리만 담당합니다. 또 다른 예:

// 最外层中间件,可以用于兜底 Koa 全局错误
app.use(async (ctx, next) => {
  try {
    // 执行下一个中间件
    await next();
  } catch (error) {
    console.log(`[koa error]: ${error.message}`)
  }
});
// 第二层中间件,可以用于日志记录
app.use(async (ctx, next) => {
  const { req } = ctx;
  console.log(`req is ${JSON.stringify(req)}`);
  await next();
  console.log(`res is ${JSON.stringify(ctx.res)}`);
});
로그인 후 복사

Koa를 구현하기 쉽습니다!

위 코드와 같이 Koa 인스턴스를 살펴보고 use 메소드를 통해 미들웨어를 등록하고 연결해 보겠습니다. 소스 코드의 간단한 구현은 다음과 같이 표현할 수 있습니다.

use(fn) {
    this.middleware.push(fn);
    return this;
}
로그인 후 복사

미들웨어를 this.middleware 배열인데 미들웨어는 어떻게 실행되나요? 아래 소스코드를 참고하세요. this.middleware数组中,那么中间件是如何被执行的呢?参考下面源码:

// 通过 createServer 方法启动一个 Node.js 服务
listen(...args) {
    const server = http.createServer(this.callback());
    server.listen(...args);
}
로그인 후 복사

Koa 框架通过 http 模块的 createServer 方法创建一个 Node.js 服务,并传入 this.callback() 方法, callback源码简单实现如下:

callback(){
	const fn=compose(this.middlewareList)
	
	return (req,res)=>{
		const ctx=createContext(req,res)
		return this.handleRequest(ctx,fn)
	}
}

handleRequest(ctx, fn) {
    const onerror = err => ctx.onerror(err);
    // 将 ctx 对象传递给中间件函数 fn
    return fn(ctx).catch(onerror);
}
로그인 후 복사

如上代码,我们将 Koa 一个中间件组合和执行流程梳理为以下步骤:

  • 通过一个方法(我们称为compose)组合各种中间件,返回一个中间件组合函数fn

  • 请求过来时,会先调用handleRequest方法,该方法完成:

    • 调用createContext方法,对该次请求封装出一个ctx对象;
    • 接着调用this.handleRequest(ctx, fn)处理该次请求。

其中,核心过程就是使用compose方法组合各种中间件 —— 这是一个单独的方法,它应该不受Koa其余方法的约束。其源码简单实现为:

// 组合中间件
// 和express中的next函数意义一样
function compose(middlewareList){
	// return function意思是返回一个函数
	return function(ctx,next){
		// 各种中间件调用的逻辑
		function dispatch(i){
			const fn=middlewareList[i] || next
			if(fn){
				try{
					// koa中都是async,其返回的是一个promise(对象)
					return Promise.resolve(fn(ctx,function next(){
						return dispatch(i+1)
					}))
				}catch(err){
					return Promise.reject(err)
				}
			}else{
				return Promise.resolve()
			}
		}
		return dispatch(0)
	}
}
로그인 후 복사

其功能可以表示为这样(非源码):

async function middleware1() {
  //...
  await (async function middleware2() {
    //...
    await (async function middleware3() {
      //...
    });
    //...
  });
  //...
}
로그인 후 복사

到这里我们其实可以“初窥”其原理,有两点:

  • Koa 的中间件机制被社区形象地总结为洋葱模型;

所谓洋葱模型,就是指每一个 Koa 中间件都是一层洋葱圈,它即可以掌管请求进入,也可以掌管响应返回。换句话说:外层的中间件可以影响内层的请求和响应阶段,内层的中间件只能影响外层的响应阶段。

  • dispatch(n)对应第 n 个中间件的执行,在使用中即第 n 个中间件可以通过await next()来“插入”执行下一个中间件,同时在最后一个中间件执行完成后,依然有恢复执行的能力。即:通过洋葱模型,await next()控制调用后面的中间件,直到全局没有可执行的中间件且堆栈执行完毕,最终“原路返回”至第一个执行next的中间件。这种方式有个优点,特别是对于日志记录以及错误处理等全局功能需要非常友好

Koa1 的中间件实现利用了 Generator 函数 + co 库(一种基于 Promise 的 Generator 函数流程管理工具),来实现协程运行。本质上,Koa v1 中间件和 Koa v2 中间件思想是类似的,只不过 Koa v2 改用了 Async/Await 来替换 Generator 函数 + co 库,整体实现更加巧妙,代码更加优雅。—— from《狼书》

经过上述部分源码的描述,我们就可以采用es6的方式将其组合起来:

// myKoa.js文件

const http=require('http')

function compose(){}   //见上

class LikeKoa2{
	constructor() {
	    this.middlewareList=[]
	}
	use(){}   //见上
	
	// 把所有的req,res属性、事件都交给ctx(这里只是简写)
	createContext(req,res){
		const ctx={
			req,
			res
		}
		// 比如
		ctx.query=req,query
		return ctx
	}
	handleRequest(){}   //见上
	callback(){}   //见上
	listen(){}   //见上
}

// koa和express的不同之一:
// express在调用时直接调用函数:const app=express();所以暴露出去new过的对象——具体见下面链接中代码
// 但是koa调用时以类的方式:const app=new Koa();所以直接暴露出去
module.exports=LikeKoa2
로그인 후 복사

那use方法和其余方法并不相通,它是如何被执行的呢?执行了createServer后是不是相当于建立了一个通道、挂载了一个监听函数呢?
这一点恐怕就要到Node的源码中一探究竟了…


对比 Koa,聊聊 Express 原理

说起 Node.js 框架,我们一定忘不了 Express —— 不同于 Koa,它继承了路由、静态服务器和模板引擎等功能,虽然比之Koa显得“臃肿”了许多,但看上去比 Koa 更像是一个框架。通过学习 Express 源码,笔者简单的总结了它的工作机制:

  • 通过app.use方法注册中间件。

  • 一个中间件可以理解为一个 Layer 对象,其中包含了当前路由匹配的正则信息以及 handle 方法。

  • 所有中间件(Layer 对象)使用stack数组存储起来。

  • 当一个请求过来时,会从 req 中获取请求 path,根据 path 从stack中找到匹配的 Layer,具体匹配过程由router.handle函数实现。

  • router.handle函数通过next()

    ((req, res) => {
      console.log('第一个中间件');
      ((req, res) => {
        console.log('第二个中间件');
        (async(req, res) => {
          console.log('第三个中间件');
          await sleep(2000)
          res.status(200).send('hello')
        })(req, res)
        console.log('第二个中间件调用结束');
      })(req, res)
      console.log('第一个中间件调用结束')
    })(req, res)
    로그인 후 복사
    로그인 후 복사

    Koa 프레임워크는 http 모듈의 createServer 메소드를 통해 Node.js 서비스를 생성하고 this.callback()</code에 전달합니다. > 메소드는 다음과 같이 간단하게 구현됩니다. 🎜rrreee🎜위 코드에서 볼 수 있듯이 Koa 미들웨어 조합 및 실행 프로세스를 다음 단계로 구성합니다. 🎜<ul style="list-style-type: disc;"><li>🎜컴포즈(compose)라는 메소드를 통해 다양한 미들웨어를 결합하고 미들웨어 결합 함수 <code>fn을 반환합니다🎜
  • 🎜요청이 오면 < code>handleRequest 메소드가 먼저 호출됩니다. 이 메소드 완료됨: 🎜
    • 이 요청에 대한 ctx 객체를 캡슐화하기 위해 createContext 메소드를 호출하세요. >그런 다음 this.handleRequest(ctx, fn)를 호출하여 요청을 처리합니다.
🎜그 중 핵심 프로세스는 compose 메소드를 사용하여 다양한 미들웨어를 결합하는 것입니다. 이는 별도의 메소드이므로 나머지 부분에 의해 제약을 받아서는 안 됩니다. 코아의 방법. 소스 코드는 다음과 같이 간단하게 구현됩니다. 🎜rrreee🎜 기능은 다음과 같이 표현될 수 있습니다(비소스 코드): 🎜rrreee🎜이 시점에서 실제로 원리를 "처음 엿볼" 수 있습니다. 두 가지 점이 있습니다. 🎜
  • Koa의 미들웨어 메커니즘은 커뮤니티에서 양파 모델로 생생하게 요약됩니다.
🎜 소위 양파 모델은 각 Koa 미들웨어가 양파 링의 레이어임을 의미합니다. , 요청 항목과 반환된 응답을 모두 처리할 수 있습니다. 즉, 외부 미들웨어는 내부 계층의 요청 및 응답 단계에 영향을 미칠 수 있고, 내부 미들웨어는 외부 계층의 응답 단계에만 영향을 미칠 수 있습니다. 🎜
  • dispatch(n)은 n번째 미들웨어 실행에 해당하며, 사용시에는 wait next()를 통해 다음 미들웨어를 실행하기 위해 n번째 미들웨어를 "삽입"할 수 있으며, 동시에 마지막 미들웨어 실행이 완료된 후에도 여전히 실행을 재개할 수 있습니다. 즉, 어니언 모델을 통해 wait next()는 전체적으로 실행 가능한 미들웨어가 없어 스택 실행이 완료될 때까지 후속 미들웨어 호출을 제어하고, 마지막으로 다음에 실행되는 첫 번째 미들웨어에 대해 "원래 경로로 돌아갑니다". 이 접근 방식은 특히 매우 친숙해야 하는 로깅 및 오류 처리와 같은 전역 기능에 장점이 있습니다.
🎜Koa1의 미들웨어 구현은 코루틴 작업을 구현하기 위해 Generator 함수 + co 라이브러리(Promise 기반의 Generator 함수 프로세스 관리 도구)를 사용합니다. 본질적으로 Koa v1 미들웨어와 Koa v2 미들웨어의 아이디어는 유사합니다. 단, Koa v2는 Generator 함수 + co 라이브러리를 대체하기 위해 Async/Await를 사용합니다. 전체적인 구현이 더 영리하고 코드가 더 우아합니다. —— "Wolf Book"에서 🎜
🎜위의 소스 코드 부분을 설명한 후 es6을 사용하여 결합할 수 있습니다. 🎜rrreee🎜use 메소드가 다른 메소드와 연결되어 있지 않은데 어떻게 실행됩니까? ? createServer를 실행한 후 채널을 설정하고 청취 기능을 탑재하는 것과 동일합니까?
이에 대해서는 Node의 소스 코드에서 더 자세히 알아보아야 할 것 같습니다... 🎜🎜🎜🎜Koa와 비교하여 Express의 원리에 대해 이야기해 보겠습니다🎜🎜🎜Node.js 프레임워크에 대해 말하자면 , Express를 잊어서는 안 됩니다. Koa와는 달리 라우팅, 정적 서버 및 템플릿 엔진과 같은 기능을 상속합니다. Koa에 비해 훨씬 "비대해졌지만" Koa보다는 프레임워크처럼 보입니다. 저자는 Express 소스 코드를 연구하여 작동 메커니즘을 간단하게 요약했습니다. 🎜
  • 🎜 app.use 메소드를 통해 미들웨어를 등록하세요. 🎜
  • 🎜미들웨어는 현재 경로 및 처리 방법과 일치하는 일반 정보를 포함하는 Layer 객체로 이해될 수 있습니다. 🎜
  • 🎜모든 미들웨어(레이어 객체)는 스택 배열을 사용하여 저장됩니다. 🎜
  • 🎜요청이 들어오면 req에서 요청 경로를 가져오고, 경로에 따라 스택에서 일치하는 레이어를 찾습니다. 구체적인 일치 프로세스는 에 의해 구현됩니다. router.handle 함수. 🎜
  • 🎜router.handle 함수는 next() 메서드를 통해 비교하기 위해 각 계층을 순회합니다. 🎜
    • next()方法通过闭包维持了对于 Stack Index 游标的引用,当调用next()方法时,就会从下一个中间件开始查找;
    • 如果比对结果为 true,则调用layer.handle_request方法,layer.handle_request方法中会调用next()方法 ,实现中间件的执行。

通过上述内容,我们可以看到,Express 其实是通过 next() 方法维护了遍历中间件列表的 Index 游标,中间件每次调用next()方法时,会通过增加 Index 游标的方式找到下一个中间件并执行。它的功能就像这样:

((req, res) => {
  console.log(&#39;第一个中间件&#39;);
  ((req, res) => {
    console.log(&#39;第二个中间件&#39;);
    (async(req, res) => {
      console.log(&#39;第三个中间件&#39;);
      await sleep(2000)
      res.status(200).send(&#39;hello&#39;)
    })(req, res)
    console.log(&#39;第二个中间件调用结束&#39;);
  })(req, res)
  console.log(&#39;第一个中间件调用结束&#39;)
})(req, res)
로그인 후 복사
로그인 후 복사

如上代码,Express 中间件设计并不是一个洋葱模型,它是基于回调实现的线形模型,不利于组合,不利于互操,在设计上并不像 Koa 一样简单。而且业务代码有一定程度的侵扰,甚至会造成不同中间件间的耦合。

express的简单实现笔者已上传至腾讯微云,需要者可自行查看&下载:express的简单实现

更多编程相关知识,请访问:编程视频!!

위 내용은 nodejs 미들웨어 Koa와 Express 비교의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!

관련 라벨:
원천:csdn.net
본 웹사이트의 성명
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.
인기 튜토리얼
더>
최신 다운로드
더>
웹 효과
웹사이트 소스 코드
웹사이트 자료
프론트엔드 템플릿