障害メモ/Angular2のルーティングで404エラー

キーワード

  • Angular2
  • routing
  • 404 not found

現象

Angular2でルーティングしたときにURLが切り替わる。このURLをリロードすると404エラーになる。ただし、開発時ng serverなどで動かしているときは問題がない。

原因

ないものはないから。なかったときにindex.htmlをレスポンスするようにサーバー設定する必要がある。ng serverなどで動くサーバーはそれをやってくれているのだと思う。

対策

<Directory "/Applications/XAMPP/xamppfiles/htdocs"> # ここはいろいろ
    # rewrite to index.html for Angular2
    Options Indexes FollowSymLinks
    RewriteEngine On
    RewriteBase /
    RewriteRule ^index\.html$ - [L]
    RewriteCond %{REQUEST_FILENAME} !-f
    RewriteCond %{REQUEST_FILENAME} !-d
    RewriteRule . /index.html [L]
</Directory>

備考

開発環境がいろいろやってくれている部分が見えないとハマったときに困る。。

参考

作成日 2016-10-16