下記記事で紹介した、無料枠のGemini APIとGAS（Google Apps Script）、スプレッドシートによるメニュー提案ツールは、テストとしては良い経験でしたが、回答が料理名のみで操作もクオリティも今ひとつでした。
せっかく作るなら本当に使えるツールにしたいということで、今回も料理系の提案とし、Claude APIのクレジット契約を加えた本格的なツールを作成しました。
結果的にウェブ検索機能とビジュアルに優れ、APIキーを安全に保管したツールが完成したので、実際に動かした感想も含めてご紹介します。
Gemini API+スプレッドシート版との違い・なぜClaude APIなのか
前回作成したメニュー提案ツールは、無料にこだわり過ぎて色々と限界を感じました。
- 回答の精度が今ひとつ（メニュー名の提案だけにしても）
- 操作感が今一つ
- ビジュアルが今ひとつ
- Geminiの無料枠では、ちょっとしたウェブ検索でもすぐ上限に到達する
Claudeはビジュアルに優れたツール（コード）作成が得意で、ウェブ検索用に使用するClaudeの有料API（5ドル～）がGeminiの有料API（10ドル～）よりも安価です。従ってClaudeにツール用コードを作成してもらい、Claude APIのクレジット契約をすることで、より優れたツール作成を実現出来ると考えました。
作成するツールの概要
それでは実際に作成するツールについて説明します。
- ビジュアルにこだわった外観
- 使用する食材・人数を入力して献立を提案
- 食材の分量、下処理から調理手順までを提示
- ウェブ検索機能により最新のレシピ情報も反映
- 苦手な食材やアレルギー対象食材の除外に対応
ツール本体はGASをウェブアプリ化したものを使用します。本来GASはプログラム実行ツールです。ツール実行用のGASを作成し、Claudeが作成したコードを貼り付けて、ウェブアプリ化（URLでウェブ公開）します。
ウェブアプリ化されたツールは、トークン認証欄を設けて入力方式とし、トークンを知っている人以外は使えない仕様とします。
ウェブ検索に必要なAPIキーとツール実行用のトークン（合言葉）は流出防止を目的として、
ツール実行用のGASとは別に管理ツール用GASを作成し、スクリプトプロパティに保管します。
管理ツール用GASで管理されたClaude APIキーと、ツール認証用のトークンをツール実行用のGASから間接的に指定することで、APIキーとトークンを安全に管理しながら運用します。
ツールの作成手順
ツールの作成手順をAPIのクレジット契約から順に説明します
Claude APIクレジット購入+APIキー発行
1.platform.claude.com にアクセスしてClaudeに再ログインします。（私の場合はGoogleアカウントでログイン）
2.「クレジットを購入」をクリックします。
3.”その他”をクリックし、金額（最低5ドル）を入力して請求先の氏名（私はローマ字で入力）と住所を入力します。
4.クレジットカード情報を入力するとメールアドレスとClaudeのアカウント名が表示されるので、電話番号を入力し、「クレジットを購入」をクリックします。
5.自動リロードはスキップします。（重要！）
自動リロードは安全な運用を考慮して”今はスキップ”をクリックします。クレジットの有効期限は購入日から1年間・返金不可です。
※自動チャージが必要な人は”自動リロードを有効にする”を選択して下さい。（後から有効にも出来ます）
※購入完了後、左側のツリーから”クレジット”をクリックすると残高が確認出来ます。又“Link by Stripe”横のペンマークをクリックするとカード情報の確認や支払い方法の変更が可能です。
6.左側のツリーから「APIキー」をクリックし、”APIキーを作成”画面から「キーを作成」をクリックします。
7.ワークスペースは”Default”を選択、名前は”ツール用”として”追加”をクリックします。そして表示されたAPIキーをコピーしてメモ帳等に保存します。
※作成されたAPIキーはいつでも削除、再作成が可能です。
Claudeにツール作成を依頼
下記のようなプロンプトを送ります。
下記の献立ツールを作成してください。
- 嫌いな食材またはアレルギー食材を入力し、使用する食材と人数を入力して献立提案ボタンを押すと、ウェブ検索の上、食材と分量・下処理・調理手順が提案される。
- 献立ツールはGASウェブアプリとして単体で動作すること。（デザイン確認用にArtifactでプレビューし、実際の動作はGASウェブアプリで行うこと）
- 献立ツール起動時に認証トークン入力画面を表示し、正しいトークンを入力した場合に使用可能とすること。
- ClaudeのAPIキーと認証トークンは、ウェブアプリ化しない管理用ツールとして作成されたGASのスクリプトプロパティに保存してライブラリ化し、献立ツールおよび他のウェブアプリからも呼び出せるようにすること。
- コードで使用するバージョンやモデル、ツール指定等は最新情報を元に作成すること。
管理ツール用GASにコード貼り付け、APIキーとトークンを保存
- 出力された管理ツール用GSコードをコピーします。
- 連携するGoogleアカウントでGoogleドライブを開きます。
- “+新規”-“その他”-“Google Apps Script”を開きます
- “スクリプトを作成”をクリックします。
- 既存コードを全削除し、GSコードを貼り付けて保存（フロッピーディスクアイコンをクリックまたはCtrl+S）します。
- Apps Scriptの”プロジェクトの設定”（歯車マーク）-“スクリプト プロパティを追加”からAPIキーとトークン（プロパティの文字列はClaudeより指定されるので確認すること）を入力し、”スクリプトプロパティを保存”をクリックします。
- スクリプトID（同じ画面にあります）をコピーしてメモ帳アプリ等に保存します。
献立ツール用GASにGSコードとindexコードを貼り付け
- 出力された献立ツール用GSコードをコピーします。
- 管理ツール用GASへのGSコード貼り付けと同様の手順でGASを作成し、献立ツール用のGSコードを貼り付けて保存します。
- “+”から”HTML”をクリックします。
- 名称はClaudeから指定された文字列をを入力し、ENTERを押します。
- “*****.HTML”の既存コードを全削除し、献立ツール用HTMLコード（ウェブアプリの画面用）を貼り付けます。
- “ライブラリ”-“+”をクリックし、管理用ツールでコピーしたスクリプトIDを貼り付けて検索をクリックします。
- バージョンはHEAD（開発モード）とし、IDはClaude指定の文字列（献立ツール用コードにも記載）を記入して”追加”をクリックします。
- 保存（フロッピーディスクアイコンをクリックまたはCtrl+S）します。
GASを公開（デプロイ）
作成された献立ツールを公開してウェブアプリ化することで、実際にツールを使うことが出来ます。
- GAS画面の右上”デプロイ”-“新しいデプロイ”をクリックします。
- “ウェブアプリ”をクリックします。
- “説明文”の入力（自由）と、自分のgmailアカウントの選択、アクセスできるユーザーを選択（自分のみ or Googleアカウントを持つ全員 or 全員）して”デプロイ”をクリックします。
- アクセス承認を行います。
- ウェブアプリURLをコピーして完了です。
デプロイ手順はGAS上で翻訳がおかしい部分もありますが、下記画像の通りに進めて頂ければ大丈夫です。
献立提案ツールの動作確認
こんな感じのツールが完成しました。
プロンプトの通り、まず認証用のトークンを正しく入力すると”認証済み”と表示されます。
おぉぉぉぉ！
やっと出てきたかキミ
“豆腐”と”ひき肉”を選択して”献立を提案する”をクリックすると”ウェブ検索・生成中”と表示が切り替わりました。
しばらくすると、”麻婆豆腐”、”食材と分量”、”下処理”、”調理手順”が表示されました。
すごいすごい！
だよね！
API使用量も確認し、1回あたり0.03ドル（5円程度）でした。
うまく動作しない場合は例によって、その状況をClaudeに伝えることで改善出来ます。
使ってみた感想
Geminiの無料API+スプレッドシート版と比べて、クオリティが格段に上がりました。
良かった点
- 無料API+スプレッドシート版ではトークンの制限上、料理名の提案が限界でしたが、今回は下処理も調理方法等、全てのステップが自動で提案されました。
- ビジュアルも大幅に向上し、Claudeの良いところが反映されました。
気になった点
- 1回の提案で0.03ドル（5円程度）APIクレジットを消費しますので、料理の提案として使いたいツールかどうかは人によるかなと思いました。
- ウェブ検索に多少の時間が掛かります。（20秒程度）
料金・注意点
料金や注意点について整理します。
料金について
初めてAPIを試すなら、まずAPIクレジットを5ドル購入するのがおススメです。
公開・共有時の注意点
今回はウェブアプリとして不特定多数の人に公開する訳ではないですし、公開したとしてもトークン認証があるのでリスクは低いですが、自分で契約したAPIキーを消費する為、多くの人に公開、共有した場合にはすぐに残高が無くなることをご承知おき下さい。
自動チャージはオフ推奨
platform.claude.comの自動リロード（チャージ）画面ではスキップしておきましょう。自動リロードオンのままだと、前払いクレジットを使い切った後も自動で課金が続いてしまいます。
ぱぴすけの悩み
今回のツール作成において、2つのGASを作成して3つのコードを貼り付けたり、ライブラリを作成したりと、手順が多くなってしまったと感じています。これはAPIキーを安全のために間接指定していることが原因で、APIキーを直接コードに書くことが出来ればGASを経由する必要がなく、もっと簡単にツールが作成できます。
APIキー流出の可能性と、流出した場合でも上限が決まっていることを考えるとアーティファクトにAPIキー直書きでも良いかも知れないと考えたり、そうだとしても他のツールとAPIキーを共有して使うなら、GASの間接指定の方が汎用性があるかなと考えたりしています。
みなさんの考えはどうでしょうか？
むずかしいことは分からん！
だよね．．。
まとめ
今回はClaude APIとGASのウェブアプリを組み合わせた献立提案ツールの作成方法を紹介しました。クオリティの高さに満足していますが、生成AIの技術はこの記事を書いている間にもどんどん進歩していて、焦りを感じます。
ただ、難しいイメージのあったAPI連携も、ビジュアルに優れたツール作成もClaudeを使えばプロンプト一つで形になるということはお分かり頂けたと思います。
まずは5ドル分のクレジットを購入して、是非自分だけのツール作成にチャレンジしてみてください！
それでは！
