首页

Egg.js 路由装饰器，让你的开发更敏捷~

路由解析是 egg-shell-decorators（蛋壳） 最大的特点，使用 Decorator 装饰的路由，则会被自动解析成对应的路由：

• 文件路径：
  • app/controller/home.ts
    • @Get('/detail/:id')
    • @Post('/')
• 解析路由：
  • [get] /home + /detail/:id
  • [post] /home + /

这里的 全局前缀 指的是你在 EggShell 里配置的 prefix，路由解析支持多层级解析噢~

示范代码均采用 TypeScript。（右边的菜单可以滚动的噢）

使用前必看

新增的内容会用黄色高亮，删除的内容会用红色高亮。

配置

原配置全部删除，所以使用了以下参数的同学要记得自己兼容处理一下，QuickStart模式也取消了。

{
  "prefix": "string", // 全局前缀
  "quickStart": "boolean", // 开启QuickStart模式
  "before": "Function[]", // 全局前置中间件
  "after": "Function[]", // 全局后置中间件
  "swaggerOpt": "object" // 具体配置查看 （Example > Swagger Ui > swaggerOpt）
}

快速开始

咱们先快速来一个例子：

import { Controller } from 'egg';
import { Get, Post } from 'egg-shell-decorators';
export default class UserController extends Controller {
  @Get('/:id')
  public getUser({ params: { id } }) {
    this.ctx.body = `getUser:${id}`;
  }
  @Post('/')
  public createUser({ request: { body: { name, phone, age } } }) {
    this.ctx.body = { name, phone, age };
  }
}

由于蛋壳内置把 ctx 对象传进 Controller 的函数里了，所以我们直接结构就可以获取到请求参数了，美滋滋~

安装

$ npm install egg-shell-decorators -S

如果不是采用 TypeScript 脚手架，则需执行以下脚本安装相关的 Babel 插件：

$ npm install babel-register babel-plugin-transform-decorators-legacy -D

使用

// app/router.ts
import { Application } from 'egg';
import { EggShell } from 'egg-shell-decorators';
export default (app: Application) => {
  EggShell(app);
};

如果不是采用 TypeScript 脚手架，则需在入口注册 Bable 插件使其支持 Decorator：

// app.js
'use strict';
require('babel-register')({
  plugins: [
    'transform-decorators-legacy',
  ],
});

装饰器

Method代表装饰的是 Controller 里的函数，而Controller则是装饰控制器的。

Http相关

• Method
  • ✅ Get (string)
    • 路由路径
  • ✅ Post (string)
    • 路由路径
  • ✅ Put (string)
    • 路由路径
  • ✅ Delete (string)
    • 路由路径
  • ✅ Patch (string)
    • 路由路径
  • ✅ Options (string)
    • 路由路径
  • ✅ Head (string)
    • 路由路径
  • ✅ All (string)
    • 路由路径

其他

• ✅ EggShell(app: Application, option: object) （非装饰器）
  • 核心对象
• Method
  • ✅ Middleware (Function[])
    • 中间件
• Controller
  • ✅ Prefix
    • 路由的前缀，用于取缔路由解析给的前缀（prefix）

案例

egg-shell-example 蛋壳示例代码，该仓库提供了一套简单的蛋壳示例代码，有疑惑的小伙伴可以下载取之。 该代码暂未更新到最新版本。

自定义路由前缀

如果你不喜欢路由解析给你的路径，那么你可以自定义解析的路径：

// app/controller/user.ts
import { Controller } from 'egg';
import { Get, Prefix } from 'egg-shell-decorators';
@Prefix('/super2god')
export default class UserController extends Controller {
  @Get('/detail/:id')
  @Message('so great !')
  public async get({ params: { id } }) {
    this.ctx.body = await this.service.user.getById(id)
  }
}

这样解析出来的路由就是：全局前缀 + /super2god/detail/:id，而不是全局前缀 + /user/detail/:id

RESTful

让我们用蛋壳快速写一套 RESTful 风格的接口（QuickStart 模式）：

import { Controller } from 'egg';
import { Get, Post, Put, Delete } from 'egg-shell-decorators';
export default class SubOrderController extends Controller {
  @Get('/:id')
  public get({ params: { id }, query: { keyword } }) {
    this.ctx.body = `resuful get : ${id}, ${keyword}`;
  }
  @Post('/:id')
  public post({ params: { id }, request: { body: { keyword } } }) {
    this.ctx.body = `resuful post : ${id}, ${keyword}`;
  }
  @Put('/:id')
  public put({ params: { id }, request: { body: { keyword } } }) {
    this.ctx.body = `resuful put : ${id}, ${keyword}`;
  }
  @Delete('/:id')
  public delete({ params: { id }, request: { body: { keyword } } }) {
    this.ctx.body = `resuful delete : ${id}, ${keyword}`;
  }
}

当然，除了这四个常用的请求方法，蛋壳还提供了其他比较常用的请求方法，具体请看上面的Member > Http相关。

中间件

蛋壳提供了中间件相关的装饰器，让你使用中间件更简单：

import { Controller } from 'egg';
import { Get, Middleware } from 'egg-shell-decorators';
import Middleware01 from '../middleware/middleware-01';
import Middleware02 from '../middleware/middleware-02';
import Middleware03 from '../middleware/middleware-03';
export default class UserController extends Controller {
  @Get('/')
  @Middleware([ Middleware01(), Middleware02(), Middleware03() ])
  public getUser() {
    this.ctx.body = { name: 'super2god' };
  }
}

技术交♂流

有啥技术问题可以加我微信~