Canva MCPに繋がるまで、4つの壁を越えた話
目次（8件）
「設定した。認証した。なのに繋がらない。」
MCPサーバーを初めて設定した日、僕はこの状態に3時間以上いた。
エラーは出ない。 ただ、何も起きない。
これほど不気味な詰まり方はない。
この記事で学べること
- Canva MCPの接続が安定しない本当の原因
mcp-remote（CanvaのMCPサーバーに接続するためのNode.jsパッケージ）を外部ターミナルで実行してはいけない理由- VS Codeにプロセスを管理させる設定方法
壁①：設定を書いても、Canvaが開かなかった
最初、.vscode/mcp.jsonにCanva MCPの設定を書いた。
{
"servers": {
"Canva": {
"type": "stdio",
"command": "npx",
"args": ["-y", "mcp-remote@latest", "https://mcp.canva.com/mcp"]
}
}
}
書いた。保存した。何も起きなかった。
CanvaのOAuth画面（ログイン認証画面）が開くはずだった。 開かなかった。
設定が間違っているのか、認証の仕組みが違うのか。 その時点では、何も分からなかった。
壁②：VS Code内のターミナルで実行したら、弾かれた
「ならば手動で認証を動かせばいい」と考えた。
VS Code内のターミナルを開き、以下を実行した。
npx -y mcp-remote@latest https://mcp.canva.com/mcp
結果は「already running（すでに起動中）」。
なぜか。 VS Codeが内部で同じプロセスをすでに起動していたからだ。
設定は読み込まれていた。 ただ、OAuth画面が開かなかっただけで。
壁③：外部ターミナルで認証できた。でも閉じたら消えた
「VS Code外のターミナルなら干渉しないはず」と考えた。
PowerShellを開き、同じコマンドを実行した。 今度はブラウザが開いた。Canvaのログイン画面が出た。許可した。
トークン（接続を維持するための認証情報）を取得した。 達成感があった。
ターミナルを閉じた。
次のチャットを開いた。 繋がらなかった。
トークンはセッションに紐付いていた。 ターミナルを閉じた瞬間、消えていた。
「認証を通過すること」と「接続を維持すること」は、別の話だった。
壁④：プロセスを「誰が管理するか」が問題だった
Claudeに聞いた。
「VS Codeに.vscode/mcp.jsonを登録すれば、
VS Code自身がmcp-remoteプロセスを起動・管理する。
トークンは~/.mcp-auth/に永続化される」
それだけだった。
設定自体はすでに書いていた。 外部ターミナルでOAuth認証を1回完了させ、トークンをキャッシュとして残す。 その後はVS Codeが毎回自動でプロセスを起動する。
VS Codeを再起動し、新しいチャットを開いた。
mcp__canva__search-designsが読み込まれていた。
デザイン一覧が返ってきた。
転換点：MCPは「認証」ではなく「管理」の問題だった
MCPの接続で詰まる人の多くは、「認証を通過すればいい」と思っている。
違う。
認証は入口に過ぎない。 問題は「誰がそのプロセスを継続して管理するか」だ。
外部ターミナルで自分でプロセスを動かせば、閉じた瞬間に消える。 VS Codeに登録すれば、VS Codeが毎回起動して維持する。
管理を委ねるか、自分で持つか。 その違いだけだった。
教訓
npx mcp-remoteを直接実行してもセッション依存になる。閉じたら消える- VS Codeに管理させるには
.vscode/mcp.jsonへの登録が必要 - 「already running」エラーはVS Codeがすでにプロセスを持っているサイン
- 詰まったらAIに「なぜそうなるか」を聞く。手順だけ聞いても同じ罠に落ちる
繋がった先にあるもの
Canva MCPが使えるようになると、以下が自動化できる。
- デザイン一覧の検索・取得
- デザインのエクスポート（PDF/PNG）
- フォルダ管理・アセットのアップロード
3時間かかった。 次は10分で繋げられる。
それが、詰まった時間の価値だ。
AIツールが繋がらないとき、続けられる人と折れる人の違い