Cloudinary MCP Server発表！ DevIOブログのアイキャッチを自然言語で作ってみた
2025.07.02こんにちは、ベルリンオフィスの小西です。
画像管理・配信SaaSのCloudinaryから、新たにMCP(Model Context Protocol) Serverが発表されました。これにより、Claude DesktopなどのAIエージェントから自然言語でCloudinaryの機能を操作できるようになります。
本記事では、実際にClaude DesktopでCloudinary MCPを試してみた体験をお伝えします。
Cloudinary MCPとは？
CloudinaryのMCP Serverは、AI エージェントがCloudinaryの画像・動画API群を自然言語で操作できるようにするツールです。従来であればSDKやAPI, GUIを使ってプログラムで実装する必要があった処理を、「画像をアップロードして」「メタデータを追加して」といった会話レベルの指示で実行できます。
主要な機能とMCPサーバー
Cloudinary MCPでは、機能ごとに専用のMCPサーバーが提供されており、それぞれ特化した操作を自然言語で実行できます：
- Asset Management: 画像、動画、その他ファイルのアップロード、管理、検索
- MediaFlows: 自動化されたメディア処理ワークフローの管理
- Analyze: AI搭載の画像・動画解析機能
- Environment Config: クラウド環境の設定とプロダクト環境の管理
- Structured Metadata: メタデータフィールドの構造化された管理と検索性の向上
これらの専用サーバーにより、用途に応じて必要な機能のみを選択して利用することが可能です。すべての操作が自然言語で実行でき、Cloudinaryの無料プランでも利用可能です。
利用イメージ：自然言語で画像を取得
実際にClaude DesktopでCloudinary MCPを設定し、以下を試してみました：
Cloudinaryの私のアカウントから、最新の画像1件を取得してURLを教えてください。
↓
最新の画像を取得しました。詳細は以下の通りです：
画像URL：https://devio2024-media.developers.io/image/upload/v1751379667/user-gen-eyecatch/jztoze3jhrbh7afldqp1.png
画像情報：
- アップロード日時: 2025年7月1日 14:21:07（UTC）
- フォーマット: PNG
- サイズ: 1200×630ピクセル
- ファイルサイズ: 約547KB
- フォルダ: user-gen-eyecatch
上記の指示だけで、Claude Desktopが私のCloudinaryアカウントから最新の画像を取得してくれました。
Cloudinaryからのレスポンスをみてみると、画像のURLやメタ情報が含まれています。
{
"resources": [
{
"assetId": "be24255331f8a3207a2038a98657a918",
"publicId": "sample/jztoze3jhrbh7afldqp1",
"folder": "sample",
"format": "png",
"version": 1751379667,
"resourceType": "image",
"type": "upload",
"createdAt": "2025-07-01T14:21:07.000Z",
"bytes": 560515,
"width": 1200,
"height": 630,
"backup": true,
"accessMode": "public",
"url": "http://devio2024-media.developers.io/image/upload/v1751379667/sample.png",
"secureUrl": "https://devio2024-media.developers.io/image/upload/v1751379667/sample.png"
}
],
"nextCursor": "e1d2472f32be7dbfed22025271d01723af71a39013cdc84055b162f077e5c399"
}
セットアップ方法
Claude DesktopでCloudinary MCPを使用する基本的なセットアップ手順：
- 前提: Node.js（v18以降）とnpm
- Cloudinary Console（Settings > API Keys）からクラウド名、APIキー、APIシークレットを取得
- MCPサーバー設定ファイルに必要な情報を追加
Claude Desktop の場合 claude_desktop_config.json ファイルを編集し、以下の設定を追加します：
{
"mcpServers": {
"cloudinary-asset-mgmt": {
"command": "npx",
"args": ["-y", "--package", "@cloudinary/asset-management", "--", "mcp", "start"],
"env": {
"CLOUDINARY_CLOUD_NAME": "cloud_name",
"CLOUDINARY_API_KEY": "api_key",
"CLOUDINARY_API_SECRET": "api_secret"
}
},
"cloudinary-env-config": {
"command": "npx",
"args": ["-y", "--package", "@cloudinary/environment-config", "--", "mcp", "start"],
"env": {
"CLOUDINARY_CLOUD_NAME": "cloud_name",
"CLOUDINARY_API_KEY": "api_key",
"CLOUDINARY_API_SECRET": "api_secret"
}
},
"cloudinary-smd": {
"command": "npx",
"args": ["-y", "--package", "@cloudinary/structured-metadata", "--", "mcp", "start"],
"env": {
"CLOUDINARY_CLOUD_NAME": "cloud_name",
"CLOUDINARY_API_KEY": "api_key",
"CLOUDINARY_API_SECRET": "api_secret"
}
},
"cloudinary-analysis": {
"command": "npx",
"args": ["-y", "--package", "@cloudinary/analysis", "--", "mcp", "start"],
"env": {
"CLOUDINARY_CLOUD_NAME": "cloud_name",
"CLOUDINARY_API_KEY": "api_key",
"CLOUDINARY_API_SECRET": "api_secret"
}
}
}
}
設定後、Claude Desktopを再起動するとMCPサーバーが利用可能になります。
詳細な設定方法はCloudinaryの公式ドキュメントをご参照ください。
アイキャッチ画像を生成してみる
Cloudinary MCPを使えば、このブログのアイキャッチ画像の自動生成も可能です。
プロンプトと実行結果
プロンプト:
ブログ記事用のサムネイルをCloudinaryにアップロードしたいです。 ロゴの透過画像が下記に置いてあります。
/Users/ryo/Dev/logo_classmethod.png
Cloudinaryの変換機能を使って、下記のサムネイルを作成してください。
* サムネイルのサイズは1200x610pxです
* ロゴを中央に配置して、ロゴの上下左右に十分な余白をとってください
* 背景は白で埋めてください
* 変換にはc_lpadを使用してください
↓
https://devio2024-media.developers.io/image/upload/c_lpad,w_1200,h_610,b_white/v1751386256/2025/07/01/hwx2q1xntkdqbfuf0moc.png
サムネイルっぽい画像の作成が成功しました。
このような自然言語の指示だけで、MCPが適切な変換パラメータを生成し、実行してくれます。
画像変換のパラメータを理解する
Cloudinaryは 元画像の加工・変換にURLのパラメータを使用する ため、パスを読むとどのような変換が行われているか理解できます。
- 画像全体のサイズ指定:
w_1200,h_610で縦横のサイズを調整 - 背景色の指定:
b_whiteで背景を「白」に指定
特に c_lpad は Letter/Pillar Box Padding 変換を行うパラメータです：
- アスペクト比保持: 元画像の縦横比を維持しながら指定キャンバスに収まる最大サイズに調整
- 自動中央配置: 指定キャンバス内に画像を中央配置
- 背景パディング: 余白部分を指定色で埋める（デフォルトは黒、
b_whiteで白指定可能）
またCloudinaryの場合、これら変換された画像は動的に生成されているため ストレージを占めるのはオリジナルのロゴ画像だけ です。
例えば中央に配置されるロゴ画像をもう少し大きくしたい場合、下記のようにパラメータ変更だけで対応できます。画像を複製したり新しい画像をアップロードする必要はないのが嬉しいです。
中央に配置されるロゴ画像の横幅を1000pxに指定する:
https://devio2024-media.developers.io/image/upload/c_scale,w_1000/c_lpad,w_1200,h_610,b_white/v1751386256/2025/07/01/hwx2q1xntkdqbfuf0moc.png
その他の実用的なプロンプト例
Cloudinary MCPで実際に使用できるプロンプト例をいくつか紹介します。
アセット管理とタギング
ローカルの `summer_campaign` フォルダからアセットをアップロードして、すべての画像に自動でタグ付けして
検索と取得
`transparent` タグが付いているすべてのアセットのURLを返して
メタデータ管理
メタデータフィールド `SKU` の値が '123789'、'998y285'、'825168' いずれかのアセットに対して、'Status' メタデータフィールドに 'Expired' という値を追加して
削除操作
'campaign-2020'タグが付いているすべてのアセットを削除して
アップロード設定
署名付きアップロードプリセットを作成して。内容は、画像アップロードを許可し、アクセス制御を'restricted'に設定し、モバイルデバイス用にサイズ調整する eager transformation を生成するもの。
変換とウォーターマーク
プロダクトID 'my-company-logo' のアセットを50%の透明度でウォーターマークとして中央に配置する 'secure' という名前の変換を作成して
Cloudinaryでリッチな変換を行うには制御パラメータやその文法を理解しておく必要がありましたが、MCPのおかげで作業がだいぶ楽になります。
注意すべきポイント: 権限管理の課題
MCPサーバー群は基本的にCloudinaryアカウントのCRUD（作成・読み取り・更新・削除）権限を前提として設計されています。権限を制限したい場合は、専用のサブアカウントまたは権限を制限したユーザーを作成し、そのユーザー用のAPIキーを発行して使用することを推奨します。実際の運用では、本番環境とは分離した開発用アカウントでの利用を検討するなど、慎重な権限管理が必要です。
また、Cloudinaryの3つの情報 - クラウド名、APIキー、APIシークレットは常にセットで使用する必要があります。接続先クラウドを変更する場合はAPIキー&シークレットも合わせて変更するようにしましょう。
まとめ
Cloudinary MCPは、画像・動画処理をより身近で直感的なものにするツールです。開発効率化や非エンジニアの方々の画像処理アクセシビリティ向上に大きく貢献する技術だと感じました。
現在ベータ版として提供されており、今後さらなる機能拡張や改善が期待されます。さらに、この夏にCloudinaryがMCP Server Challengeを開催予定で、すべてのCloudinaryユーザーが参加でき、賞品を獲得できるチャンスがあります。ぜひ一度試してみてはいかがでしょうか。
