アプリにAI機能を追加する方法
アプリにAI機能を追加するには、サーバーから大規模言語モデル(LLM)のAPIを呼び出します。明確な指示と関連データを送り、返ってきた結果を使います。よく使われる機能は、要約、チャット、構造化データの抽出、分類の4つのパターンのどれかに当てはまり、それぞれ数十行程度のコードで実装できます。AIビルダーに書いてもらうこともできます。機能の良し悪しを決めるのは、呼び出しの周辺の作業です。APIキーをサーバーに置くこと、ユーザーごとのコストを管理すること、結果を信頼する前に確認することです。
ほとんどのAI機能の土台となる4つのパターン
| パターン | 役割 | 機能の例 | 典型的な出力 |
|---|---|---|---|
| 要約 | 長い文章を短くまとめる | 会議メモのダイジェスト、チケットの要約、文書の「何が変わったか」 | 段落や箇条書き |
| チャット | 会話の中で質問に答える。多くの場合あなたのデータについて | ヘルプアシスタント、「ドキュメントに質問」、オンボーディングガイド | ストリーミングされるテキスト |
| 抽出 | 雑多なテキストや画像から、構造化された項目を取り出す | PDFから請求書の情報、メール署名から連絡先、求人票から職務データ | スキーマに合ったJSON |
| 分類 | 決まったラベルの中から選ぶ | サポートチケットの振り分け、フィードバックのトピック別タグ付け、緊急メッセージの検出、言語判定 | ラベル1つ(必要に応じて確信度の注記) |
抽出と分類は、もっとも価値が高いのに目立ちにくい機能です。レコードひとつごとに数分の手間を静かに省いてくれ、出力の形式が決まっているので自動で検証できます。チャットはもっとも目立ちますが、正しく作るのがいちばん難しく、専用のガイドがあります:AIチャットボットアプリの作り方。
アプリへの組み込み方
どのパターンも、同じ形をしています。
- ユーザーが操作する。 「要約」をクリックする、ファイルをアップロードする、メッセージを送る。
- フロントエンドは、AIプロバイダーではなく自分のサーバーを呼び出す。
- サーバーがリクエストを組み立てる。 システム指示、ユーザーの入力、モデルに必要なデータベース上のデータ。ただし、そのユーザーが見てよいデータに限る。
- サーバーがLLM APIを呼び出す。 キーは環境変数に保存されたものを使う。
- サーバーが応答を検証する。 有効なJSONか、既知のラベルか、適切な長さかを確かめてから、保存または返却する。
- フロントエンドが表示する。 長い回答は、届いた順にテキストをストリーミング表示する。
キーは手順4のとおりサーバーに置かれ、ブラウザには決して届きません。APIという概念が新しい場合は、APIとはが短い入門になります。トークン、モデル、キーについてより詳しく知りたい場合は、LLM APIの使い方を参照してください。
プロバイダーとモデルの選び方
OpenAI、Anthropic、Googleなどの主要なプロバイダーはいずれも、似た形のテキストAPIを提供しています。選ぶときの確認ポイントは次のとおりです。
- 自分の作業での品質。 アプリの実際の例を2〜3種類のモデルで試してください。違いは、一般的なベンチマークより自分のデータの方がはっきり分かることが多いです。
- 規模とコストのバランス。 プロバイダーは、より高性能な大型モデルと、安くて速い小型モデルの両方を用意しています。分類や単純な抽出は小型モデルでうまくいくことが多く、長い推論や繊細な文章作成には大型モデルが必要かもしれません。
- 構造化出力。 抽出や分類では、自由形式のテキストを解析するのではなく、指定したスキーマに合うJSONを返させるAPIの機能を使ってください。
- データの扱い。 API入力が保存されるか、学習に使われるかどうかをプロバイダーの規約で確認し、ユーザーから預かるデータに合うかを判断してください。
- 上限。 新しいアカウントは、レート制限が低く設定されていることがよくあります。公開前に確認しておいてください。
モデル名や価格は頻繁に変わります。そのため、コードではモデル名を多くの場所にベタ書きせず、設定から読み込むようにしてください。
機能を1つずつ追加する
具体例で考えましょう。各連絡先に長いメモの履歴がある、小さなCRMです。
1. キーを保存する。 プロバイダーのダッシュボードでキーを作成し、サーバー側のシークレットとして保存します(例:OPENAI_API_KEYやANTHROPIC_API_KEY)。
2. 範囲の狭い機能を1つ依頼する:
連絡先ページに「要約」ボタンを追加して。サーバー側で、連絡先の直近20件のメモを、シークレット[ENV_NAME]を使って[PROVIDER]に送り、3つの箇条書きで現在の状況、未解決の質問、次のステップを書いてもらって。ログイン中のユーザーが見られるメモだけを含めて。読み込み中の表示を出し、要約をタイムスタンプ付きで保存し、失敗したら「今は要約できませんでした」と表示して。キーをブラウザに絶対に送らないで。
3. 入力の手間が省ける場所で抽出を追加する:
ユーザーが「クイック追加」欄にメール署名を貼り付けたら、サーバーで[PROVIDER]を呼び出し、プロバイダーの構造化出力機能を使って、名前、会社名、役職、メール、電話番号を含むJSONを返して。サーバーでJSONを検証し、新規連絡先フォームに事前入力し、保存前にユーザーが編集できるようにして。推測せず、分からない項目は空欄にして。
「保存前にユーザーが編集できる」という点が重要です。モデルが提案し、判断するのは人です。
4. バックグラウンドで分類する:
新しいサポートチケットが届いたら、次の5つのうち1つだけに分類して:請求、不具合、機能要望、アカウントへのアクセス、その他。低コストの小型モデルを使って。応答がこれらのラベルのいずれでもなければ、「その他」を保存して。ラベルは編集可能なタグとして表示して。
5. 実際の雑多なデータでテストする。 長いメモ、空のメモ、他の言語、電話番号のない署名などで試し、公開前に出力を20件並べて確認してください。
効果のある指示の書き方
すべてのリクエストに付ける指示(システムプロンプトと呼ばれることが多い)が、品質を左右します。
- 誰のためで、何が良い結果かを書く。 「要約は、営業担当者が通話の前に10秒で読む」と書けば、モデルに目標ができます。
- 形式を固定する。 箇条書きの数、文字数の上限、項目、ラベルを正確に指定します。
- 分からないときの対応を書く。 「メモに次のステップがない場合は『次のステップは記録されていません』と書く」。これで、作り話の回答が減ります。
- 抽出と分類では、良い入力と出力の例を2〜3個示す。
- 指示とユーザーの内容を分け、ユーザーの内容には明確なラベルを付けて、モデルが両者を区別できるようにする。
プロンプトはコードベースのファイルに保存し、他のコードと同じようにバージョン管理し、レビューできるようにしてください。
コストを抑える
LLM APIは、送信した分と返ってきた分の両方を、トークン(小さなテキストの単位)で課金します。コストは、1回のリクエストの文脈量に、実行回数を掛けたもので増えていきます。実践的な管理方法は次のとおりです。
- 必要なものだけを送る。 全履歴ではなく直近の20件のメモだけを送ります。長い文書は切り詰めるか、分割してください。
- 目的を果たす最小のモデルを使う。 最大のモデルをデフォルトにする前に、まず試してください。
- 出力の長さを、APIの最大トークン設定で制限する。
- 結果をキャッシュする。 要約を保存し、元データが変わったときだけ再生成します。ページを表示するたびに生成し直さないでください。
- ユーザーごとに上限を設ける。 アカウントごと、またはプランごとの1日あたりの上限を設けて、1人のヘビーユーザーや1つのスクリプトが請求額を押し上げるのを防ぎます。
- エンドポイントにもレート制限をかける。 他の高コストなルートと同じように扱ってください。
- プロバイダーのダッシュボードで予算または通知を設定する。 公開後は週に1回、利用量を確認してください。
- 機能ごとのトークン使用量を記録する。 どの機能にどれだけコストがかかっているかが分かります。
AI機能がプロダクトの中心であれば、その運用コストを価格設定に織り込み、負担として吸収し続けないようにしてください。
安全性と信頼性
AIの出力は確率的です。自信ありげに間違えることがありますし、読み込んだテキストによって誘導されることもあります。それを前提に作ってください。
- 出力を信頼できない入力として扱う。 構造を検証し、HTMLとして描画する前にエスケープし、コードやデータベースのクエリとして実行しないでください。
- 影響のある操作には人間を介在させる。 メールの送信、レコードの変更、返金などです。モデルが下書きし、人が確定します。
- プロンプトインジェクションを防ぐ。 文書やメッセージに「指示を無視して」といった文言が含まれることがあります。モデルが見られる範囲を、現在のユーザーが見てよい範囲に限定し、重要な操作を行えるツールを、コードが権限を確認する前に渡さないでください。
- AIが生成したコンテンツにはラベルを付ける。 要約や提案が生成されたものであり、ユーザーが確認できることを分かるようにします。
- 失敗を適切に扱う。 プロバイダーには障害やレート制限があります。タイムアウトを設定し、分かりやすいメッセージを表示し、アプリの他の部分は動き続けるようにしてください。
- ユーザーの入力内容に注意する。 自由入力の欄では、モデレーションのステップを検討し、コンテンツが第三者のAIプロバイダーによって処理されることをプライバシーポリシーで明記してください。
より広範なチェック項目は、AIで作られたアプリのセキュリティチェックリストにあります。
よくあるミス
- 汎用チャットボットから始めてしまう。 「要約」や「分類」の1つのボタンの方が、多くの人の役に立つことがよくあります。
- キーをフロントエンドのコードや公開リポジトリに置く。
- データベース全体を文脈として送ってしまう。 遅く、高くつき、他のユーザーのデータを漏らす危険もあります。
- 自由形式の出力を信頼してしまう。 スキーマや固定ラベルを使えば、検証できるようになります。
- ユーザーごとの上限がない。 最初の請求書が届いてから気付きます。
MythexでのAI機能の追加
Mythexでは、自分のプロバイダーのキーを使い、アプリ内にAIを組み込むことをチャットで依頼します。キーはプロジェクトのシークレットとして保存してください。エージェントが必要とするとき、Mythexはチャット内にシークレットのカードを表示するので、キーをチャットに貼り付ける必要はありません。その後、エージェントがサーバールート、プロンプト、インターフェースを作ります。アプリのAI利用料金は、プロバイダーから請求されます。これは、アプリ作成に使うMythexのクレジットとは別です。開始用のプロンプトは、ドキュメントの独自のAPIキーでAI機能を追加するにあります。
よくある質問
既存のアプリにAIを追加するにはどうすればいいですか?
LLMプロバイダーのAPIキーを取得し、サーバー側のシークレットとして保存したうえで、プロンプトと関連データをプロバイダーに送り、結果をフロントエンドに返すサーバールートを追加します。いきなり汎用チャットを作るのではなく、まずはレコードの要約のような、範囲の狭い機能から始めてください。
AI機能の運用にはどのくらいコストがかかりますか?
LLM APIは、送受信するテキストのおおよそ単位であるトークン数で課金され、料金はモデルによって大きく異なります。コストは、1回のリクエストで送るテキストの量と、実行の頻度で決まります。自分の利用状況から見積もり、プロバイダーのダッシュボードで上限を設定し、アプリ側でユーザーごとの利用量にも上限をかけてください。
OpenAIやAnthropicのキーをフロントエンドに入れてもいいですか?
いいえ。フロントエンドのコードは、ページを開けば誰でも読めます。キーが漏れると、見知らぬ人に請求額を増やされてしまいます。プロバイダーへの呼び出しはサーバーから行い、キーは環境変数に保管してください。
プロンプトインジェクションとは何ですか?
モデルが読むテキスト(ユーザーのメッセージ、アップロードされた文書、Webページなど)に、あなたの指示を上書きしようとする命令が含まれることです。モデルの出力は信頼できないものとして扱い、確認なしに重要な操作を実行させず、モデルが見られるデータはそのユーザーが見てよい範囲に限定してください。