【Bun】ElysiaでSwagger エンドポイントを生成してみる

Elysia には Swaggerプラグインがあります。Swagger は、APIを設計・ドキュメント化するためのツールですが、Elysia なら簡単に実装できます。

昔は、API を作った上にその使い方をもくもくと泣きながらドキュメントに仕上げたものですが、今は Swagger 一発で書けるうえに、万が一(?) API の仕様などが変わっても簡単に書き換えられるわけです。有難いです。

で、Swaggerプラグインのサイトはここです。

では、ここの最初のサンプルを試してみましょう。

Swaggerインストール

$ bun add @elysiajs/swagger

Swagger用スクリプト swgr-1.js

import { Elysia } from 'elysia'
import { swagger } from '@elysiajs/swagger'

new Elysia()
    .use(swagger())
    .get('/', () => 'hi')
    .post('/hello', () => 'world')
    .listen(9001)

実行します

$ bun swgr-1.js

この状態で ブラウザから 今回作った

http://＜アドレス＞:9001/swagger

へアクセスするとお馴染みのSwagger の画面が現れます。

これだけです。簡単。

「Try it out」ボタンでAPIに get したり post して動作確認し、そのサーバーへ Request と Response の結果を見ることもできます。

では実際に、タグ名を「myApp」としたサンプルを置いておきますね。

サンプル( http://74.226.208.203:9001/swagger )

各 GET/POSTを開いて、「Try it out」と「Execute」ボタンを押してみると、APIへ その Curl が発行されて Response body と Response headers などを確認できます。

コードはこれだけ。

Swagger用スクリプト swgr-1.js

import { Elysia } from 'elysia'
import { swagger } from '@elysiajs/swagger'

new Elysia()
    .use(swagger())
    .get('/', () => 'Hello Elysia', {
       detail: {
         tags: ['myApp']
       }
    })
    .post('/hello', () => 'world')
    .listen(9001)

実行します

$ bun swgr-1.js

まぁ詳細は Elysia>Swagger Plugin のサイトや

Swagger のページをご覧ください。

最近 Qiita に書いた Bun 関連の記事