🀄️

AI エージェントから Vonage を使おう

はじめに

みなさん、こんにちは。KDDI ウェブコミュニケーションズで CPaaS のエバンジェリストをしている高橋です。
この記事では、Vonage の MCP Server を構築して、AIエージェント(Claude デスクトップ)からSMSを送ったり、電話をかけたりできるようにします。

完成したMCPサーバーを使ったデモ動画

🎯 この記事で学べること

  • Claude DesktopとVonage APIの連携方法
  • AIエージェントによる自動SMS送信
  • AIエージェントによる自動音声通話
  • CSV一括送信システムの構築
  • MCP(Model Context Protocol)の実践的活用

Vonage とは

Vonage_logo

Vonage は、米国ニュージャージー州に本社を置く、CPaaS(Communication Platform as a Service)企業です。
もともとは VoIP(Voice over IP)企業としてスタートしましたが、いくつかの企業買収を行うことで、コミュニケーションサービス全般をサポートすることができる企業に発展しました。現在はスウェーデンの大手通信機器会社エリクソンの傘下に入っています。

2024年2月14日より、株式会社KDDIウェブコミュニケーションズ(以後、KWC)が Vonage の再販事業を開始することとなりました。
KWC経由でアカウントを開設する場合、Vonageで直接開設したアカウントとは一部仕様が異なります。(※提供する機能面において違いはありません)

AIエージェント とは

AIエージェントは、人間の代わりに自律的にタスクを実行できるAIシステムです。単に質問に答えるだけでなく、外部システムと連携して実際のアクションを実行し、目標達成まで継続的に動作します。

AIアシスタントとAIエージェントの違い

AIアシスタント(従来型)

  • 質問への回答や文章生成が主な機能
  • ユーザーとの対話に特化
  • 外部システムへの直接的なアクセスは限定的
  • 例:ChatGPT(基本版)、Claude(Webインターフェース)

AIエージェント(次世代型)

  • 外部ツールやAPIと連携して実際のタスクを実行
  • 目標に向けて自律的に行動を計画・実行
  • 複数のステップを経て複雑なタスクを完遂
  • 例:Claude Desktop + MCP、AutoGPT、LangChain Agents、Codex CLI、Gemini CLI

本記事でのAIエージェント

本記事では、Claude Desktop(AIアシスタント)にMCP Serverを接続することで、以下のような「AIエージェント」として機能させます:

  • 自動SMS送信エージェント: 指定された条件でSMSを自動送信
  • 音声通話エージェント: 緊急連絡や通知を音声で自動発信
  • 一括処理エージェント: CSVファイルを読み込んで大量の通信処理を実行

これにより、単なる対話型AIから、実際の業務を自動化できる実用的なAIエージェントへと進化させることができます。

MCP Server とは

MCP(Model Context Protocol)は、AIアシスタント(Claude、ChatGPTなど)と外部ツールやAPIを連携させるための標準プロトコルです。MCPを使用することで、AIアシスタントは外部システムと直接やり取りし、実際のアクションを実行できるようになります。

MCPサーバーの仕組み

MCPサーバーは、AIアシスタントと外部サービスの間に立つ中間サーバーとして機能します:

  1. ツールの定義: MCPサーバーは、AIが使用できる「ツール」(機能)を定義します
  2. リクエスト処理: AIからのリクエストを受け取り、適切な外部APIを呼び出します
  3. レスポンス返却: APIの結果をAIが理解できる形式で返します

今回作成するVonage MCPサーバーでは、以下のツールを提供します:

  • SMS送信機能
  • 音声通話機能
  • CSV一括送信機能

これにより、Claude DesktopからVonageのAPIを直接操作できるようになります。


Vonage MCP Serverハンズオン手順書

🎯 この記事で学べること

  • Claude DesktopとVonage APIの連携方法
  • AIエージェントによる自動SMS送信
  • AIエージェントによる自動音声通話
  • CSV一括送信システムの構築
  • MCP(Model Context Protocol)の実践的活用

⏰ 所要時間

約90分(セットアップ30分 + 実践60分)

📋 事前準備の確認

以下がすべて準備できていることを確認してください:

  • ノートPC(Windows/Mac/Linux)
  • Node.js 20.6以降 インストール済み
  • Claude Desktop アプリ(無料)
  • 携帯電話(SMS・通話受信テスト用)
  • 安定したインターネット環境
  • Postman(最新バージョン) オプション

Node.jsバージョンの確認

ターミナル(コマンドプロンプト)で以下を実行:

node -v
npm -v

Node.js 20.6以降、npm 10以降が表示されることを確認してください。

🚀 Step 1: Vonageアカウントの作成

1.1 アカウント作成

  1. Vonage 契約申し込み(アカウント作成) にアクセス
  2. 必要事項を入力してアカウントを作成(KWCの申し込みとVonageアカウントの作成の2ステップが必要です)

1.2 電話番号の購入(番号を持っていない場合)

注意: すでにVonage番号をお持ちの方は、このステップをスキップして1.3に進んでください。

  1. ダッシュボードにログイン
  2. 左メニューから「電話番号」→「番号を購入」を選択
  3. 番号の購入:
    • : United States を選択(日本の050番号は手続きが必要なため、今回はUS番号を使用)
    • 機能: SMSVoice にチェック
    • タイプ: Any を選択
  4. 「検索」ボタンをクリックして利用可能な番号を表示
  5. 好きな番号の「購入」ボタンをクリック
  6. 購入確認画面で「購入」をクリックして購入完了(チェックボックスをONにする必要あり)
  7. 購入した番号をメモ(例:(+1)5554443333

1.3 アプリケーションの作成

  1. 左メニューから「アプリケーション」を選択

  2. 「新しいアプリケーションを作成する」をクリック
    New Application

  3. アプリケーション情報を入力:

    • 名前: vonage-mcp-handson(または任意の名前)
    • 機能: 音声 を有効にする
    • 地域: Singapore を選択する
    • 「公開鍵と秘密鍵を生成」をクリックして、公開鍵(private.key)をダウンロードする
  4. 「新しいアプリケーションの生成」をクリック
    Create Application

  5. Application ID をメモ(後で使用)

  6. 購入した番号(または既存の番号)の右側にある「リンク」アイコンをクリック

  7. リンクした番号をメモ(これがVoice通話用のFROM番号になります)
    Application Settings

🛠️ Step 2: プロジェクトのセットアップ

ここからは、ローカルコンピューター内での作業となります。
ターミナルウィンドウで適当な作業フォルダを作成してください。

2.1 プロジェクトの取得

方法A: Gitコマンドを使用する場合

ターミナルで以下を実行:

git clone https://github.com/mobilebiz/vonage-mcp-server.git
cd vonage-mcp-server

方法B: Gitがない場合(ZIPダウンロード)

  1. GitHubページにアクセス

  2. ZIPファイルをダウンロード

    • 緑色の「Code」ボタンをクリック
    • 「Download ZIP」を選択
    • ファイルをダウンロード
  3. ファイルを解凍

    • ダウンロードしたZIPファイルを解凍
    • 解凍したフォルダ名を vonage-mcp-server に変更(必要に応じて)
  4. フォルダに移動

    ターミナルでプロジェクトフォルダに移動:

    cd vonage-mcp-server
    

    注意: フォルダの場所がわからない場合は、エクスプローラー(Windows)やFinder(Mac)でフォルダを右クリックして「ターミナルで開く」や「パスをコピー」を使用してください。

2.2 依存関係のインストール

npm install

2.3 プロジェクト構造の確認

vonage-mcp-server/
├── src/                    # TypeScriptソースコード
├── csv/                    # サンプルCSVファイル
├── package.json            # プロジェクト設定
├── .env.example            # 環境変数設定例
└── README.md               # 詳細ドキュメント

⚙️ Step 3: 環境設定

3.1 環境変数ファイルの作成

cp .env.example .env

3.2 private.keyファイルの配置

Step 1.2でダウンロードしたprivate.keyファイルをプロジェクトルートに配置:

# ダウンロードフォルダから移動(例)
mv ~/Downloads/private.key ./private.key

3.3 .envファイルの編集

.envファイルを開いて以下を設定:

# Vonage設定
VONAGE_APPLICATION_ID=あなたのApplication ID
VONAGE_PRIVATE_KEY_PATH=./private.key
VONAGE_VOICE_FROM=あなたのVoice FROM番号(例:15554443333)

重要: 実際の値に置き換えてください!

3.4 ビルドとテスト

# TypeScriptコンパイル
npm run build

# テスト実行
npm test

エラーが発生しないことを確認してください。

🧪 Step 4: 開発モードでのテスト

4.1 開発モードで動作確認

以下のコマンドをターミナルで実行してみます。

echo '{"jsonrpc": "2.0", "id": 1, "method": "initialize", "params": {"protocolVersion": "2024-11-05", "capabilities": {}, "clientInfo": {"name": "test-client", "version": "1.0.0"}}}' | npm run dev:start

以下のように表示されればサーバーは正常に動作しています。

> vonage-mcp-server@1.1.0 dev:start
> npm run build && node --env-file=.env dist/index.js


> vonage-mcp-server@1.1.0 build
> tsc

{"result":{"protocolVersion":"2024-11-05","capabilities":{"tools":{"listChanged":true}},"serverInfo":{"name":"vonage-mcp-server","version":"1.1.0"}},"jsonrpc":"2.0","id":1}

4.2 PostmanでMCPサーバーテスト(オプション)

Postmanを使うと、MCPプロトコルを視覚的で分かりやすくテストできます。

4.2.1 Postmanの準備

  1. Postmanをダウンロード・インストール

    • Postman公式サイト からダウンロード
    • 最新バージョンをインストール(MCP機能には最新版が必要)
  2. 新しいワークスペース作成(推奨)

    • Postmanを起動
    • 左上の「Workspaces」→「Create Workspace」
    • ワークスペース名を「MCP Testing」に設定(ワークスペースの種類は「インターナル」を選択)
      Create workspace in Postman

4.2.2 MCP接続設定

  1. 新しいリクエスト作成

    • 「新規」ボタンをクリックします。
    • リクエストタイプで「MCP」を選択(最新版Postmanで利用可能)
      Select MCP
  2. コマンドパスの調査

事前にnodeのパスを調べます。

# Macユーザー
which node
# Windowsユーザー
where node
  1. MCP Server接続設定
    • プロトコル: STDIO
    • コマンド: /Nodeの絶対パス/node /プログラムの絶対パス/vonage-mcp-server/dist/index.js
    • 「Environment」タブを開きます。
    • 先ほど、.envに設定した各項目を転記します(private.keyについては、ファイルの絶対パスを登録してください)。
    • 「接続」ボタンをクリック
      Postman settings

4.2.3 MCPサーバーテスト実行

  1. 接続テスト

    • 接続成功すると「Connected」ステータスが表示されます。
  2. 利用可能ツール確認

    • 「Message」タブの中の「Tools」に以下のツールが表示されることを確認します。
      • send_sms - SMS送信ツール
      • bulk_sms_from_csv - CSV一括SMS送信
      • make_voice_call - 音声通話
  3. ツールのテスト実行

    • 任意のツールを選択します。
    • パラメータを入力(テスト用の値)します。
    • 「実行」ボタンをクリックします。
      Run
    • 結果はJSONで戻ってきますので、エラーになった場合はメッセージを確認してください。

🔗 Step 5: Claude Desktopとの連携

5.1 設定ファイルの場所

お使いのOSに応じて設定ファイルを開いてください。

  • macOS: ~/Library/Application Support/Claude/claude_desktop_config.json
  • Windows: %APPDATA%\Claude\claude_desktop_config.json
  • Linux: ~/.config/Claude/claude_desktop_config.json

5.2 MCP設定の追加

claude_desktop_config.jsonに以下を追加(既存の設定がある場合はmcpServersセクションに追記)してください。

{
  "mcpServers": {
    "vonage-mcp-server": {
      "command": "事前に調べたnodeのフルパス/node",
      "args": [
        "/フルパス/to/vonage-mcp-server/dist/index.js"
      ],
      "env": {
        "VONAGE_APPLICATION_ID": "あなたのApplication ID",
        "VONAGE_PRIVATE_KEY_PATH": "/絶対パス/vonage-mcp-server/private.key",
        "VONAGE_VOICE_FROM": "Vonageで取得した電話番号(例:15554443333)",
        "DEBUG": "false"
      }
    }
  }
}

5.3 フルパスの確認方法

プロジェクトディレクトリで以下を実行します。

# macOS/Linux
pwd

# Windows
cd

5.4 Claude Desktopの再起動

設定変更後、Claude Desktopを完全に終了して再起動してください。

🧪 Step 6: 動作確認テスト

6.1 接続確認

Claude Desktopを開いて、新しいチャットで以下を入力します。

Vonage MCPサーバーのツールの一覧を教えてください。

以下のツールの説明が表示されることを確認します。

  • send_sms: SMS送信ツール
  • bulk_sms_from_csv: CSV一括SMS送信
  • make_voice_call: 音声通話

6.2 SMS送信テスト

090XXXXYYYYに「Vonage MCP Serverのテストです。ハンズオン成功!」とSMSを送ってください。
  • 数秒後に指定した番号にSMSが届くことを確認します。
  • Claude Desktopに送信成功メッセージとメッセージIDが表示されることを確認します。

6.3 音声通話テスト

090XXXXYYYYに女性の声で「こんにちは。ボネージ MCP Serverからの自動通話テストです。」と電話をかけてください。
  • 指定した番号に自動で電話がかかることを確認します。
  • 日本語女性音声でメッセージが読み上げられることを確認します。
090XXXXYYYYに男性の声で「緊急連絡のテストです。男性音声での読み上げ確認です。」と電話をかけてください。
  • 男性音声で読み上げられることを確認します。

6.4 CSV一括送信テスト

csvフォルダの中にあるsample_contacts.csvをエディタで開き、電話番号フィールドをご自分の電話番号に変更して保存します。
保存したCSVファイルをClaudeデスクトップに添付し、以下を入力します。

添付したCSVデータで一括SMS送信をしてください。
  • 複数の番号に同時にSMSが送信されることを確認します。
  • 送信結果レポートが表示されることを確認します。

7. デバッグモード(トラブルシューティング用)

AIエージェント(Claude Desktop)は、ユーザーの要求を自身で判断し、必要に応じて MCPサーバーを利用します。そのため、AIエージェントがどのようなパラメータをMCPサーバーに送信したのかを確認したいケースが発生します。
そのような場合は、デバッグモードを有効にできます。

  1. claude_desktop_config.json のDEBUG設定をtrueに変更

         "DEBUG": "true"
    
  2. Claude Desktopでツールを使用

    • Claude Desktopを完全に終了して再起動してください。
    • ターミナルに以下のようなデバッグログが表示されます。
    [DEBUG 2024-01-01T12:00:00.000Z] SMS送信ツールが呼び出されました
    {
      "to": "090-1234-5678",
      "message": "テストメッセージです",
      "from": "TestSender"
    }
    

デバッグログで確認できる情報

  • 呼び出されたツール名
  • Claude Desktopから送信されたパラメータ
  • パラメータの正確な値と型

ログファイルの確認手順

macOSでの具体的な確認手順:

# 1. ログファイルの存在を確認
ls -la ~/Library/Logs/Claude/mcp-server-vonage-mcp-server.log

# 2. ログファイルをリアルタイムで監視
tail -f ~/Library/Logs/Claude/mcp-server-vonage-mcp-server.log

# 3. ログファイルの内容を確認(最新100行)
tail -100 ~/Library/Logs/Claude/mcp-server-vonage-mcp-server.log

# 4. 特定の時間のログを確認
grep "2025-09-01T07:" ~/Library/Logs/Claude/mcp-server-vonage-mcp-server.log

Windowsでの確認手順:

# 1. まずログファイルの場所を特定
dir %APPDATA%\Claude\logs\mcp-server-vonage-mcp-server.log

# 2. ログファイルが見つかった場合、内容を確認
type  %APPDATA%\Claude\logs\mcp-server-vonage-mcp-server.log

# 3. リアルタイム監視
powershell -Command "Get-Content -Wait -Tail 10 $Env:APPDATA\Claude\logs\mcp-server-vonage-mcp-server.log"

注意:

  • デバッグモードは開発・トラブルシューティング用です
  • 実際の電話番号やメッセージがログに表示されるため、本番環境では無効にしてください
  • 使用後は DEBUG=false に戻すことを推奨します
  • Claude Desktopのバージョンによってログの場所が異なる場合があります

🚨 トラブルシューティング

よくある問題と解決方法

1. 「ツールが見つからない」エラー

症状: Claude Desktopでツールが表示されない

解決方法:

  1. claude_desktop_config.jsonの設定を再確認
  2. パスが正しいかチェック(絶対パスを使用)
  3. Claude Desktopを完全再起動
  4. npm run buildが成功していることを確認

2. 「環境変数が設定されていません」エラー

症状: VONAGE_APPLICATION_ID環境変数が設定されていません

解決方法:

  1. .envファイルが正しく作成されているか確認
  2. claude_desktop_config.jsonenvセクションを確認
  3. 値が正しく設定されているか確認(引用符は不要)

3. SMS送信が失敗する

症状: SMS送信失敗のエラーメッセージ

解決方法:

  1. 電話番号が正しい形式か確認(0から始まる日本の番号)
  2. Vonageアカウントの残高を確認
  3. Messages APIが有効になっているか確認

4. 音声通話が発信されない

症状: Voice通話エラーが発生

解決方法:

  1. VONAGE_VOICE_FROMが正しく設定されているか確認
  2. Voice APIが有効になっているか確認
  3. FROM番号がVonageアカウントに登録されているか確認

5. 「private.keyファイルが見つからない」エラー

症状: ENOENT: no such file or directory, open './private.key'

解決方法:

  1. private.keyファイルがプロジェクトルートに配置されているか確認
  2. ファイルの読み取り権限を確認
  3. パスが正しいか確認

📚 参考資料


💡 コード解説:MCP Serverの仕組みを理解しよう

ハンズオンが完了したら、今度は実際のコードがどのように動いているかを理解してみましょう!

📁 src/index.ts の構造

Vonage MCP Serverのメインファイル src/index.ts は以下の構造になっています:

// 1. 必要なライブラリをインポート
import { McpServer } from "@modelcontextprotocol/sdk/server/mcp.js";
import { StdioServerTransport } from "@modelcontextprotocol/sdk/server/stdio.js";
// ...その他のインポート

// 2. MCPサーバーを作成
const server = new McpServer({
  name: "vonage-mcp-server",
  version: "1.1.0"
});

// 3. ツール(機能)を登録
server.registerTool("send_sms", { /* 設定 */ }, async ({ to, message, from }) => {
  // SMS送信の処理
});

// 4. サーバーを起動
const transport = new StdioServerTransport();
await server.connect(transport);

🔧 MCP Serverの基本概念

1. MCPサーバーとは?

const server = new McpServer({
  name: "vonage-mcp-server",    // サーバー名
  version: "1.1.0"              // バージョン
});
  • MCP(Model Context Protocol): AIエージェント(Claude)とツールを繋ぐ仕組み
  • MCPサーバー: AIが使える機能(ツール)を提供するプログラム
  • 今回のサーバー: VonageのSMS・通話機能をClaude Desktopで使えるようにする

2. ツール登録の仕組み

各ツールは以下の3つの部分で構成されています:

server.registerTool(
  "ツール名",           // 1. ツールの識別名
  { /* ツール設定 */ },  // 2. ツールの説明・パラメータ定義
  async (params) => {   // 3. 実際の処理内容
    // ここに処理を書く
  }
);

🛠️ 各ツールの詳細解説

1. SMS送信ツール(send_sms)

server.registerTool("send_sms",
  {
    title: "SMS送信ツール",
    description: "Vonageを使用してSMSを送信します...",
    inputSchema: { 
      to: z.string().describe("送信先の電話番号(必須)"),
      message: z.string().describe("送信するメッセージ(必須)"),
      from: z.string().optional().describe("送信元(省略時は'VonageMCP')")
    }
  },
  async ({ to, message, from }) => {
    // 📍 ポイント1: パラメータの検証
    if (!validatePhoneNumber(to)) {
      return { content: [{ type: "text", text: `エラー: 無効な電話番号...` }] };
    }

    // 📍 ポイント2: 実際のSMS送信
    const result = await sendSMS({ to, message, from });
    
    // 📍 ポイント3: 結果をClaude Desktopに返す
    if (result.success) {
      return {
        content: [{ 
          type: "text", 
          text: `SMS送信成功!\n送信先: ${to}\nメッセージID: ${result.messageId}` 
        }]
      };
    } else {
      return {
        content: [{ 
          type: "text", 
          text: `SMS送信失敗: ${result.error}` 
        }]
      };
    }
  }
);

重要なポイント:

  1. inputSchema: Claude Desktopがどんなパラメータを送るかを定義
  2. 非同期処理: async/awaitでVonage APIの応答を待つ
  3. エラーハンドリング: 失敗時もわかりやすいメッセージを返す
  4. レスポンス形式: MCPの決められた形式で結果を返す

2. デバッグログ機能

function debugLog(message: string, data?: any) {
  if (isDebugMode) {
    const timestamp = new Date().toISOString();
    const logMessage = `[DEBUG ${timestamp}] ${message}`;
    
    // コンソール出力(stderr)
    console.error(logMessage);
    
    // ファイル出力(指定されている場合)
    if (logFile) {
      appendFileSync(logFile, fullLog);
    }
  }
}

なぜstderrを使うの?

  • stdout: MCPの通信に使用(JSONメッセージ)
  • stderr: デバッグ用の出力(通信を邪魔しない)

🔄 MCP通信の流れ

Claude Desktop  ←→  MCP Server  ←→  Vonage API
      │                │              │
   1. ツール実行    2. パラメータ   3. SMS/通話
      リクエスト      を処理        実行
      │                │              │
   4. 結果表示      ← 結果を返す    ← 結果取得

通信例:SMS送信の場合

  1. Claude DesktopMCP Server

    {
      "method": "tools/call",
      "params": {
        "name": "send_sms",
        "arguments": {
          "to": "09012345678",
          "message": "テストメッセージ"
        }
      }
    }
    
  2. MCP ServerVonage API

    await sendSMS({ to: "8190123456789", message: "テストメッセージ" });
    
  3. MCP ServerClaude Desktop

    {
      "result": {
        "content": [{
          "type": "text",
          "text": "SMS送信成功!\n送信先: 09012345678\n..."
        }]
      }
    }
    

🧩 環境変数の活用

// 環境変数から設定を取得
const applicationId = process.env.VONAGE_APPLICATION_ID;
const privateKeyPath = process.env.VONAGE_PRIVATE_KEY_PATH || './private.key';

なぜ環境変数を使うの?

  • セキュリティ: 秘密情報をコードに直接書かない
  • 柔軟性: 環境ごとに設定を変更できる
  • 管理性: 設定ファイル(.env)で一元管理

🎯 エラーハンドリングのベストプラクティス

try {
  const response = await voiceClient.createOutboundCall(callRequest);
  return { success: true, callId: response.uuid };
} catch (error: any) {
  // 詳細なエラー情報を提供
  let errorMessage = 'Voice通話エラー: ';
  
  if (error.response?.data) {
    const errorData = error.response.data;
    if (errorData.title) errorMessage += errorData.title;
    if (errorData.detail) errorMessage += ` - ${errorData.detail}`;
  }
  
  return { success: false, error: errorMessage };
}

良いエラーハンドリング:

  • 具体的なエラーメッセージ
  • ユーザーが理解しやすい内容
  • デバッグに役立つ情報を含む

🏗️ 拡張のヒント

新しいツールを追加する場合

server.registerTool("new_tool_name",
  {
    title: "新ツールの名前",
    description: "新ツールの説明",
    inputSchema: {
      parameter1: z.string().describe("パラメータ1の説明"),
      parameter2: z.number().optional().describe("パラメータ2の説明")
    }
  },
  async ({ parameter1, parameter2 }) => {
    // 1. パラメータ検証
    if (!isValid(parameter1)) {
      return { content: [{ type: "text", text: "エラーメッセージ" }] };
    }
    
    // 2. 実際の処理
    const result = await doSomething(parameter1, parameter2);
    
    // 3. 結果を返す
    return {
      content: [{ 
        type: "text", 
        text: `処理結果: ${result}` 
      }]
    };
  }
);

📚 さらに学ぶには

これで、あなたもMCP Serverの仕組みを理解できました!🎉

Happy coding! 🎯

KWCPLUS

Discussion