見出し画像

旅botミニを公開しました 2.dbとGoogle APIと画像API設定編

の続きです。

さらにdbの設定とGoogle map API と画像生成AI (pixAiまたはStability.ai画像生成 API)の設定を解説します。
ここが出来るとアバターをあっちこっちに連れていってその風景を表示することが出来ます。
個々の設定はいろいろなサイトでも説明されているのでそれらの情報サイトの手順で行ってもよいです。
またせっかくClaudeを使っているので、手順に詰まったらClaude やchatgptに質問して解決するのも手です。
ただ課金や規約など正しくは各APIサービスの説明を読むことをお勧めします。

DBの設定

現在地情報など旅に必要な情報をdbに保存するためdbファイルの保存場所を指定します。これにより実行中の旅の状態を覚えているのでClaude Desktopを終了しても経路の移動状態を再現できます。
例えば以下のような形です。

%USERPROFILE%/Desktop/traveler.sqlite

$HOME/traveler.sqlite

Window であっても/で区切ってください。db に使う存在しないファイル名を指定してください。一応環境変数は使えるようにしていますが絶対パスでもokです。
自動でファイル位置を決めてもよかったのですが認識してないファイルが増えるのもあまり好きではないのでよいかなと。そのうち自動設定も考えます。SQLite 形式ファイルです。

{
  "mcpServers": {
    "traveler": {
      "command": "npx",
      "args": ["-y","@mfukushim/map-traveler-mcp"],
          "env":{
             "sqlite_path":"%USERPROFILE%/Desktop/traveler.sqlite"
      }
    }
  }
}

Google map API の設定

以下のページに公式の手順があります。

旅botにはGoogle map API で必要な権限は以下の4つです。

  • Street View Static API

  • Places API (New)

  • Time Zone API

  • Directions API

以下、要点だけ手順を示します。

手順の確認
Google Cloudのページをアクセスする
Google Cloudの使用登録
Google Cloudプロジェクトを作成
新規プロジェクトを作成
Google Map Platformの利用登録
クレジットカードの登録(認証の意味で必要だそうです。。)
カード確認
カード確認
アンケートはスキップも可
Google Map APIキーの表示(別の画面でも確認できます)
使わない機能以外のAPIをマスクする
Street View Static APIは使う、Time Zone APIは使う
Places API (New)は使う
Directions APIは使う
とりあえずこの状態へ

もしかしたらAPI画面で各APIのEnable選択も必要かもです。

4つのAPIがEnableになっている(Disableボタンが表示されている状態)
キーの再確認

GoogleMapApi_keyキーをconfigに設定します。

{
  "mcpServers": {
    "traveler": {
      "command": "npx",
      "args": ["-y","@mfukushim/map-traveler-mcp"],
         "env":{
            "GoogleMapApi_key":"xxxxxxxx",
            "sqlite_path":"%USERPROFILE%/Desktop/traveler.sqlite"
      }
    }
  }
}

API にはどのくらいのお金がかかるの

Google map APIの初回利用には一定の無料ポイントがあります。ですのでお試しくらいであれば全然お金はかからないはずです。
そもそも旅botに使う程度の使用回数でガッツリ費用がかかるのであれば、数年以上も旅botを走らせたりしないです。
ただあっちこっち風景を多量にアクセスすれば課金がかかるかもしれないので課金上限設定をした上でGoogle cloudコンソールの課金額表示に注意してください。

任意の地名に移動できるようになる

pythonの設定

今回背景削除にpython 版rembg を使っています(紆余曲折はあるのですがそれは後程。。)。
そのためpython3 とrembgのインストールが必要です。

pythonは皆さん苦労しているように結構環境がごちゃごちゃになるので、最初のpython3をインストール後、venvなどの仮想環境を使ってインストールすることをお勧めします。分かりやすいインターネット記事や慣れたツールで構築することをお勧めしますがとりあえずは公式の手順が無難なのかな。。

このあたりは他の人達が書いたpythonの入門設定の記事がわかりやすいと思うのでネットで探してみてください。。ChatGPTやClaudeに聞くとかでもよいかもです。

仮想環境とrembgのインストール

rembgの指定により使うpythonは3.7~3.11までです。

python版のrembg cliのインストールをします。

python3 -m venv venv
. venv/bin/activate または .\venv\Scripts\activate
pip install "rembg[cpu,cli]" 

少し時間がかかります。インストールが終わったら画像透過できるか確認します。
正常にrembg cliが動作するかサンプルの画像ファイルを使って確認してください。人が写っている画像を入力し、出力ファイルで人が切り出されていればokです。

rembg i 入力ファイル名 出力ファイル名

この後、python環境にインストールされたrembg cli(コマンド)の絶対パスをconfigに設定します。

{
  "mcpServers": {
    "traveler": {
      "command": "npx",
      "args": ["-y","@mfukushim/map-traveler-mcp"],
            "env":{
         "GoogleMapApi_key":"xxxxxxxxx",
         "sqlite_path":"%USERPROFILE%/Desktop/traveler.sqlite",
         "rembg_path": "C:\\Users\\xxxx\\Documents\\rembg_venv\\venv\\Scripts\\rembg.exe"
      }
    }
  }
}

上記のvenvの手順で設定した場合は操作したディレクトリの下のvenv\Scripts\rembg.exe やvenv/bin/rembg とかになるはずです。
ファイルパスの取得はOSによっては結構面倒ですがファイルエクスプローラやFinderをうまく使ってパスを入れてください。またWindowsでは\\になるので注意してください。

画像生成AI API の設定

画像生成AI のAPI は現時点以下の2つを組み込んでいます。
どちらでもお好みのほうをどうぞ。いずれも有償です(無料ポイント等はあるが登録は必須)

旅botではGoogle street view で取得した画像をimage to imageで画像生成し、その画像からアバター画像をrembgで抽出して合成するという方法を使っています。
このためAPI が公開されていてかつi2iがサポートされているサービスとなり、そのため現時点はStable -diffusion 系統の画像生成を使います。
あとmimiは画像が合成画像であることがわかりやすいように、プロンプトにanime,mangaのキーワードを追加するようにしています。

公式のAPI 使用手順は以下のページをご確認ください。いずれも有償で登録などが必要です。
https://platform.pixai.art/docs/getting-started/00---quickstart/ 
https://platform.stability.ai/docs/api-reference#tag/SDXL-1.0-and-SD1.6 

{
  "mcpServers": {
    "traveler": {
      "command": "npx",
      "args": ["-y","@mfukushim/map-traveler-mcp"],
            "env":{
         "GoogleMapApi_key":"xxxxxxx",
         "sqlite_path":"%USERPROFILE%/Desktop/traveler.sqlite",
         "rembg_path": "C:\\Users\\xxx\\Documents\\rembg_venv\\venv\\Scripts\\rembg.exe",
         "pixAi_key":"yyyyyyyyy" (または "sd_key": "zzzzzzzz")
      }
    }
  }
}

API コストについて

オリジナルの旅botではローカルサーバー機で動かしているComifyUIのAPI を使っています。このため画像生成時のコストは電気代程度で画像生成API 使用時のコストは私も今回が初です。どちらも初回登録時のサービスポイントはあるようですがpixAiはAPIを使う場合は課金の設定が必要なようです。どちらにしても上限設定をするなりして想定外の課金にはご注意ください。

設定がうまくいけば、StreetViewにアバターを合成した風景を表示できるようになります。最適な生成画像が出るまで結構APIリトライなども行うので少々時間がかかるかもしれません(数分かかるのでそのうち時間調整するかも。。)

画像生成AIを接続

旅を試してみる

Google map API と画像生成API がつながると本格的に旅操作が可能になります。
操作できるアクションも増えますので動作確認します。体験モードと異なり複数のAPI (画像生成含む)を呼び出すので30秒〜1,2分待たされますがそれは仕方ないところです。

現在地を設定する

設定し終えたらClaude Desktop を再起動します。
現在地を設定
「今どこにいますか」とプロンプトを入力します。
「今ホテルにいますが現在地はわからないので場所を入力してください」みたいなことがかえってくるので出発地にしたい地名を入力してください。ホテルの画像も現在時刻に合わせた新規画像が生成されます。
「(地名や場所名)でお願い」とプロンプトを入力します。教える現在地はGoogle mapで指示出来る場所ならどこでもよいです(むしろプライバシー上、本当の現在地は入れないようにしてください)
「(地名)を設定します」旨を言ってきたらok です。

目的地を設定する

「(地名や場所名)へ行きたい」とプロンプトを入力します。
複数のAPI コマンド呼び出し後、「出発しました」旨のメッセージが出ます。

旅に出発する

「旅に出発してください」とプロンプトを入力します。
少し待たされますが「今(地名等)です。そばに(建物名)があります」旨のメッセージとともに付近の風景を合成した風景画像が生成されればokです。

いまどこにいますか

「いまどこにいますか」とプロンプトを入力します。
複数のAPIコマンドを呼び出し後、付近の情景を説明してくれます。
画像生成APIがきちんとつながっていればアバターを含めた付近風景の合成画像を生成します(きれいな生成が出るまで数回リトライすることがあり若干時間がかかります。生成エラー時は合成なし風景が出たり、画像が撮れなかった旨を報告する場合もあります)
Claude Desktopそのものに一定時間ごとに停泊する指示を出す機能はないので現状は、人が「いまどこにいるかなー」と思ったときにClaude Desktopに問い合わせるプロンプトを入力してください。このあたりは専門のMCP Clientでも作るしかないところだと見ています。

停止する

「旅を中止してください」とプロンプトを入力します。
「旅を中断します」旨の出力と画像が表示されればokです。
そのまま放置しても走行します。
現在地を聞いたり旅を停止させなくても移動は続けています。そのままままおいておくと目的地に到着した状態でホテルに入ります。移動速度はおよそ自転車程度(自動車移動速度の1/4)を想定しています。
APIはコマンド発行時にしか呼ばれないので対話しなければAPIコストは発生しません。

ここまでのコマンドは固定の文面で指示していますが、Claudeへの指示なのでもっと自然言語で適当に入力しても全然きれいに解釈します。
「横浜駅にいこー」でも
「隣の市に行きたい」でもClaude自身の地理知識を使ってよしなに旅をはじめてくれます。

旅スクリプトを取り込む

それでもこのままでは旅botの操作がコマンドみたいで少し味気がないです。
Claude のProjects 機能で旅bot の前提行動全体を指示して、旅人と語らうような会話になるようにアドインから前提知識を取り込んで設定します。

Claude Desktopのプラグみたいなボタンを押下すると前提知識を取り込みます。

MCP添付知識の取込
今はとりあえずrole.txtを選択してください

これでClaude側が旅人の役をする形になります。ですので雑談をおりまぜながらあっちこっちへ行くことが出来ます。
これは前提知識のプロンプトとして書かれているので、取り込んだプロンプトをベースとしていろいろ自分好みに改良してみてください。
Claude Desktopの有償アカウントだとProjectsを組めますので事前スクリプトの編集なども可能です。

これで旅bot の一番基本的な機能である旅の機能は動きましたので、いろんな場所を旅してみてください。

少し間を置いて、次はSNS機能の設定と旅bot アドイン独自機能である「旅bot間プロトコルレス通信」の説明を予定しています。

いいなと思ったら応援しよう!