o3のAPIを使ってMCP対応のチャットアプリをサクッと作る方法
こんにちは
昨日(4/17日)OpenAIから最新モデルのo3とo4-miniが発表され、ずっと遊んでいました。
しかし、気がつくとすぐに制限がかかってしまいました。
制限内容を確認すると、、、
ChatGPT Plus、Team、またはEnterpriseアカウントでは、o3で週に50メッセージ、o4-miniで1日150メッセージ、o4-mini-highで1日50メッセージにアクセスできます。
ChatGPT Proプランでは、o3、o4-mini、および4oモデルにほぼ無制限にアクセスできます。
OpenAI o3, o4-mini, and o3-mini Usage Limits on ChatGPT and the API
残念なことに、1週間使えないということが判明しました。
そうか、使えなくなってしまったのか
ならば、自作するかということで作ることにしました。
ついでに、ClaudeDesktopのようにMCPサーバ機能もつけよう
そう思い立ち、サクッと作りましたという記事です。
アプリケーションの機能紹介
雑な図解
雑に図解すると大体こんなイメージになっています。
Claude風インターフェースの特徴
最近よくClaudeDesktopを使っているので、それに似せたシンプルで使いやすいUI設計です。
Streamlitのフレームワークを使用して、カスタムCSSで、ClaudeのようなUIを実現しています。
必要機能のみを実装するつもりでさくっと作ったので、クオリティは期待しないでください。
具体的には以下のような特徴があります:
- Claude感を出すためにClaude Cloneのヘッダー表示
- 左右に分かれたチャットメッセージのレイアウト
- サイドバー設定パネルでカスタムインストラクションを登録可能(1つまで)
- MCPサーバ(現状Filesystemのみ実装)の使用のON/OFF
- MCPサーバで使用可能なツール数の表示
- AgentSDKのToolsで検索機能の実装
OpenAI o3モデルとの連携機能
このアプリでは、OpenAIのo3モデルを利用しています。
o3モデルをAPIで使用するには、25/4/18時点では認証された組織/個人しか使用できないようになっています。
以下のようなメッセージが出るので、認証が必要です。
免許証等があれば、すぐに認証できます。
あなたの組織はモデル o3-2025-04-16 を使用するために認証されている必要があります。
次のリンクにアクセスして、「組織を認証する(Verify Organization)」をクリックしてください:
👉 https://platform.openai.com/settings/organization/general
アプリでは、APIキーをサイドバーから入力できるようになっています。
また、会話のコンテキストを保持する仕組みも実装されているため、前後の文脈を踏まえた自然な会話が可能です。
カスタム指示の管理機能
Claudeの特徴的な機能の一つに「カスタム指示」があります。これは、AIアシスタントに対して、あらかじめ特定の指示や制約を与えておく機能です。
このアプリでも同様の機能を実装しており、以下のことができます:
- カスタム指示の入力と保存
- 指示のオン/オフ切り替え
- セッション間での指示の永続化
この機能はClaudeのプロジェクト機能をイメージしています。
ファイルなどのプロジェクトナレッジを追加する機能はいまのところ未実装ですが
ユースケースとしては、例えば「必ず敬語で応答すること」や「回答は3行以内に収めること」などの指示を一度設定しておけば、毎回指定する手間が省けます。
とりあえず、語尾にワンと付けなさいと指示しています。
Web検索連携機能
さらに、OpenAIのAgentSDKのToolである、WebSearchToolを利用したWeb検索機能も実装しています。これにより、AIがインターネット上の最新情報にアクセスし、より的確な回答を提供できるようになっています。
この部分もMCPで実装出来るのでは?と思われた方も多いでしょう。
単純にこのToolを使ってみたかっただけです。
使用方法は、公式の資料が以下にあるので参考にしました。
「今日の天気は?」などと質問すると、アプリはWeb検索を実行し、最新の情報を元に回答してくれます。もちろん、引用元の情報も表示されるので、ソースの信頼性も確認できます。
OpenAIのPlatform上のログからも確認できます。
気象庁の発表を見ても合っていそうです。
Filesystem MCPを活用したファイルシステム操作機能
みんな大好きMCP機能もつけています。
Filesystem MCPを活用したローカルファイルシステム操作機能が付いています。
MCPとは「Model Context Protocol」の略で、ざっくり言うと、AIモデルと外部ツールを連携させるための規格です。USB-TypeCによく例えられます。
詳細については、大量に記事があると思うので調べてください。
Filesystem MCPの場合は、自分のローカルフォルダにフォルダやファイルを作成したり、
ファイルを検索させたり、参照させたりすることが出来ます。
そして、その情報を回答に含めてくれるようになります。便利ですね。
今回は天気予報のリサーチをさせて、その結果をmdファイルで保存してもらいました。
使い道は特にないです。
以下のように、勝手に指定したフォルダにファイルを作ってくれます。
実装方法の詳細
OpenAI APIとの連携実装
基本的には、公式資料を見た方がいいと思っているので
公式資料のリンクを最初に貼っておきます。
MCPサーバー連携の実装
Filesystem MCPの実装は、MCPサーバーを別プロセスとして起動し、非同期通信を行っています:
class FileSystemMCPServer:
def __init__(self, filesystem_path: str = "C:\\Users\\kfkf1\\Desktop"):
self.filesystem_path = filesystem_path
self.server = None
self.agent = None
async def initialize(self, api_key: str | None) -> bool:
try:
# 1. MCP サーバーを subprocess で起動
self.server = MCPServerStdio(
params={
"command": "npx",
"args": [
"-y",
"@modelcontextprotocol/server-filesystem",
self.filesystem_path
]
}
)
await self.server.connect()
# Agentの初期化
# ...
Pythonのasyncio
モジュールを使い、サブプロセスとの通信や、複数のツールを組み合わせた処理を実現しています。
ファイル操作機能の実装方法
実際のファイル操作は、MCPサーバーを通じて行います。これにより、チャットインターフェースからファイルシステムにアクセスできるようになります:
async def process_request(self, prompt: str) -> str:
"""
ユーザープロンプトを処理し、結果を返す
"""
if not self.agent:
return "MCPサーバーが初期化されていません。"
try:
result = await Runner.run(self.agent, prompt)
return result.final_output
except Exception as e:
return f"リクエスト処理エラー: {e}"
ユーザーからのプロンプトは、Agentによって処理され、必要に応じてファイルシステム操作が実行されます。例えば「デスクトップのtodoリストを読み込んで」というプロンプトに対して、Agentはファイルを探し、内容を読み取り、それを元に応答を生成します。
今後の拡張(するかもしれない)
他のLLMモデルとの連携
現在はOpenAIのo3モデルを使用していますが、同様の仕組みで他のモデルとも連携できます。
これらのモデルに対応するには、APIクライアントの部分を修正する必要がありますが、基本的な構造は変わりません。
UI改善のアイデア
UIについては、まだまだ改善の余地があります:
- もっとClaudeに寄せる
追加したい機能の提案
アプリケーションに追加できる機能としては、以下のようなものが考えられます:
- 会話履歴のエクスポート/インポート
- 複数のカスタム指示プリセットの管理
- 画像生成AIとの連携
- 音声入出力機能
特に会話履歴の管理機能は、長期的な使用を考えると重要になってきます。
まとめ
今回は、Python+Streamlitを使って、Claude風のUIを持つチャットアプリを作ってみました。OpenAI APIとFilesystem MCPを組み合わせただけの最小限の機能のため、数時間で意外と簡単に作れました。
改善点はまだまだあるので、改善後にGithubで公開するかもしれません。
というわけで、今回は以上です。AIアプリケーション開発の世界は日々進化していますが、こういった小さな実験を重ねることで、新しい可能性が見えてくるものだと思います。皆さんも、ぜひ自分なりのアイデアでアプリケーションを作ってみてください!
追伸
本来の目的:
Plusプランでもたくさんo3を使いたい
結果:
APIが一瞬で解けていく
あれ、Proプランの方が安くなるんじゃ、、、
Discussion