はじめに
Laravel 10から入門したが、Laravelってバージョンによって操作コマンドや記述方法、ディレクトリ構造が部分的に違う。今回は自分が遭遇した403、404の解決事例を備忘録として記述する。
ChatGPTやネット記事に騙されてはいけない
ChatGPTは古いバージョンの話が混在した返答をしてくる。またネット記事はバージョンが明記されていないものは自分が操作しているバージョンに当てはまるのかどうか確認して実行する。
ウェルカムページが403
apache2の設定が原因だった。必要なapache2の設定は、AllowOverwride Allと、mod-rewrite有効化。
<Virtualhost *:80>
ServerName *****
DocumentRoot /home/user/project/public
<Directory "/home/user/project/public">
Options FollowSymLinks
AllowOverwride All
Reqire All granted
</Directory>
</Virtualhost>
a2enmod rewrite
systemctl restart apache2
apacheを再起動するとpublicにあるhtaccessが動くようになり、ウェルカムページが表示されるはず。
それでも403なら
画像ファイル等を使用している場合、storageにリンクを張る必要がある。
php artisan storage:link
chmod -R 775 storage
chmod -R 775 bootstrap/cache
ついでにログファイルへの書き込み権限も与えておくと良い。
chmod 777 storage/logs/laravel.log
DocumentRootを変えられない場合
プロジェクトユーザーの公開ディレクトリをUserdirで変更する。
Userdir enabled
Userdir disabled root appuser
<Directory /home/appuser/project/public>
Options FollowSymLinks
AllowOverride All
Require all granted
</Directory>
ログインページが404
ウェルカムページが表示されているのに"\login"にアクセスすると404となった。
これはアセットの構築の仕方とbladeの記述方法がネットで調べて出てきた古いバージョンとは違うことが原因だった。
Laravel 10で必要なものはnodejsとnpm、Viteによるビルド。
nodejsはそのままインストールしようとすると古いバージョンが入るので、リポジトリの追加から。
curl -fsSL https://deb.nodesource.com/setup_lts.x | sudo -E bash -
上記のコマンドはそのうちサポートしなくなるからGitを見ろという警告文が出た。インストールするときしか使わないので今回はそのまま実行した。
apt update
apt install nodejs
これでnodejsとnpmがインストールされた。nodejsはLTS版の新しいものを入れておくとベター。(記事を書いているときは18が入った。)
プロジェクトを作成する一般ユーザーへ移る。プロジェクトディレクトリで以下を実行。
exit
npm install
ファイルが自動で作られる。
Viteでいろいろやる
プロジェクトディレクトリにvite.config.jsというファイルがあるのでそれを編集し、使用するcssやjsのパスを記述する。書き方は色々あるっぽい。
画像ファイルやjsファイルも同様に処理する。ここでは例としてcssファイルをあげる。
export default defineConfig({
plugins: [
laravel({
input: [
'resources/css/app.css',
'resources/js/app.js',
],
refresh: true,
}),
],
});
cssファイルをresources/cssに設置して以下を実行。
npm run build
publicにasset/cssが作られる。jsもcssもまるでコンパイラみたいになったな~。
Viewの記述
@vite("resources配下のパス")で記述する。
<html>
<head>
<title>@yield('title')</title>
@vite(resources/css/mycss.css)
</head>
<body>
~ 以下略 ~
以前のバージョン(8まで?)だと{{ asset('css/mycss.css') }}のように記述していたらしい。ややこしい。ViteではなくLaravel-mixを使っていたとかなんとか...。
<link rel="stylesheet" href="{{ asset('resource/css/mycss.css') }}">
参考