Q. Remix Cloudflareで404 not matchエラーが出る

2024年4月29日

Remix + Cloudflareの環境で、トップページのOutlet内部のコンテンツが表示されず、他のページでは404 Not matchエラーが発生するようになったと相談を受けたので、その原因と解決策についてまとめた。

Table of Contents

状況

Remix + Cloudflareの環境で、あるタイミングから、トップページのOutlet内部のコンテンツが表示されず、他のページでは404 Not matchエラーが発生するようになったと相談を受けた。

publicファイルにfavicon.ico以外のファイルを追加すると、Not matchエラーが発生する。

このIssueに紐づいた

このPRの内容で解決した。

次の2つのファイルをpublicディレクトリに配置する。

/public/_headers

/favicon.ico
  Cache-Control: public, max-age=3600, s-maxage=3600
/assets/*
  Cache-Control: public, max-age=31536000, immutable

/public/_routes.json

{
  "version": 1,
  "include": ["/*"],
  "exclude": ["/favicon.ico", "/assets/*"]
}

このPRは2024年2月からマージされておらず、cloudflareの提供しているcrearteコマンドも内部的にはremixの提供しているtemplateを利用しているため、2024年4月現在ではremix + cloudflareの環境のほとんどがこの問題を抱えている可能性がある。