安装插件

优质
小牛编辑
133浏览
2023-12-01

安装 body 解析插件

koa 仅仅只提供最简单的功能,而不提供请求的body解析,所以我们需要一个解析body的插件。
所有的插件我们都可以在这里找到。

npm install koa-better-body -S

我们自己来写代码提示文件,在 node_modules/@types 目录下面新建 koa-better-body 文件夹,再在里面新建 index.d.ts

我为什么要把这个文件写在@types目录下,而不是在 tsconfig.json 里面重新增加一个 typeRoots 路径,是因为只有在@types目录下面才会被解析成模块。

假如我们不知道怎么写,我们首先安装一个同类型的插件,仿照着写。

npm i @types/koa-bodyparser -D

这样我们就可以仿照 koa-bodyparser 的代码提示文件写了。

插件的配置项具体是什么类型,在这里可以找到。

完成的文件如下

import * as Koa from 'koa';
import * as formidable from 'formidable';

declare module "koa"{
    interface Request {
        body: any,
        files: any,
        fields: any
    }
}

declare function bodyParser(opts? : {
    fields?: boolean | string,
    files?: boolean | string,
    multipart?: boolean,
    textLimit?: string,
    formLimit?: string,
    urlencodedLimit?: string,
    jsonLimit?: string,
    bufferLimit?: string,
    jsonStrict?: boolean,
    detectJSON?: () => any,
    strict?: boolean,
    onerror?: () => any,
    extendTypes?: Object,
    IncomingForm?: formidable.IncomingForm,
    handler?: GeneratorFunction,
    querystring?: Object,
    qs?: Object,
    delimiter?: string,
    sep?: string,
    buffer?: boolean
}): Koa.Middleware;

declare namespace bodyParser {}

export = bodyParser;

安装路由插件

npm install koa-better-router -S

以同样的方式,我们创建@types/koa-better-router/index.d.ts

npm i @types/koa-router -D

我们可以仿照 koa-router 写,当然我们前提已经看完了 koa-better-router README.md 的 API。

import * as Koa from 'koa';

declare class Router{
    routes: Array<any>;
    get(path: string, fn: (ctx: Router.IRouteContext, next: () => Promise<any>) => any) : any;
    post(path: string, fn: (ctx: Router.IRouteContext, next: () => Promise<any>) => any): any;
    put(path: string, fn: (ctx: Router.IRouteContext, next: () => Promise<any>) => any): any;
    del(path: string, fn: (ctx: Router.IRouteContext, next: () => Promise<any>) => any): any;
    loadMethods() : Router;
    createRoute(method: string, path: string | Function,fn?: any, ...args: Function[]) : Object;
    addRoute(method: string, path: string | Function,fn?: any, ...args: Function[]) : Object;
    getRoute(method: string, path: string | Function, fn?: any, ...args: Function[]) : Object;
    addRoutes(...fn: Array<any>) : Router;
    getRoutes() : any[];
    groupRoutes(dest: any, src1: any, src2: any) : any;
    extend(router: Object): Router;
    middleware(): Koa.Middleware;
    legacyMiddleware(): GeneratorFunction;
}

declare module "koa"{
    interface Context {
        params: any
    }
}

declare namespace Router{
    export interface IRouteContext extends Koa.Context{
        route: any
    }

    export interface IOptions {
        notFound?: (ctx: IRouteContext, next: () => Promise<any> ) => any;
        prefix?: string
    }
}


declare function RouterFactory(opts? : Router.IOptions) : Router;

declare namespace RouterFactory {}

export = RouterFactory

Convert

当我们使用此刻的这些插件的时候,可能会抛出一个警告,所以我们需要 koa-convert 这个工具。

npm i koa-convert -S

此时修改我们的 index.ts

import * as Koa from 'koa';
import * as bodyParser from 'koa-better-body';
import * as Router from 'koa-better-router';
import * as Convert from 'koa-convert';

const router = Router().loadMethods();

const app = new Koa();

router.get('/hello', async (ctx, next) => {
  ctx.body = `Hello world! Prefix: ${ctx.route.prefix}`
  await next()
});

router.get('/foobar', async (ctx, next) => {
  ctx.body = `Foo Bar Baz! ${ctx.route.prefix}`
  await next()
})

const api = Router({ prefix: '/api' })
api.extend(router)

app.use(Convert(bodyParser()));
app.use(router.middleware());
app.use(api.middleware());

app.listen(3000, () => {
    console.log("Server Stared on http://localhost:3000")
});

运行起来,看一看。