🍣
OrvalでOpenAPIからMCPサーバを作る
はじめに
@denwaya34です。😉
Orval v7.9.0でOpenAPIからMCPサーバを作成できるようになったので試してみます。
やり方
公式ドキュメントに手順が書いてあるのでそれを踏襲してやってみます.
1. Configファイル(=orval.config.ts)を作成
orval.config.ts
import { defineConfig } from 'orval';
export default defineConfig({
petstore: {
input: {
target: './petstore.yaml',
},
output: {
mode: 'single',
client: 'mcp',
baseUrl: 'https://petstore3.swagger.io/api/v3',
target: 'src/handlers.ts',
schemas: 'src/http-schemas',
},
},
});
2. openapi定義ファイルを用意
petstoreのOpenAPI定義ファイル(=petstore.yaml)が公式サンプルにあるので、それを拝借します。
3. パッケージのインストール
以下、package.jsonを作成します。
package.json
{
"name": "orval-petstore-mcp",
"version": "1.0.0",
"main": "index.js",
"scripts": {
"start": "node ./dist/server.mjs",
"inspect": "npx @modelcontextprotocol/inspector node ./dist/server.mjs",
"dev": "tsx ./src/server.ts",
"build": "orval",
"tsdown:build": "tsdown"
},
"keywords": [],
"author": "",
"license": "ISC",
"description": "",
"devDependencies": {
"@modelcontextprotocol/inspector": "0.11.0",
"@types/node": "^22.15.3",
"orval": "7.9.0",
"tsdown": "0.11.0-beta.3",
"tsx": "4.19.4",
"typescript": "5.8.3"
},
"dependencies": {
"@modelcontextprotocol/sdk": "1.11.0",
"zod": "3.24.3"
}
}
4. mcpサーバのTypeScriptコードを生成
下記コマンドでopenapi定義ファイル(=petstore.yaml)からmcpサーバのTypeScriptコードを生成します。
npm run build
or
orval
その後、mcp clientから参照しやすくする為、jsファイルへ変換します
※今回はバンドラにtsdownを使用しました
npm run tsdown:build
or
tsdown
これでMCPサーバは完成です。
5. MCPクライアント(vscode github copilot)にMCPサーバを設定
今回はgithub copilotをMCPクライアントする事にして.vscode/mcp.jsonファイルを作成します。
.vscode/mcp.json
{
"servers": {
"pet-store": {
"type": "stdio",
"command": "node",
"args": [
"${workspaceFolder}/dist/server.mjs"
]
}
}
}
完成形のソースコード
感想
一応、公式サンプルのopenapi定義ファイル(=petstore.yaml)であれば問題なくビルド&動作しました。
ただ、自前で作ったopenapi定義ファイルやswagger公式の定義ファイルだと生成ファイルが足りなかったりビルドに失敗する事象が発生していました。
定義ファイルの形式次第で失敗するようです。
あと、生成したmcpサーバにはOpenAPIの定義はToolsとして実装されます。
Discussion