[Astro] Cloudflare PagesのHybrid RenderingでSSR時にenvが参照できない問題への対処法

AstroでSSGしているこのサイトに下書きプレビュー機能（SSR）を実装するため、Hybrid Renderingを有効にしたのですが、ローカル環境では問題ないもののCloudflare上でいざ確認するとSSRに失敗していました。

原因

Cloudflareのリアルタイムログを見ると、次のようなメッセージ（一部抜粋）が出力されていました。

[ERROR] Error: hoge parameter is required.

HeadlessCMSに渡すような変数（仮にhoge）の値はimport.meta.env.HOGEのように環境変数を参照していて、どうもそれが正しく参照できていない模様。色々と試行錯誤するものの解消せず、AstroのIssueを探していたら同じ事象に関するものが報告されていました。

Astroはimport.meta.env.HOGEのように参照すると内部的にはprocess.env.HOGEを参照しているようなのですが、Cloudflare Workersではprocess.env.*がビルドする際に反映されないために問題が起きているようでした。

解決方法

ワークアラウンドとしてastro.config.mjsにvite.defineを追記して、process.env.HOGEを次のように置き換えてあげます。

export default defineConfig({
 :
  output: "hybrid",
  adapter: cloudflare(),
  vite: {
    define: {
      "process.env.HOGE": JSON.stringify(process.env.HOGE),
      "process.env.FOO": JSON.stringify(process.env.FOO),
      "process.env.BAR": JSON.stringify(process.env.BAR),
    }
  }
 :
})

これでデプロイしたら正常に動作しました！