用Decorator控制Koa路由

V3fKZF.png

在 Spring 中 Controller 长这样

@Controller
public class HelloController{
  @RequestMapping("/hello")
  String hello() {
    return "Hello World";
  }
}

还有 Python 上的 Flask 框架

@app.route("/hello")
def hello():
  return "Hello World"

两者都用 decorator 来控制路由,这样写的好处是更简洁、更优雅、更清晰。

反观 Express 或 Koa 上的路由

router.get('/hello', async (ctx) => {
  ctx.body = 'Hello World'
})

完全差了一个档次

JS 从 ES6 开始就有Decorator了,只是浏览器和 Node 都还没有支持。需要用babel-plugin-transform-decorators-legacy转义。

# Decorator 基本原理

首先需要明确两个概念:

  1. Decorator 只能作用于类或类的方法上
  2. 如果一个类和类的方法都是用了 Decorator,类方法的 Decorator 优先于类的 Decorator 执行

Decorator 基本原理:

@Controller
class Hello {}

// 等同于

Controller(Hello)

Controller 是个普通函数,target为修饰的类或方法

// Decorator不传参
function Controller(target) {}

// Decorator传参
function Controller(params) {
  return function (target) {}
}

如果 Decorator 是传参的,即使 params 有默认值,在调用时必须带上括号,即:

@Controller()
class Hello {}

# 如何在 Koa 中使用 Decorator

我们可以对koa-router中间件进行包装

先回顾一下koa-router基本使用方法:

var Koa = require('koa')
var Router = require('koa-router')

var app = new Koa()
var router = new Router()

router.get('/', async (ctx, next) => {
  // ctx.router available
})

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

再想象一下最终目标

@Controller({ prefix: '/hello' })
class HelloController {
  @Request({ url: '/', method: RequestMethod.GET })
  async hello(ctx) {
    ctx.body = 'Hello World'
  }
}

类内部方法的装饰器是优先执行的,我们需要对方法重新定义

function Request({ url, method }) {
  return function (target, name, descriptor) {
    let fn = descriptor.value
    descriptor.value = (router) => {
      router[method](url, async (ctx, next) => {
        await fn(ctx, next)
      })
    }
  }
}

对 RequestMethod 进行格式统一

const RequestMethod = {
  GET: 'get',
  POST: 'post',
  PUT: 'put',
  DELETE: 'delete'
}

Controller 装饰器需将 Request 方法添加到 Router 实例并返回 Router 实例

import KoaRouter from 'koa-router'

function Controller({ prefix }) {
  let router = new KoaRouter()
  if (prefix) {
    router.prefix(prefix)
  }
  return function (target) {
    let reqList = Object.getOwnPropertyDescriptors(target.prototype)
    for (let v in reqList) {
      // 排除类的构造方法
      if (v !== 'constructor') {
        let fn = reqList[v].value
        fn(router)
      }
    }
    return router
  }
}

至此,装饰器基本功能就完成了,基本使用方法为:

import { Controller, Request, RequestMethod } from './decorator'

@Controller({ prefix: '/hello' })
export default class HelloController {
  @Request({ url: '/', method: RequestMethod.GET })
  async hello(ctx) {
    ctx.body = 'Hello World'
  }
}

在 App 实例中同路由一样 use 即可。

# 根据 AST 提取我们想要的方法

根据方法名判断是否是 Request 方法是非常不准确的,它会让类变成一个纯空壳子,丢失了类本身的功能。应该从 AST 层面对方法做判断。