Cloudflare Workers AI の始め方｜無料枠と使用量の確認手順

はじめに

前回の記事『Cloudflare Workers で静的サイト公開｜作成からデプロイの手順』では、public フォルダーに置いた HTML を Static Assets で配信しました。今回は Worker のコードでリクエストを処理し、Cloudflare の AI 推論サービスである Workers AI のモデルを呼び出します。

Workers AI は Worker から短いコードで呼び出せる一方、初めて使うと「AI バインディングはどこに書くのか」「ローカル実行でも無料枠を消費するのか」「使用量はどこで確認するのか」で迷いやすくなります。本記事では、2026 年 9 月 28 日（日本時間）に Windows PowerShell で検証した最小サンプルをもとに、作成から公開、使用量の確認までを整理します。

結論として、Workers AI は wrangler.jsonc の ai.binding で Worker と接続し、コードからは env.AI.run() で呼び出せます。無料枠は 1 日 10,000 Neurons で UTC 00:00（日本時間 09:00）にリセットされ、ローカル実行でも推論は Cloudflare 上で行われるため使用量に含まれます。使用量は Cloudflare ダッシュボードの Workers AI の画面で確認でき、AI を呼び出す前の値を控えておくと増加分を比較しやすくなります。

Cloudflare Workers AI の仕組みと無料枠

Workers AI は、Cloudflare のネットワーク上で AI モデルの推論を実行するサービスです。ここでは、サンプルを動かす前に押さえておきたい接続方法と、使用量の単位を整理します。

AI バインディングで Worker とモデルをつなぐ

Worker から Workers AI を使うには、AI バインディングを作成します。バインディングは Worker が Cloudflare 上のリソースを利用するための接続設定で、Wrangler の設定ファイルに ai の項目を追加すると、コードから env.AI として参照できます。

参考: Cloudflare Docs「Workers Bindings」
“To use Workers AI with Workers, you must create a Workers AI binding.”
（Workers で Workers AI を使うには、Workers AI バインディングを作成する必要があります。）
https://developers.cloudflare.com/workers-ai/configuration/bindings/

本記事の構成では、前回のように public フォルダーのファイルを配信するのではなく、src/index.ts の Worker コードが HTML の操作画面を返し、ボタンからのリクエストを受けて env.AI.run() を実行します。コード内に API トークンを記述する必要はなく、ローカル実行やデプロイで必要になる認証は Wrangler の Cloudflare へのログインで行います。

無料枠は 1 日 10,000 Neurons

Workers AI の使用量は Neurons という単位で計測されます。公式の料金ページでは、Neurons はリクエストの処理に必要な GPU の計算量を表す単位と説明されています。

参考: Cloudflare Docs「Pricing」
“use a total of 10,000 Neurons per day at no charge”
（合計で 1 日 10,000 Neurons まで無料で利用できます。）
https://developers.cloudflare.com/workers-ai/platform/pricing/

無料枠はモデルごとではなく合計の値で、UTC 00:00（日本時間 09:00）にリセットされます。上限に達した後の扱いは、Workers のプランによって異なります。

本記事で使う @cf/google/gemma-4-26b-a4b-it の料金は、入力 100 万トークンあたり 9,091 Neurons、出力 100 万トークンあたり 27,273 Neurons です（2026 年 9 月 28 日時点の公式料金表）。消費量は入力と出力のトークン数で変わるため、1 回の呼び出しあたりの Neurons は一定ではありません。

また、一部のモデルは有料の支払い方法が必要で、Workers Paid プランまたはプリペイドの AI Gateway クレジットで利用する条件があります。料金ページの注記で対象として挙げられているのは Kimi、GLM、DeepSeek V4 の一部のモデルで、gemma-4-26b-a4b-it は含まれていません。モデルを変更する場合は、各モデルのページで利用条件を確認することをおすすめします。

ローカル実行でも使用量に含まれる

wrangler dev（本記事では npm.cmd run dev）で起動したローカルサーバーでも、AI モデルは手元の PC ではなく Cloudflare 上で実行されます。

参考: Cloudflare Docs「Get started – Workers and Wrangler」
“will incur usage charges even in local development”
（ローカル開発でも使用量の課金対象になります。）
https://developers.cloudflare.com/workers-ai/get-started/workers-wrangler/

制限のページでも、Wrangler のローカルモードでの推論はレート制限の計算に含まれると説明されています。ローカル確認でも、ボタンを押すたびに Neurons を消費する前提で試すことをおすすめします。

Workers AI の最小サンプルを作成してローカルで確認

ここでは、C3（create-cloudflare）でプロジェクトを作成し、2 つのファイルを編集してローカルで動作を確認します。Cloudflare アカウントの作成、Node.js の準備、PowerShell で npm.ps1 がブロックされる場合の対処は、静的サイト公開の記事で説明しているため、本記事では省略します。

検証環境

筆者が検証した環境は次のとおりです。Windows と Windows PowerShell の詳細なバージョン、Node.js のバージョンは記録していません。

Workers AI の入門ページには、Wrangler の要件として Node.js 16.17.0 以降という記載が残っています。一方、Wrangler のインストールページでは Node.js の Current、Active、Maintenance の各リリースラインをサポートすると説明されており、対応 OS は macOS 13.5 以降、Windows 11、Linux とされています。Linux の要件は、同ページが参照する workerd のリポジトリで glibc 2.35 以上と示されています。Node.js は、インストールページの現行の要件を目安に準備することをおすすめします。

プロジェクトを作成する

cd $env:USERPROFILE

npm.cmd create cloudflare@latest -- workers-ai-basic

cd workers-ai-basic

wrangler.jsonc に AI バインディングを追加する

プロジェクト直下の wrangler.jsonc を開き、既存の項目を残したまま、末尾に ai の項目を追加します。筆者の環境で動作した設定の全体は次のとおりです。

{
  "$schema": "node_modules/wrangler/config-schema.json",
  "name": "workers-ai-basic",
  "main": "src/index.ts",
  "compatibility_date": "2026-09-25",
  "observability": {
    "enabled": true
  },
  "upload_source_maps": true,
  "ai": {
    "binding": "AI"
  }
}

AI の接続に関係するのは "ai": { "binding": "AI" } の部分で、binding に指定した名前 AI がコード内の env.AI に対応します。observability と upload_source_maps は Workers AI の利用に必要な設定ではありません。compatibility_date は Workers ランタイムの互換性の基準日を示す値で、検証日とは別の値です。プロジェクトによって異なる場合があるため、既存の値を変更せずに残します。

項目を追加するときは、直前の項目の末尾にカンマが必要です。上の例では "upload_source_maps": true の後ろにカンマを付けてから "ai" を追加しています。

src/index.ts を書き換える

src/index.ts を開き、テンプレートの内容をすべて次のコードに置き換えます。

export interface Env {
  AI: Ai;
}

export default {
  async fetch(request: Request, env: Env): Promise<Response> {
    const path = new URL(request.url).pathname;

    if (request.method === "GET" && path === "/") {
      return new Response(
        `<!doctype html>
<html lang="ja">
<head>
  <meta charset="utf-8">
  <title>Workers AI 動作確認</title>
</head>
<body style="max-width:640px;margin:48px auto;font:16px/1.6 sans-serif">
  <h1>Workers AI 動作確認</h1>
  <p>ボタンを押すと、AI が ARP について説明します。</p>
  <button id="ask">AI に質問する</button>
  <p id="answer" style="white-space:pre-wrap"></p>
  <script>
    document.getElementById("ask").addEventListener("click", async () => {
      const button = document.getElementById("ask");
      const answer = document.getElementById("answer");
      button.disabled = true;
      answer.textContent = "回答を生成中...";
      try {
        const response = await fetch("/ask", { method: "POST" });
        if (!response.ok) throw new Error("HTTP " + response.status);
        const data = await response.json();
        answer.textContent =
          data.choices?.[0]?.message?.content ?? "回答がありません";
      } catch (error) {
        answer.textContent = "エラー: " + error.message;
      } finally {
        button.disabled = false;
      }
    });
  </script>
</body>
</html>`,
        { headers: { "Content-Type": "text/html; charset=utf-8" } }
      );
    }

    if (request.method === "POST" && path === "/ask") {
      const result = await env.AI.run("@cf/google/gemma-4-26b-a4b-it", {
        messages: [
          {
            role: "user",
            content: "ARPとは何ですか？初心者向けに100字以内で説明してください。",
          },
        ],
        chat_template_kwargs: {
          enable_thinking: false,
        },
      });

      return Response.json(result, {
        headers: { "Content-Type": "application/json; charset=utf-8" },
      });
    }

    return new Response("Not Found", { status: 404 });
  },
} satisfies ExportedHandler<Env>;

コードの役割は、次の 3 点です。

GET /: 操作画面を返す

ブラウザでトップページを開くと、Worker が HTML の操作画面を返します。前回の public/index.html とは異なり、画面の HTML は src/index.ts の中に文字列として含まれています。

POST /ask: AI を呼び出す

画面のボタンを押すと、ブラウザから /ask へ POST リクエストが送られ、Worker が env.AI.run() でモデルを呼び出します。質問文はコード内で固定しており、利用者が自由に質問を入力する仕組みではありません。

回答を画面に表示する

Worker はモデルの応答を JSON で返し、画面側のスクリプトが choices[0].message.content を取り出して textContent で表示します。

chat_template_kwargs の enable_thinking: false は、公式の入門手順と同じく、このモデルの推論（reasoning）を無効にする指定です。Response.json() の第 2 引数で charset=utf-8 を明示している経緯は、後述の文字化けの対処で説明します。

ローカルで動作を確認する

npm.cmd run dev

API を直接確認したい場合は、別の PowerShell を開き、次のコマンドで /ask へ POST リクエストを送ります。応答の JSON から回答の本文だけを取り出して表示するコマンドで、筆者の環境では日本語の回答を取得できました。

(Invoke-RestMethod -Method Post -Uri 'http://127.0.0.1:8787/ask').choices[0].message.content

デプロイしてブラウザから Workers AI を実行

ローカルで動作を確認できたら、Cloudflare へデプロイします。デプロイ後は、発行された workers.dev の URL をブラウザで開き、ローカルと同じ操作を行います。

npm.cmd run deploy

画面の ARP の説明は、動作確認時の出力例です。技術的な正確性を評価したものではなく、生成される文章は呼び出しごとに変わる可能性があります。プロンプトで指定した「100 字以内」も、厳密に守られることを保証するものではありません。

なお、筆者が検証に使った URL は workers-ai-basic.nagisa1.workers.dev です。検証の記録として示すもので、継続的に公開するデモではありません。

ページを開く処理と AI の呼び出しは別に計上される

公開した Worker では、Workers のリクエストと Workers AI の Neurons が別々に計上されます。ページを開くだけでは AI の推論は実行されませんが、Worker の処理自体は実行されます。

Workers の料金ページによると、Workers Free プランの Worker へのリクエストは 1 日 100,000 件までです。これは Workers AI の 1 日 10,000 Neurons とは別の枠です。

公開を続ける場合の注意

このコードは検証用のサンプルです。ボタンの無効化は画面上の連打を抑えるためのもので、サーバー側の利用制限ではありません。公開 URL を知っていれば誰でも /ask へリクエストを送れるため、第三者の呼び出しでも Neurons を消費します。

公開を続ける場合は、アクセス制限や呼び出し回数の制限を検討することをおすすめします。本記事ではこれらを実装・検証していません。検証が終わった Worker は、公開を停止するか削除しておくと、意図しない消費を防ぐことにつながります。

Workers AI の使用量をダッシュボードで確認

Workers AI の使用量は、Cloudflare ダッシュボードの Workers AI の画面で確認できます。2026 年 2 月の変更で、AI 関連の機能はダッシュボードのサイドバーに独立したセクションとして配置されました。

参考: Cloudflare Changelog「AI dashboard experience improvements」
“AI now has its own top-level section in the Cloudflare dashboard sidebar”
（AI は Cloudflare ダッシュボードのサイドバーで独立した最上位のセクションになりました。）
https://developers.cloudflare.com/changelog/post/2026-02-19-ai-dashboard-experience-improvements/

使用量の確認場所と画面の見方

料金ページからは Workers AI のダッシュボードへ直接移動できます。筆者の環境では、画面上部に「1 日の使用量 (UTC 00:00 にリセット) – 今日使用されたニューロン: 3.35k/10k」の形式で当日の使用量が表示され、その下の「テキストの生成」にモデル別の Neurons とグラフが表示されました。

上部の当日使用量

UTC 基準の当日に使用した Neurons の合計と、無料枠 10k の対比です。k 単位の概数で表示されます。

モデル別の表示値

「テキストの生成」などのタスクごとに、モデル別の Neurons がグラフとともに表示されます。グラフの表示範囲と集計単位は、画面上で確認します。

検証中に撮影した画面の表示値

検証中に撮影した画面で、同じモデル @cf/google/gemma-4-26b-a4b-it のモデル別の表示値が増えたことを確認しました。

モデル別の表示値は撮影順に増えた一方、上部の当日使用量は 3 回とも 3.35k/10k のままでした。

表示値を読むときの注意

これらは撮影時点の表示値で、1 回のリクエストの消費量を厳密に測定したものではありません。読み取る際は、次の点に注意が必要です。

• グラフの棒 1 本が呼び出し 1 回に対応するとは限らないため、表示範囲と集計単位を画面で確認します。
• 上部の 3.35k は当日の合計値で、今回の検証だけで消費した量ではありません。
• 上部の表示は k 単位の概数ですが、今回表示が変わらなかった原因が丸めか反映の遅れかは切り分けていません。
• 消費量は入力と出力のトークン数で変わるため、この記録から 1 回あたりの Neurons や 1 日に呼び出せる回数は算出できません。
• Neurons は Workers AI の使用量で、Worker へのリクエスト数とは別に計上されます。

参考までに、最後に撮影したモデル別の表示値 6.25 Neurons を無料枠 10,000 Neurons で割ると、0.1% 未満です。自分の環境で確認する場合は、呼び出し前の表示を控え、呼び出し後に同じ画面で比較することをおすすめします。

つまずきやすい点と対処

検証中に実際に遭遇した症状と、公式情報に基づく補足をまとめます。

wrangler.jsonc で CommaExpected が表示される

ai の設定を追加した際に、CommaExpected が表示されました。前述の補足のとおり項目の間のカンマが不足していたことが原因で、設定ファイルを正しい構文に修正すると解消しました。

ブラウザで Not Found が表示される

開発途中で POST /ask の処理だけを実装していた段階では、ブラウザで / を開くと Not Found が表示されました。ブラウザのアドレス欄から URL を開くと GET リクエストになるため、GET の処理がないパスは 404 になります。

本記事の完成版のコードは GET / で操作画面を返します。/ で Not Found が表示される場合は、src/index.ts が完成版のコードに置き換わり、保存されているかを確認します。なお、完成版でもアドレス欄から /ask を開くと GET になるため、Not Found が返ります。

PowerShell で日本語の回答が文字化けする

当初は return Response.json(result); で応答を返しており、Windows PowerShell の Invoke-RestMethod で取得した回答が ARPï¼... のように文字化けしました。MDN の説明では、Response.json() は Content-Type ヘッダーを application/json に設定するとされています。この標準動作に従うと、当初のコードの応答ヘッダーは文字セット（charset）を含まない application/json になります。検証時に応答ヘッダーを直接確認した記録はなく、これは標準動作に基づく説明です。また、application/json で charset を省略すること自体は、仕様上の不備ではありません。

参考: Microsoft Learn「Windows PowerShell 5.1 と PowerShell 7.x の違い」
「JSON 応答に文字セットが指定されていない場合、既定のエンコードは RFC 8259 ごとに UTF-8 にする必要があります。」
https://learn.microsoft.com/ja-jp/powershell/scripting/whats-new/differences-from-windows-powershell

同ページでは、この JSON 応答の既定の文字コードに関する変更は PowerShell 6.2 で行われたと説明されており、Windows PowerShell 5.1 はそれより前の系統にあたります。ただし、今回の検証では Windows PowerShell の詳細なバージョンを記録していないため、この公式説明と今回の症状を直接結び付けて断定することはできません。

検証では、次のように応答ヘッダーで charset=utf-8 を明示し、同じ呼び出しコマンドを実行しました。

return Response.json(result, {
  headers: { "Content-Type": "application/json; charset=utf-8" },
});

今回の環境では、応答ヘッダーに charset=utf-8 を明示することで、日本語の回答を正常に表示できました。本記事のコードには、最初からこの指定を含めています。

AI の呼び出しがエラーになる

このサンプルは env.AI.run() のエラーを個別に処理していないため、画面に表示される HTTP ステータスが Workers AI のエラーコードと一致するとは限りません。詳細は、ローカル実行時のターミナル出力などで確認します。本記事では上限到達を再現していないため、以下は公式のエラー一覧に基づく説明です。

HTTP 429 には無料枠の超過以外の原因もあるため、429 だけで無料枠の超過と判断しないことをおすすめします。制限のページでは、テキスト生成モデルのレート制限は原則として 1 分あたり 300 リクエストと示されています。

まとめ

Workers AI は、wrangler.jsonc に AI バインディングを追加すると、Worker のコードから AI モデルを呼び出せます。ローカル実行でも Neurons を消費するため、呼び出しの前後でダッシュボードの表示を比較し、無料枠の範囲を把握しながら試すことをおすすめします。

• AI バインディングは wrangler.jsonc の ai.binding で設定します。
• コードからは env.AI.run() でモデルを呼び出せます。
• ローカル実行でも推論は Cloudflare 上で行われ、使用量に含まれます。
• 無料枠は 1 日 10,000 Neurons で、日本時間 09:00 にリセットされます。
• Workers Free では無料枠を超えると推論がエラーになります。
• 使用量はダッシュボードの Workers AI の画面で確認できます。
• 今回の環境では、charset の明示で PowerShell の文字化けが解消しました。

以上、最後までお読みいただきありがとうございました。