Astro + Contentful + Cloudflare Pagesの相性がイマイチだった

エンジニアの性質

主業務とはなるべく異なるアーキテクチャを使ってみたいというのはエンジニアあるあるだと思う。今回、ブログにAstroを使ってみた理由は、仕事がNext.jsの採用に偏りがちだったからだ。必然的にホスティングもVercelに偏ってしまう。State of JSでVite関連がわーきゃーと騒がれており、隣の芝生が青く感じる。使いたかったUnoCSSもNext v14だと使えなくて歯痒い思いもした。(v15で使えたという情報はどこかで見た・・)

本題

ブログを公開するにあたって、しばし500エラーと格闘した。原因は以下の通り。

• AstroにはISRがないので、ひとまずSSRにした
• Cloudflare Pagesのランタイム(の裏側のCloudflare Workersのエッジ) はNode.jsのAPIと完全な互換性がない
• contentful.js のクライアントは内部でAxiosを使っている
• Axiosが非互換のNode.jsのAPIに依存しているため、エラーとなった

ということで、一時的な退避手段としてAstroらしく素直にSGを使うことにした。ただしISRがサポートされていないため、Contentfulで記事を追加した際には再度ビルドが必要になる。Webhookのようなものを使えば再ビルドも自動化できるとは思うが、たまたま悪い組み合わせを引いてしまったようでなんだか残念だ。

contentful.jsのクライアントのHTTPリクエストの内部実装がfetchに変わるのを待つか、あるいはクライアントは使わずfetchでデータを取得すれば回避できそうだ。せっかくだからgraphql用のエンドポイントを使ってみるのもありかもしれないが、少しオーバースペックのような気もする。

マークダウンのパースすら出来ていないので、まだまだこれからである。