OpenAI の API を使ったアプリ開発を始めるとき、
- 「とりあえず API が正しく叩けるか確認したい」
- 「モデルやパラメータの違いを雑に試したい」
- 「サーバー立てる前に、まずはローカルで触りたい」
という場面がほぼ必ずあります。
今回は、そういった “とりあえずテストしたい”用途 に特化した
HTML 単体のテストページを作成したので紹介します。
ローカルに落として、ChatGPT で怪しい処理(情報を抜きとる処理等)が含まれていないか確認してからの使用を推奨します。
これは何？
- HTML ファイル 1 枚だけ
- ブラウザで開くだけで動く
- OpenAI の API Key を入力して即実行可能
- GPT-5 系モデル（nano / mini）を切り替えて試せる
- reasoning_effort / verbosity を UI から調整可能
- 入力内容は IndexedDB に自動保存され、再起動しても続きから使える
という 完全にローカル完結のテスト用ツール です。
公開場所（コードはここ）
コードは Qiita に貼らず、GitHub に公開しています。
以下のリンクから HTML ファイルをそのままダウンロード してください。
使い方は非常に単純で、
- 上記リンクから HTML をダウンロード
- ローカルでダブルクリック or ブラウザで開く
- OpenAI の API Key を入力
- モデルやパラメータを調整して「送信」
これだけです。
OpenAI の API Key が必要です
当然ですが、このツールを使うには OpenAI の API Key が必要です。
- ChatGPT Plus のログインとは別物
- OpenAI Platform で発行する API Key
- 利用量に応じて課金される点に注意
API Key はページ上部の入力欄に入力します。
入力した Key は IndexedDB に保存されるだけ で、どこかに送信されたりはしません。
（※ それでも不安な方は、テスト後に IndexedDB を削除してください。
IndexedDB は同一オリジンポリシーにより、LocalStorage と比べると情報漏洩リスクはやや低い程度、という認識で問題ありません。
また、より安全を重視する場合は、API Key を IndexedDB に保存しない運用にするのも一つの方法です。）
主な機能
1. モデル切り替え（gpt-5-nano / gpt-5-mini）
モデル名の横にある「切替」ボタンを押すことで、
- gpt-5-nano
- gpt-5-mini
をワンクリックで切り替えられます。
API の挙動差やレスポンス速度の比較に便利です。
2. reasoning_effort の選択
以下の値を UI から選択できます。
- minimal
- low
- medium
- high
実際に触ってみると分かりますが、
実用的なレスポンス速度を考えると minimal 一択 になりがちです。
特にブラウザから直接 API を叩く用途や、
試行錯誤を高速に回したい場面では、
- medium / high → 体感でかなり遅い
- minimal → ストレスなく返ってくる
という印象があります。
実運用を想定するなら、
まずは reasoning_effort = minimal 前提で設計するのが無難だと思います。
3. verbosity の選択
出力の冗長さも以下から選べます。
- low
- medium
- high
プロンプトを詰めている場合は low、
雑に試したい場合は medium〜high といった使い分けが可能です。
4. ルール欄・メッセージ欄の自動保存
- ルール欄
- メッセージ欄
- API Key
は、入力するたびに IndexedDB に自動保存 されます。
そのため、
- ブラウザを閉じる
- 再度 HTML を開く
という操作をしても、前回の状態から即再開 できます。
テスト用途では地味にかなり便利です。
想定している使い道
このページは、以下のような用途を想定しています。
- OpenAI API を初めて触るときの疎通確認
- 新しいモデルのレスポンス確認
- reasoning_effort / verbosity の挙動比較
- プロンプトのたたき台作成
- 本実装前の「雑な実験場」
本番アプリに組み込む前の砂場 として使うイメージです。
セキュリティ・注意点
- API Key は IndexedDB に平文保存されます
- 公共端末・共有PCでは使用しない方が安全です
- 実用サービスにそのまま組み込む構成ではありません
あくまで ローカルでの個人利用・検証用途 と割り切って使うのが前提です。
まとめ
- HTML 1 枚で OpenAI API を即テストできる
- モデル切り替え・パラメータ調整が UI で完結
- 入力内容は自動保存でストレスなし
- reasoning_effort は実用上 minimal が現実的
- 本実装前のテスト用途にちょうどいい
OpenAI API を使った開発を始める際の
「最初の一歩」として、ちょうど良いツールになっていると思います。
必要に応じて自由に改造しながら使ってみてください。
ローカルに落として、ChatGPT で怪しい処理(情報を抜きとる処理等)が含まれていないか確認してからの使用を推奨します。