React Routerを使用したSPAがApache環境で404になる
ReactによるSPAをApacheサーバーを使用した環境にデプロイしたときの問題。
React Routerで設定しているルーティングに基づきURLを直接入力またはリロードすると404エラーになってしまう。
よく考えたら当たり前だったが、Apacheとしてはそのパスに実際のファイルは存在しないので404になる。
Reactのルートとなるindex.htmlへとリライトする設定が必要だった。
Reactビルドファイルを配置するディレクトリ直下に.htaccessを作成し以下のように設定する。
code:.htaccess
Options -MultiViews
RewriteEngine On
RewriteCond %{REQUEST_FILENAME} !-f
RewriteRule ^ index.html QSA,L
Deployment | Create React App
MultiViewsはコンテントネゴシエーションという機能で、これを無効にしている。
（React Routerの動きを阻害するものなのだろう）
リクエストファイルが存在しない場合、index.htmlへとリライトする。
QSAは、クエリパラメーターがあればこれをリライト先に含めるという意味。
Lはマッチしたら以降のルールは無視という意味。