Cloudflare MCP・Wranglerの使い方｜アシュラ秘奥義への実装で分かった役割分担

家事と子育てのスキマで経営する3方よしAI共創コンサルタントの田中啓之、ひろくんです。

CloudflareをAIへつないだら、あとは「サイトを公開して」で全部終わる。

私も、最初はそんな景色を想像していました。

でも実際に自分のMacへ入れてみると、MCPへ接続できたのは完成じゃなかったんだよね。むしろ、厨房に配管を通しただけ。何を作るか、どの道具を使うか、どこで人が味見するかは、そのあとです。

最初に入れたのは、Cloudflareの2つのSkillと、公式資料を読むMCP、自分のCloudflareにつなぐMCP。言葉が多いよね。でも、ここまではまだ準備です。

そのあと実際に使ったのが、私が運用しているゲーム制作システム「アシュラ秘奥義」です。

ここで一つ、先に伝えたい。今回のゲームは、私が一人で仕事として作ったサンプルじゃない。夏休みに息子と一緒に作ったゲームなんです。

息子が「こうしたい」と言葉で指示する。その言葉をAIがコードや画面へ広げていく。子どもが難しいプログラムを書かなくても、タイトル画面、遊び方、キャラクター選択、スマホ操作まであるゲームにできました。子どもの指示だけでも、簡単にここまでハイクオリティにできる。そこに、いちばん驚いたんだよね。

アシュラ秘奥義での管理名は「ガオジャンプ2」。実際のゲーム画面では「咆哮！化石タワー」、遊びの名前は「ガオジャンプ塔」と表示されます。この実物を題材に、作品ごとのversionをCloudflare Pagesへ出す導線を組み込みました。

ただし、公開ボタンを押せるだけ——ではない。

元のコードが途中で変わっていないかを指紋（SHA-256）で確かめる。人が公開対象を確認する。公開後は3つのURLを実際に開く。全部通った時だけ成功記録を残し、告知ブログはもう一度、人が確認してから出す。そこまで実装し、現在は「ガオジャンプ2」がCloudflare Pagesで実際に動いています。ゲーム公開と記事公開を別々に止められるところまで含めた実録です。

この記事の中心は、この実例なんだよね。

Skill・Docs MCP・API MCP・Wranglerが実際の仕事でどう分かれるのかを、私がやった順番で書いていく。用語集じゃない。「AIへどこまで任せ、どこで人が止めるか」の実録です。

きっかけになった参考動画

今回試してみようと思ったきっかけは、KEITO【AI&WEB ch】さんの動画「CloudflareとClaude Code（Codex）の組合せが最高って話題なので解説（セットアップ方法）」でした。

この動画のいいところは、Cloudflareを単なるサーバー会社として紹介して終わらないところ。Claude CodeやCodexと組み合わせると、AIと相談しながらサイトを作り、Cloudflareへ持っていける。その全体像を、主要な用語、無料で試せる範囲、接続、Wranglerの導入、サンプルサイト作成まで一本で見せてくれます。

YouTubeで参考動画を見る

でね。私は動画を見て「つなげた」で終わらせず、アシュラ秘奥義へ入れてみました。そこで分かったのが、動画のセットアップは入口で、実務では「何を公開するか」「確認後にコードが変わったらどうするか」「公開成功を何で判定するか」まで決めないと危ない、ということです。

動画で全体像をつかみ、この記事で実装後の現実を見る。この順番なら、CloudflareとAIの使い方が腹に落ちやすいと思います。

結論｜Cloudflareを任せる前に、4つの役割を分ける

最初に、いちばん大事なことから。

CloudflareをAIに使わせる仕組みは、ひとつの万能道具ではありません。役割の違う道具を組み合わせる。私の環境では、公式資料だけを読むDocs MCPも足しました。

あ、そうだ。MCPを「AI用のUSB-C」と説明することがあります。

料理に例えると、Skillはレシピ、Docs MCPは料理本、API MCPは倉庫の鍵、Wrangler CLIは調理器具です。鍵が開いても料理は完成しない。

API MCPはCloudflareの多くの機能へ届きます。便利。でも——触れる範囲が広いから、最初の依頼では「読むだけ。変更しない」と固定します。

公式の最短ルートと、今回の最小構成は違う

新しい環境なら、SkillsとMCPをまとめる公式pluginが早い。今回はClaude・Codex・Grokで共有するSkill正本があったので、必要な2 Skillと2 MCPだけを直接入れました。重複させないためです。

WranglerはSkillにするの？答えは「SkillもCLIも」

「WranglerはSkillにするの？」。ここ、私も引っかかりました。答えは、Skillにもする。でもCLIも必要です。

Wrangler Skillは「いつ、何を使うか」を教える

wrangler Skillは、「どのコマンドを使うか」「実行直前に何を確かめるか」をAIへ教える手引きです。手引きを置いただけでは、何も実行されません。

Wrangler CLIは「実際に手を動かす」

Wrangler CLIは、プロジェクトの中で実際に動くコマンドです。私はアシュラ秘奥義の中へ入れ、使うバージョンが勝手に変わらない形にしました。

npm i -D wrangler@latest
npx wrangler --version

でね。実行直前には、いきなり deploy を打たなくていい。

npx wrangler deploy --dry-run --outdir dist

Skillがdry-runを挟むと判断し、CLIが公開せずbundleを作る。判断と実行の両方で、仕事になります。

WranglerとAPI MCPの使い分け

• Workerのlocal dev、build、deploy、D1 migrationはWrangler
• DNS、WAF、Zero Trust、アカウント横断のAPI操作はAPI MCP
• 仕様確認はDocs MCP
• 何を選び、どこで止めるかはSkill

この分担なら、AIが何を調べ、何を実行したか追えます。

実例｜アシュラ秘奥義へCloudflare Pages公開を組み込んだ

実際にCloudflareを使った場所は、アシュラ秘奥義。

このアプリは、作ったミニゲームを一覧から遊び、複製し、手直しし、過去版を残せます。そこへ「完成したゲームをCloudflare Pagesへ出す」流れを足しました。

検証に使ったのは、アシュラ秘奥義で「ガオジャンプ2」として管理しているゲーム。記事用の架空例ではありません。夏休みに息子と作り、Cloudflare Pagesへ公開した実物です。game IDは 20260831-150346-7477aefd、公開versionは1。

息子の「こうしたい」から、ここまでゲームになった

画面に出るタイトルは「咆哮！化石タワー」。声をためて金色の足場を作り、太古の雲を突き抜けていく「ガオジャンプ塔」というゲームです。

私が面白いと思ったのは、息子がコードを書いたから完成したわけではないこと。子どもが言葉で指示するだけで、世界観、ルール説明、キャラクター選択、パソコンとスマホの操作まで、一つの遊べる形にできました。

これが、実際のゲーム画面です。

「AIならゲームも作れます」と言葉で説明するより、この一画面を見てもらう方が早い。子どもの発想を、親子で実際に遊べるところまで持っていける。それが今回の実例です。

何を作ったのか

ゲームごとにCloudflare Pages projectを増やす設計にはしませんでした。作品が増えるほどprojectも増えたら、管理が先に破綻するからです。

ゲームは ashura-mini-games という1つのprojectへまとめる。作品とversionをpathで分ける1 project方式。

version固定URL
https://ashura-mini-games.pages.dev/games/{gameId}/v{version}/

最新versionを指す固定URL
https://ashura-mini-games.pages.dev/games/{gameId}/

告知blogは ashura-game-news という別projectへ分離しました。

つまり、ゲーム本体とblogを同じ公開操作へ束ねていません。ゲームが正常に開けたあとでblogを用意する。その内容を人が読み、別の承認を出した時だけblogを公開します。

公開ボタンの前に、5つの関門を置いた

私が欲しかったのは、「公開コマンドを短くするボタン」ではありませんでした。

「違う作品を出さない」「確認後にcodeが変わったら止める」「公開できたふりをしない」。そのための関門です。

symlinkでproject外のfileへ抜ける経路も拒否します。公開済みversionのsnapshotは書き換えず、過去versionを残したまま最新URLだけを更新する設計。

ここまでやって、やっと「公開ボタン」が仕事になります。

Wranglerを、実際のアプリの中でどう使ったか

この実例でCloudflareへ公開する実行役は、API MCPではなくproject-localのWrangler CLI。アシュラ秘奥義へWrangler 4.127.1を入れ、アプリから同じversionを呼び出すようにしました。

公開処理は、対象projectの存在を確認し、必要なら作成してから wrangler pages deploy を実行する。その後、返ってきたURLだけでなく、production URL・version固定URL・最新固定URLを個別に読み直します。

途中で、standalone buildがproject内ではないWranglerのshimを拾い、最終checkが壊れる問題も出た。そこで、アプリのrootとproject-local Wranglerを優先して解決するよう修正。136件のtestとbuildを通し、実際に動いているアプリの公開準備画面まで確認しました。

Skillは、この構成と安全境界を考える側。Wrangler CLIは、決めた対象をbuild・deployする側です。

そしてAPI MCPは、この公開処理の代役ではありません。accountやzoneなどCloudflare全体をAPIで調べたり操作したりする時に使う。今回のPages公開導線はWranglerが主役でした。

現在の画面とAPIが返した事実

実際に稼働中のアシュラ秘奥義で「ガオジャンプ2」の公開画面、履歴、公開先URLを読み直した結果です。

接続だけでなく、ガオジャンプ2の実URLまで開けた。つまり今回は「公開できる設計を作った」で終わらず、実際のゲーム公開まで到達しています。

一方で、告知ブログは人の確認を通す別工程なんだよね。ゲームが公開できたからといって、記事まで自動で外へ出さない。この分離も、アシュラ秘奥義に組み込んだ大事な関門です。

この差は小さく見えるけど、めちゃくちゃ大事でした。

ready: true は、料理でいえば厨房の火がつく状態。料理を客席へ出した証明ではない。今回は外部URLがHTTP 200で開くところまで確認したから、初めて「ゲーム公開済み」と言えます。ここを分けると、AIの「できました」をそのまま信じなくて済みます。

その前段で、このMacへ入れた最小構成

アシュラ秘奥義へ組み込む前に、Cloudflareの知識と接続を整えました。

• Cloudflareプラグイン一式は重ねない
• cloudflare と wrangler の2 Skillを共有正本へ入れる
• Docs MCPとAPI MCPを登録する
• API MCPはOAuth接続まで進める
• 実際のPages公開は、対象projectのlocal Wranglerへ任せる

AIには、公式repositoryからの導入、共有Skill registryの同期、MCP登録、Docs MCPのsmoke test、接続状態のreadbackを任せました。

導入したCloudflare Skillsは、公式repositoryのcommit f96bff754e428838818017f75817f0f9428acd48 に固定。共有Skill registryは再検証時点で237 Skill、error 0。

Docs MCPは「接続済み」の表示だけで終わらせていない。initialize、tools一覧、Cloudflare Workers・Wrangler・deployに関する公式資料の検索まで実行しました。

API MCPはOAuthを完了し、Cloudflare作業用のCodex profileで enabled / OAuth とreadback済みです。

準備、実装、接続、公開を混ぜない。

今回いちばん残したかった実録は、ここです。

ProfileごとにMCP設定が分かれる

もうひとつ、実際に入れて分かったことがある。

CodexのMCP設定はprofile単位でした。Cloudflare作業用profileへ登録した2本が、別profileへ自動で入るわけではありません。

「このMacへ入れたから全部のCodexで使える」と思い込まない。使うprofileごとに codex mcp list を読み、名前・URL・enabled・Authを確かめる必要があります。

接続したあと、最初はこの5段階で使う

アシュラ秘奥義で実際に組んだ工程を、ほかのアプリでも使える形にするとこうなる。

実装から最終実行直前の検査までは、次のように一度で頼めます。

Cloudflare Skillに従い、ミニゲーム公開機能をlocalで実装してください。
game ID・version・source SHAを確認画面へ出し、確認後の改変は停止。
project-local Wranglerを使い、test・build・login状態を確認してください。
version固定URLと最新URLを分け、3 URLのHTTP確認後だけreceiptを保存。
Cloudflare resource作成とdeployはまだしないでください。

いやー…長く見えるよね。でも、人が操作するのは公開対象の味見と最終GO。AIには1〜4を任せ、5だけを切り離します。

OAuthで詰まったら、古い認証URLを捨てる

ぶっちゃけ、今回いちばん時間を使ったのはOAuthでした。

Codexはloginごとにlocal listenerと認証URLを一組で発行します。listenerがtimeoutしても古いbrowser画面は残る。でも、そこでAuthorizeしても戻り先はもういない。画面は進むのに、接続は完成しない……。

私は技術的なretryのたびに同じASKを出してしまいました。人の判断は変わっていない。これは運用ミスです。

最後は、流れを一本にそろえて復旧しました。

1. 古いOAuth login processと待受を止める
2. codex mcp login cloudflare-api を1本だけ起動する
3. そのprocessが発行した最新URLだけを開く
4. login済みbrowserで権限を確認し、同じsessionのままAuthorizeする
5. localhost callbackが返ったあと、codex mcp list で OAuth を読戻す

古い番号札を新しい受付へ持っていっても呼ばれない。認証URL・listener・OAuth state・callbackは一組です。

ASKは権限判断の時だけ。技術的なretryはAI側で整理する。失敗を手順へ変えれば、次は同じ場所で止まりません。

よくある質問

Cloudflareプラグインは入れた方がいい？

新しいCodex環境へ最短で入れるなら、公式プラグインが分かりやすいです。SkillsとMCPをまとめて導入できる。

今回のように共有Skill基盤や既存MCP設定があるなら、重複を確認して必要なものだけ直接入れる方法もあります。

Docs MCPだけならCloudflareアカウントは必要？

公式資料の検索が目的なら、Docs MCPは自分のCloudflare accountを読む役ではありません。自分のresourceへ触る時にAPI MCPのOAuthが必要になります。

Wrangler Skillを入れればdeployできる？

できません。Skillは判断と手順。実行にはprojectへWrangler CLIが必要です。

API MCPのOAuth接続が終われば安全？

接続できたことと、許可範囲が適切なことは別です。認可画面のpermission、最初のpromptの禁止操作、実行後のreadbackを分けて確認します。

今回の環境はもうCloudflareへdeployできる？

はい。アシュラ秘奥義にはWrangler 4.127.1とCloudflare Pages公開導線が入り、「ガオジャンプ2」version 1は実際に公開され、外部URLのHTTP 200まで確認済みです。告知blogは別工程で、人の確認なしには外へ出ません。

まとめ｜接続はスタート。仕事になるのは、そのあと

CloudflareとAIをつなぐ時、覚えることはサービス名の多さではありません。

• Skillは、判断と進め方を教える
• Docs MCPは、公式情報を読む
• API MCPは、自分のCloudflareへ届く
• Wrangler Skillは、CLIの使いどころを教える
• Wrangler CLIは、local開発・migration・deployを実行する

そして、公開は最後に分ける。

今回のMacでは、Cloudflare SkillとWrangler Skill、Docs MCPとAPI MCPまで入りました。Docs検索は実測済み。API MCPはOAuth接続済み。

さらにアシュラ秘奥義へproject-localのWrangler 4.127.1を入れ、「ガオジャンプ2」をCloudflare Pagesへ公開しました。SHA確認、3 URLのHTTP検証、receipt、blog別承認までcodeになっている。

API MCPでの実data読取と告知blogの公開は、まだ行っていません。ゲーム公開と情報発信を別の判断に分けています。

ここを「未完成」と一言で片づけず、現在地として見えるようにする。

接続はスタート。

仕事になるのは、調査→読取→local制作→dry-run→最終GOの責任がつながったあとです。

人間は目的と違和感を縦に掘る。AIには、調査と実行を横へ広げてもらう。それが、今回の実録から見つけたCloudflareの使い方です。

この記事で確認できたこと／まだ確認していないこと

確認できたこと

• Cloudflare公式の現在のCodex向け役割分担
• cloudflare / wrangler Skillの実在と共有レジストリ正常
• cloudflare-docs MCPの初期化・tools一覧・実検索
• cloudflare-api MCPのOAuth接続状態
• アシュラ秘奥義のCloudflare接続状態 ready: true
• 「ガオジャンプ2」のgame ID・version・公開予定project
• source SHA確認、3 URL検証、receipt、blog別承認を含むPages公開導線
• project-local Wrangler 4.127.1と136件のtest・build成功
• 「ガオジャンプ2」version 1の公開URLがHTTP 200であること
• 公開ゲーム一覧が稼働していること
• 告知blogがゲーム公開とは別の承認で止まること

まだ確認していないこと

• API MCPでの実account・zone・Workers読取
• 別ゲームを公開した場合の一連の再現性
• 告知blogの別承認と公開
• Worker・D1・R2の新規作成
• 料金、rollbackの実地確認

参考動画

KEITO【AI&WEB ch】さんの動画は、Cloudflareを初めてAIと組み合わせる人に向いています。何ができるのか、Claude CodeやCodexとどうつなぐのか、Wranglerをどう入れるのか。操作画面を見ながら全体像をつかめる。

私の記事は、その続き。動画で紹介された組み合わせをアシュラ秘奥義へ持ち込み、公開対象の固定、改変検知、公開後のURL確認、成功記録、告知ブログの別承認まで足したんだよね。

• CloudflareとClaude Code（Codex）の組合せが最高って話題なので解説（セットアップ方法）｜KEITO【AI&WEB ch】

Cloudflare公式資料

• Cloudflare公式：Codex setup
• Cloudflare公式：MCP servers for Cloudflare
• Cloudflare公式：Docs for agents
• Cloudflare公式：Wranglerのinstallとupdate
• Cloudflare公式：Wrangler bundling / dry-run
• Cloudflare公式Skills：GitHub

参考リンク｜AI氣道の関連記事

• MCPステートレス化とは？セッション廃止をやさしく解説
• AGI Cockpitとは？複数のAIを1画面で動かす無料アプリを実運用データで解説
• AIスキルのブラックボックス化｜7項目分解と業務の棚卸しで見える仕事に戻す