AIツール
モデルコンテキストプロトコル (MCP)
20 分
モデルコンテキストプロトコル(mcp)は、back4appのようなプラットフォームに大規模言語モデル(llm)を接続するための標準です。このガイドでは、mcpを使用してback4appを次のaiツールに接続する方法を説明します カーソル ウィンドサーフィン(codium) visual studio code(copilot) cline(vs code拡張) claudeデスクトップ claudeコード 接続が完了すると、aiアシスタントはあなたの代わりにback4appプロジェクトと対話し、クエリを実行できます。 mcpを使用するaiエージェントは、リソースの作成、変更、削除を含む、あなたのback4appアプリへの完全なアクセス権を持つように構成されています。生産環境で使用する前に、その機能と潜在的な影響を理解するために、まずテストアカウントとアプリで試すことを強くお勧めします。 前提条件 back4app comで作成されたアカウント。(新しいアカウントにはデフォルトでアプリの制限があります。もっと必要な場合はお問い合わせください); 最近のnodejsバージョンがインストールされていること(16^); より良い結果を得るために、最も高度なllmモデルとコーディングエージェントを使用することをお勧めします; ウェブホスティングを有効化する サブドメイン上のデプロイを視覚化するために; 1 アカウントキーを作成する まず、back4appダッシュボードに移動し、個人用アクセストークンを作成します back4appアカウントにログインします 「こんにちは、\[ユーザー名]」メニューにカーソルを合わせます 「 アカウントキー 」に移動し、新しいキーを作成します その目的を説明する名前を付けます。例えば「aiアシスタントmcp」など トークンを安全にコピーしてください 再度見ることはできません アカウントキーのトークンに名前を付けて、+をクリックします。 このトークンは、mcpサーバーをあなたのback4appアカウントで認証するために使用されます。 2 mcpをインストールする 自動 好みのide/llmにback4app mcpをインストールするための手順は次のとおりです。 2 1 インストールコマンドを実行する ターミナルでこのコマンドを実行し、 \<ide> を好みの環境に置き換え、your account keyを ステップ1 でコピーしたアカウントキーに置き換えます。 npx @back4app/mcp installer install \<ide> account key your account key 各ideの具体的なコマンドは以下に示されています カーソル npx @back4app/mcp installer install cursor account key your account key ウィンドサーフィン npx @back4app/mcp installer install windsurf account key your account key visual studio npx @back4app/mcp installer install vscode account key your account key クライン npx @back4app/mcp installer install cline account key your account key 2 2 接続を確認する カーソル 設定 > カーソル設定 > mcpに移動します ウィンドサーフィン カスケード入力の上にあるツールバーを見つけて、更新をクリックします visual studio エージェントモード(コパイロット)でツールを設定し、back4app mcpツールを見つけます。 3 aiツールでの設定 手動 mcp互換ツールは、back4appのmcpサーバーを使用してback4appに接続できます。以下は、一般的なaiツールを使用してこのサーバーに接続するための手順です カーソル カーソルを開き、カーソルメニューに移動します。 カーソル >設定 >カーソル設定 >mcpに移動します。 +新しいグローバルmcpを追加をクリックします。 次に、以下の設定を追加します macos / linux { "mcpservers" { "back4app" { "command" "npx", "args" \[ " y", "@back4app/mcp server back4app\@latest", " account key", "\<account key>" ] } } } windows { "mcpservers" { "back4app" { "command" "npx cmd", "args" \[ " y", "@back4app/mcp server back4app\@latest", " account key", "\<account key>" ] } } } \<account key>を、back4appからコピーしたアカウントキーに置き換えます。 設定ファイルを保存します。 代替設定 プロジェクト設定を好む場合は、ローカルプロジェクト設定ファイルを作成できます。 プロジェクトのルートに cursor ディレクトリを作成します。存在しない場合 存在しない場合は cursor/mcp json ファイルを作成し、開きます 前述の設定を追加します ウィンドサーフィン ウィンドサーフィンを開き、カスケードアシスタントに移動します ハンマー(mcp)アイコンをタップし、設定を選択して設定ファイルを開きます 次の設定を追加します macos / linux { "mcpservers" { "back4app" { "command" "npx", "args" \[ " y", "@back4app/mcp server back4app\@latest", " account key", "\<account key>" ] } } } windows { "mcpservers" { "back4app" { "command" "npx cmd", "args" \[ " y", "@back4app/mcp server back4app\@latest", " account key", "\<account key>" ] } } } \<account key> をバック4アプリからコピーしたアカウントキーに置き換えます。 設定ファイルを保存し、カスケードアシスタントで更新をタップして再読み込みします サーバーが正常に接続された後、緑のアクティブステータスが表示されるはずです visual studio(copilot) vs codeを開き、プロジェクトのルートに vscode ディレクトリが存在しない場合は作成します 存在しない場合は vscode/mcp json ファイルを作成し、開きます 次の設定を追加します macos / linux { "inputs" \[ { "type" "promptstring", "id" "back4app account key", "description" "back4app個人アクセストークン", "password" true } ], "servers" { "back4app" { "command" "npx", "args" \[" y", "@back4app/mcp server back4app\@latest"], "env" { "back4app account key" "${input\ back4app account key}" } } } } windows { "inputs" \[ { "type" "promptstring", "id" "back4app account key", "description" "back4app個人アクセストークン", "password" true } ], "servers" { "back4app" { "command" "npx cmd", "args" \[" y", "@back4app/mcp server back4app\@latest"], "env" { "back4app account key" "${input\ back4app account key}" } } } } 設定ファイルを保存します copilotチャットを開き、「エージェント」モードに切り替えます。mcpツールが利用可能であることを確認するためにタップできるツールアイコンが表示されるはずです サーバーの使用を開始すると、個人アクセストークンの入力を求められます。以前に作成したトークンを入力してください vs codeでmcpを使用する方法の詳細については、copilotのドキュメントを参照してください。 クライン vs codeでcline拡張機能を開き、mcpサーバーアイコンをタップします mcpサーバーの設定をタップして設定ファイルを開きます 次の設定を追加します macos / linux { "mcpservers" { "back4app" { "command" "npx", "args" \[ " y", "@back4app/mcp server back4app\@latest", " account key", "\<account key>" ] } } } windows { "mcpservers" { "back4app" { "command" "npx cmd", "args" \[ " y", "@back4app/mcp server back4app\@latest", " account key", "\<account key>" ] } } } \<account key>をバック4アプリからコピーしたアカウントキーに置き換えます。 設定ファイルを保存します。clineは自動的に設定を再読み込みするはずです サーバーが正常に接続された後、緑のアクティブステータスが表示されるはずです claudeデスクトップ claudeデスクトップを開き、設定に移動します 開発者タブの下で、設定を編集をタップして構成ファイルを開きます 次の構成を追加します macos / linux { "mcpservers" { "back4app" { "command" "npx", "args" \[ " y", "@back4app/mcp server back4app\@latest", " account key", "\<account key>" ] } } } windows { "mcpservers" { "back4app" { "command" "npx cmd", "args" \[ " y", "@back4app/mcp server back4app\@latest", " account key", "\<account key>" ] } } } 「 \<account key> 」をback4appからコピーしたアカウントキーに置き換えます。 構成ファイルを保存し、claudeデスクトップを再起動します 新しいチャット画面から、新しいmcpサーバーが利用可能であることを示すハンマー(mcp)アイコンが表示されるはずです 古いnode jsのインストールは、claude desktopでnpxコマンドが失敗する原因となる可能性があります。16より古いバージョンをアンインストールし、node js v16以上を使用することをお勧めします。 クロードコード プロジェクトのルートに mcp json ファイルを作成します。存在しない場合 次の設定を追加します macos / linux { "mcpservers" { "back4app" { "command" "npx", "args" \[ " y", "@back4app/mcp server back4app\@latest", " account key", "\<account key>" ] } } } windows { "mcpservers" { "back4app" { "command" "npx cmd", "args" \[ " y", "@back4app/mcp server back4app\@latest", " account key", "\<account key>" ] } } } \<account key>を \<account key> に置き換えます。back4appからコピーしたアカウントキーです。 設定ファイルを保存します 新しい設定を適用するためにクロードコードを再起動します 古いnode jsのインストールは、クロードコードでnpxコマンドが失敗する原因となる可能性があります。16より古いバージョンをアンインストールし、node js v16以上を使用することをお勧めします。 3 利用可能なツール 接続されると、あなたのaiアシスタントはback4appアカウントで幅広いタスクを実行できます。利用可能なツールのいくつかは次のとおりです アプリ管理 create parse app 新しいparseアプリを作成する get parse apps すべてのparseアプリのリストを取得する get parse app 特定のparseアプリの詳細を取得する set current app 後続の操作のためにデフォルトアプリを設定する get current app 現在設定されているデフォルトアプリを取得する 直接apiアクセス(parse rest api) call parse api parse server rest apiエンドポイントを呼び出してアプリを完全に管理します。 データベース操作 – 任意のクラスでオブジェクトを作成、読み取り、更新、削除する – リッチクエリ(フィルタ、ソート、ページネーション、カウント、集約、重複排除) ユーザー管理とセキュリティ – サインアップ / ログイン / ログアウト / パスワードリセット – ロール、acl、およびclpを使用してオブジェクトおよびクラスレベルでデータをロックダウン リアルタイムとプッシュ – websocketを介したlivequery(作成/更新/削除にサブスクライブ) – プッシュ通知とインストール記録 クラウドコード関数の呼び出し – クラウド関数とスケジュールされたジョブ – 前後トリガー、カスタムwebhook ファイル、分析、および拡張機能 – ファイルのアップロード/ダウンロード parseアプリのクラウドコードとウェブホスティング list cloud code and web hosting files すべてのクラウドコードとウェブホスティングファイルのリスト get file content 特定のファイルの内容を表示 deploy cloud code files クラウドコードファイルをアプリにデプロイ deploy web hosting files ウェブホスティングファイルをアプリにデプロイ 4 セキュリティの考慮事項 mcpサーバーは、個人用アクセストークンの権限を持ってあなたのback4appアカウントに完全にアクセスできます。これは、aiツールがあなたのアプリやデータを作成、変更、上書きできることを意味します。常に以下の予防策を講じてください 専用のテストアカウントを使用する 初期実験のために mcp用に特別なアクセストークンを作成する アクセストークンを含む構成ファイルを決して共有しない aiによって生成または変更されたすべてのコードとapi呼び出しを確認する 本番環境にデプロイする前に 不正使用の疑いがある場合は、アクセストークンを直ちに取り消す 5 トラブルシューティング 一般的な問題 接続の失敗 あなたの個人アクセストークンが有効で正しく入力されていることを確認してください サーバーが応答しない node jsがインストールされていて、npxが正しく動作していることを確認してください 権限エラー あなたのアクセストークンが必要な権限を持っていることを確認してください 更新が表示されない 一部のmcpクライアントは、設定変更後に再起動が必要です 6 次のステップ あなたのaiツールは、mcpを使用してback4appに接続されました。aiアシスタントに新しいアプリを作成したり、クラウドコードをデプロイしたり、自然言語を使用してデータを管理するように頼んでみてください。 問題が発生したり、フィードバックがある場合は、次のアドレスにメッセージを送信してください community\@back4app com 結論 back4appのmcp統合を使用すると、aiエージェントの力を活用して開発ワークフローを加速できます。アプリの作成や設定からコードのデプロイ、データの管理まで、あなたのaiアシスタントは今やあなたの代わりにback4appプラットフォームとシームレスに対話できます。