福山大学学友会

プログラミンサークル

Orvalを使って天気MCPサーバーを自動生成してみる

本記事では、OpenAPI 仕様書から TypeScript の API クライアントを生成するライブラリ Orval を使い、MCP (Model Context Protocol) サーバーを自動生成する方法を試してみました。「livedoor 天気互換 API」の OpenAPI 定義を使い、Cursor などの AI エージェントから最新の天気情報を取得できるツールを爆速で構築してみました。

OpenAPIからTypeScript のAPIクライアントを自動生成してくれる Orvalというライブラリがありました。調べているとOrvalを使って、OpenAPIのスキーマからMCPサーバーを自動生成できるようになったという記事を見つけてしまいました。

これを使って天気予報 API(livedoor 天気互換)のMCPサーバーを自動生成してみた話です。

リポジトリはこちらになります。

itojum/weather_mcp

リポジトリ構成

weather_mcp/
├── package.json
├── tsconfig.json
└── src/
    ├── orval.config.ts          # Orval の設定
    ├── docs/
    │   └── weather.yaml         # 天気 API の OpenAPI 仕様
    └── generated/               # Orval の生成先

OpenAPI 仕様(weather.yaml)

天気 API のドキュメントは以下のリンクから見れます。

天気予報 API(livedoor 天気互換)

このドキュメントの内容をOpenAPI仕様に書き直して、ファイル化しました。

weather_mcp/src/docs/weather.yaml at main · itojum/weather_mcp

出力してみる

MCPサーバーを生成するために、client: "mcp" を指定するらしいです。

import { defineConfig } from "orval";

export default defineConfig({
  weather: {
    input: {
      target: "./docs/weather.yaml",
    },
    output: {
      mode: "single",
      baseUrl: "https://weather.tsukumijima.net/api",
      target: "./generated/handlers.ts",
      schemas: "./generated/http-schemas",
      client: "mcp",
    },
  },
});
  • input.target: 上記の OpenAPI ファイル
  • output.target: ハンドラーなどがまとまるエントリ(handlers.ts
  • output.schemas: 型定義(http-schemas
  • output.client: "mcp": MCP 用のサーバー・ツール・Zod スキーマを生成

ここまで設定した状態で npx orval --config ./src/api/orval.config.tsを実行すると、generated/ 以下に MCP サーバーに必要な一式が出力されました。

MCP サーバーに必要なファイル群の画像

使ってみる

私は普段Cursorを使っているので、CursorにMCPサーバーを登録してみます。

"weather": {
  "command": "node",
  "args": [
    "[絶対パス]/weather_mcp/dist/generated/server.js"
  ]
}

動いてそう

Cursorチャットでの天気MCPの動作確認画像

まとめ

Orval の client: "mcp" を使うことで、OpenAPI 仕様書から MCP サーバーを一瞬で自動生成することができました。

LLMを使えばAPIのドキュメントからOpenAPI仕様書にするのも簡単なので、「既存のAPIをAIに使わせたい」という場面において、Orvalは良い選択肢になりそうです。