OpenAI APIがタイムアウトする？Workersで専用トンネルを構築、コストゼロで安定化

はじめに

先週、ChatGPT アプリを作ろうと思い立ち、フロントエンドのコードを書いて意気揚々と API を叩いたのですが、接続タイムアウト。何度試してもダメで、ようやく思い出しました——OpenAI は特定の地域からアクセスできないことを。

正直なところ、ネットワークに阻まれる感覚は本当に辛いです。怪しいプロキシサービスを買うのも API Key の漏洩が怖いですし、自分で VPS を借りて構築するのも、コスト（安くても月数百円〜）やサーバー設定・保守の手間を考えると頭が痛くなります。

その後、Cloudflare Workers というソリューションを見つけました。完全無料で、5分で構築完了。2ヶ月以上使っていますが、安定しているだけでなく、多くの有料プロキシよりも高速です。この記事では、構築の全プロセスと、すぐに使える完全なコードをシェアします。

Vultr - 高性能NVMeクラウドサーバー、世界32拠点、Dockerワンクリック展開対応

価格を見る →広告

なぜ Cloudflare Workers を選ぶのか？

コストゼロ、個人開発者に十分

Workers の無料プランは毎日10万リクエスト、毎分1000リクエストまで使えます。「無料なんて使えるの？」と最初は思いましたが、実際に使ってみると、個人開発、学習、小規模プロジェクトには十分すぎるほどでした。
計算してみましょう：1リクエスト平均2秒かかるとして、1日8時間ぶっ続けで呼び出しても2000回程度です。10万回を使い切るには数日かかります。

サーバー不要で安心

従来の方法では VPS を買い、Nginx を入れてリバースプロキシを設定し、サーバーダウンを心配する必要がありました。Workers ならインフラは Cloudflare が全部やってくれるので、コードを数行書くだけで済みます。
しかも Workers は Cloudflare のグローバル CDN ネットワーク上で動作するため、理論上は自前のサーバーよりも高速です。世界300都市以上にノードがあるのですから。

API キーを安全に保護

これは特に重要です。フロントエンドから直接 OpenAI API を叩くと、ブラウザの開発者ツールで API Key が丸見えになってしまいます。Workers を中間層にすれば、フロントエンドは Worker のアドレスを叩くだけで済み、本物の API Key は Cloudflare の環境変数として安全に保管されます。

"2025年8月、CloudflareはOpenAIと提携し、OpenAIのオープンソースモデルをWorkers AIに直接統合。毎日10,000ニューロンの無料枠を提供しています"

2025年の新特典

2025年8月、Cloudflare は OpenAI と提携し、OpenAI のオープンソースモデルを Workers AI に直接統合しました。つまり、純正 API の代理だけでなく、Cloudflare が提供するモデルも直接利用でき、毎日 10,000 ニューロンの無料枠がもらえます。

構築前の準備

準備は超簡単です：
アカウントとリソース：

• Cloudflare アカウント（無料登録、数分で完了）
• OpenAI または Claude の API Key（すでに持っていますよね）
• ドメイン（オプション。Workers が無料の .workers.dev サブドメインをくれます）
  技術要件：
• 少しの JavaScript 知識（fetch リクエストがわかればOK）
• HTTP の基礎知識
  所要時間：
• 初回構築：5-10分
• 慣れてから：3分

実践：5分で OpenAI プロキシを構築

ステップ1：Worker の作成

Cloudflare コンソールにログインし、左メニューから「Workers & Pages」を探します。「Create Application」をクリックし、「Create Worker」を選択します。
Cloudflare がランダムな名前（例：aged-shadow-1234）を付けてくれますが、「openai-proxy」など好きな名前に変更できます。「Deploy」をクリックしてデプロイします。
これで、まだ何もしませんが、動作する Worker ができました。

ステップ2：コードを書く

「Edit Code」をクリックしてコードエディタに入り、以下のコードを貼り付けます：

export default {
  async fetch(request, env) {
    const url = new URL(request.url);
    // ドメインをOpenAIのAPIアドレスに置換
    url.hostname = 'api.openai.com';
    // 新しいリクエストを作成
    const newRequest = new Request(url, {
      method: request.method,
      headers: request.headers,
      body: request.body
    });
    // リクエストを転送してレスポンスを返す
    const response = await fetch(newRequest);
    // CORS（クロスオリジン）問題を処理
    const newResponse = new Response(response.body, response);
    newResponse.headers.set('Access-Control-Allow-Origin', '*');
    newResponse.headers.set('Access-Control-Allow-Methods', 'GET, POST, PUT, DELETE, OPTIONS');
    newResponse.headers.set('Access-Control-Allow-Headers', 'Content-Type, Authorization');
    return newResponse;
  }
};

コードの簡単な解説：

Alibaba Cloud - 開発者向けクラウドの第一候補、ライトサーバー15%OFF、プロジェクトの迅速な立ち上げを支援

15%割引を入手 →広告

1. フロントエンドからのリクエストを受け取る
2. リクエストアドレスのドメインを api.openai.com に書き換える
3. 修正したリクエストを OpenAI に転送
4. OpenAI からのレスポンスをそのままフロントエンドに返す
5. ついでに CORS（クロスオリジン）問題を解決
   「Save and Deploy」をクリックして保存します。

ステップ3：テスト

デプロイ完了後、Worker の URL（例：https://openai-proxy.yourname.workers.dev）が表示されます。
curl でテストしてみましょう（YOUR_API_KEY を自分のキーに置き換えてください）：

curl https://openai-proxy.yourname.workers.dev/v1/chat/completions \
  -H "Content-Type: application/json" \
  -H "Authorization: Bearer YOUR_API_KEY" \
  -d '{
    "model": "gpt-3.5-turbo",
    "messages": [{"role": "user", "content": "Hello!"}]
  }'

OpenAI から正常なレスポンスが返ってくれば、成功です！

上級編：複数 AI サービスのサポート

Claude API プロキシ

Claude の API 構造は OpenAI と少し異なり、主にリクエストヘッダーが違います。コードを修正して Claude に対応させます：

export default {
  async fetch(request, env) {
    const url = new URL(request.url);
    // パスでどのサービスか判断
    if (url.pathname.startsWith('/claude')) {
      // /claudeプレフィックスを削除し、Anthropicへ転送
      url.pathname = url.pathname.replace('/claude', '');
      url.hostname = 'api.anthropic.com';
    } else {
      // デフォルトはOpenAI
      url.hostname = 'api.openai.com';
    }
    const newRequest = new Request(url, {
      method: request.method,
      headers: request.headers,
      body: request.body
    });
    const response = await fetch(newRequest);
    const newResponse = new Response(response.body, response);
    newResponse.headers.set('Access-Control-Allow-Origin', '*');
    return newResponse;
  }
};

これで /claude/v1/messages にアクセスすれば Claude API に転送されます。

Gemini API プロキシ

Google の Gemini API エンドポイントは generativelanguage.googleapis.com です。判定を追加するだけです：

if (url.pathname.startsWith('/gemini')) {
  url.pathname = url.pathname.replace('/gemini', '');
  url.hostname = 'generativelanguage.googleapis.com';
}

これで1つの Worker で3つの AI サービスをプロキシできるようになりました。

セキュリティのベストプラクティス

API Key をハードコーディングしない

Worker コードに直接 API Key を書いているチュートリアルを見かけますが、絶対にやめましょう！ コードは平文で保存されますし、誤って共有してしまうリスクがあります。
正しい方法は環境変数を使うことです。Worker 設定の「Variables and Secrets」で環境変数を追加します：

Railway - モダンなデプロイプラットフォーム、煩わしい運用から解放、数分で公開

今すぐ始める →広告

• 名前：OPENAI_API_KEY
• 値：あなたのAPI Key
• タイプ：「Secret」（暗号化保存）を選択
  そしてコードではこう使います：

export default {
  async fetch(request, env) {
    // 環境変数からAPI Keyを読み込む
    const apiKey = env.OPENAI_API_KEY;
    // リクエストヘッダーを修正してAPI Keyを追加
    const headers = new Headers(request.headers);
    headers.set('Authorization', `Bearer ${apiKey}`);
    // 以降のコードは同じ...
  }
};

こうすればフロントエンド側で API Key を渡す必要がなくなり、より安全です。

カスタム認証トークンの追加

Worker URL が他人に知られて悪用されるのが心配な場合、簡単な認証を追加できます：

export default {
  async fetch(request, env) {
    // カスタムTokenをチェック
    const authToken = request.headers.get('X-Custom-Auth');
    if (authToken !== env.MY_SECRET_TOKEN) {
      return new Response('Unauthorized', { status: 401 });
    }
    // 検証通過、リクエスト処理を継続...
  }
};

環境変数 MY_SECRET_TOKEN を設定し、フロントエンドからの呼び出し時にこのカスタムヘッダーを付与します。

使用量の監視

Cloudflare コンソールの Analytics タブで日々のリクエスト数やエラー率を確認できます。定期的にチェックし、無料枠を超えそうなら早めに気づけるようにしましょう。
「Notifications」でルールを作成し、リクエスト数が10万回に近づいたらメール通知を受け取ることも可能です。

よくある問題と解決策

リクエストが遅い、またはタイムアウトする

レスポンスが極端に遅い場合、Worker に割り当てられたノードが理想的でない可能性があります。
解決策：カスタムドメインをバインドする。Cloudflare はドメインの DNS 設定に基づいてルーティングを最適化するため、無料の .workers.dev ドメインより速くなることが多いです。
Worker 設定の「Triggers」→「Add Custom Domain」で、自分のドメイン（例：api.yourdomain.com）を入力し、指示に従って DNS レコードを追加します。

403 または 401 エラー

これらは通常 API Key の問題です：

1. 環境変数の Key 名とコード内の名前が一致しているか確認
2. API Key が有効で、残高があるか確認
3. OpenAI/Claude に地域制限がないか確認（Workers はグローバルですが、一部のノードが制限対象国と判定されることがあります）

デバッグのコツ：コードにログを追加します：

console.log('API Key:', env.OPENAI_API_KEY ? '設定済み' : '未設定');

そして Worker の「Logs」タブでリアルタイムログを確認します。

無料枠で足りない場合

もし10万回で足りない場合（商用プロジェクトなど）、有料プランを検討してください：

• Workers 有料プラン：月額$5、1000万リクエスト含む
• 超過分：100万リクエストあたり$0.50
  正直、中規模アプリケーションなら、自分で VPS を買うよりこの価格の方がお得です。サーバー管理の手間も省けます。

最適化のアドバイス：

1. フロントエンドでキャッシュを行い、同じリクエストを繰り返さない
2. バッチインターフェースを使用し（APIが対応していれば）、リクエスト回数を減らす
3. 開発段階では Mock データを使い、リアル API を叩きすぎない

結論

長くなりましたが、Workers プロキシソリューションの核心的利点は3つです：

• コストゼロ：個人開発には十分すぎる無料枠
• ハードルゼロ：5分で設定完了、コードは30行未満
• リスクゼロ：API Key は安全に保管され、漏洩しない
  この方法は、個人の学習、デモ開発、小規模プロジェクトに最適です。安定した AI API アクセス方法を探しているなら、ぜひ Workers を試してみてください。
  今すぐ作ってみましょう！ この記事を保存して、問題が起きたらいつでも見返してください。もし構築中に他の落とし穴に遭遇したら、コメント欄で教えてください。最適化の余地があれば共有したいです。
  ちなみに、記事で触れたいくつかのオープンソースプロジェクト、特に chatgptProxyAPI や worker-openai-proxy はコードが非常にわかりやすいので、GitHub で学ぶのもおすすめです。
  現在どのような方法で AI API にアクセスしていますか？ コメントで話し合いましょう！

4 min read · 公開日: 2025年12月1日 · 更新日: 2026年1月22日

Easton

AI・インテリジェンス