vue-routerを使ってSPAをリモートサーバにデプロイしてみたところ、
ローカルでは問題なかったページリロードで404が返り、「??」となりました。
調べてみたところ、公式に設定方法が記載されていたので、
https://router.vuejs.org/guide/essentials/history-mode.html#html5-mode
設定しようとして、少しハマりましたので備忘録残します。
CentOS8環境上のapacheで、まず、httpd.conf
の記述で少しハマりました。
<Directory /var/www/dir>
AllowOverride All
</Directory>
をまず設定してやることが必要でした。.htaccess
の適用のために。(その他のオプションは割愛)
また、/var/www/dir
の部分は、公開ディレクトリルート設定なので、環境に合わせて変える必要があります。
まずここがハマりどころでした。
次に、肝心の.htaccess
の内容は、公式にある以下のような記述でとりあえずOKでした。
これで直接ページにアクセスしても404にならなくなってよかった。
<IfModule mod_rewrite.c>
RewriteEngine On
RewriteBase /
RewriteRule ^index\.html$ - [L]
RewriteCond %{REQUEST_FILENAME} !-f
RewriteCond %{REQUEST_FILENAME} !-d
RewriteRule . /index.html [L]
</IfModule>
あとはSPAと直接関係ないですが、ついでに、.htpasswd
でパスワード保護などもかけてみました。
一緒に.htaccess
で手軽に設定できたのでよかったよかった。
(httpdの再起動も忘れずに)
備忘録デシタ。