Utilo

OpenAPI → モック & TypeScript

OpenAPI 3 または Swagger 2(JSON / YAML)を貼り付けるだけで、全エンドポイントのリアルなモックレスポンス、TypeScript インターフェース、型付き fetch クライアントを生成。すべてブラウザ内で処理します。

この OpenAPI ツールの機能

フロントエンドの作業はバックエンドが準備される前に開始され、既に仕様があるAPIのタイプを手書きすることは無駄な作業です。JSONやYAMLで OpenAPI 3.xまたは Swagger 2.0のドキュメントを貼り付けると、このツールは3つのことを生成します。ブラウザで生成されるのでプライベートや内部APIの仕様はアップロードされません

使い方

  1. 仕様を貼り付け、ファイルをアップロードします。JSON と YAML の両方が受け入れられます。
  2. エンドポイントリストは、各操作の方法と経路を表示します。
  3. 模擬データタブを開いて、スケーマの例、フォーマット、数値から構築されたサンプル応答を見るために操作を選択します。
  4. components/schemas (またはSwagger 2のdefinitions) から生成されたインターフェースでは TS型に切り替える。
  5. TSクライアントに切り替えて、プロジェクトにコピーしてください。

模倣がどのように生成されるか

  • exampleとexamplesの値が常に勝っています
  • enumは最初の値を選び、defaultは尊重されます。
  • 文字列形式は、email、uuid、date-time、uri、ipv4などの妥当な値を生成します。
  • name、priceまたはcreatedAtは現実的に見えます。
  • $ref、allOf、oneOfとanyOfは解消され、再帰的な参照は安全に切断される。
  • 操作ごとに決定的なので、リフレッシュごとに変化しません。

生成されたクライアントを使用する

クライアントは、入力されたパスパラメータ、クエリパラメータ、リクエストボディで、入力された応答を返して、BASE_URL定数と1つの非同期関数を操作ごとに輸出し、その operationId (または方法と経路が欠落した場合) により命名する。fetchに依存しているのでブラウザ Node 18+、Deno、Bunでも動作します

よくある質問

どの仕様版がサポートされていますか?

OpenAPI 3.0と3.1とSwagger 2.0を追加しました。他のファイルやURLを指している外部$refは、取得されません.まずスペックをバンドルします (例えばredocly bundleで)。

偽のサーバーを動かせるか?

このツールでは、MSWハンドラー、フィクチャー、またはStorybookにコピーできる模擬のペイロードが表示されます。PRISMのようなツールは同じ仕様を使えます

これは openapi-typescriptと比べてどうでしょうか?

製造パイプラインの生産コードゲンには専用CLIが最適です。このツールは、迅速な、インストールなしの探査とプロトタイプ作成です。

私のスペックはアップロードされていますか?

違う違う。解析と生成は完全にローカルです

はい。すべての処理は JavaScript、Web Worker、Web API を使ってブラウザ内で直接行われます。入力・貼り付け・アップロードした内容がサーバーに送信されることはありません。

このページは英語から自動翻訳されています。誤りを見つけた場合はお知らせください。