← 戻る

wrangler pages dev のハマりポイント

wrangler cloudflare astro development

問題

astro dev では Cloudflare Pages Functions (/api/* 経由) が動作しない。

解決方法

CF Pages 環境をローカルで再現するには wrangler が必要：

# ビルド
astro build

# CF Pages Functions 付きで起動
wrangler pages dev dist

ポイント

1. シークレット管理

  • .env ファイルは wrangler が読まない
  • .dev.vars ファイル を使用する
  • 形式は .env と同じ（KEY=value）
# .dev.vars の例
TURNSTILE_SECRET_KEY=1x0000000000000000000AA
SLACK_WEBHOOK_URL=https://hooks.slack.com/...

2. 既知の警告（無視してOK）

WebSocket関連のエラー：

TypeError: Web Socket request did not return status 101

→ miniflare の既知問題。ローカル開発に影響なし。

3. 使い分け

目的コマンド
単純な Astro サイトastro dev
API ルートも含むwrangler pages dev dist

ベストプラクティス

開発時は wrangler pages dev dist 一択で、CF Pages 本番環境と同じ条件でテストする。