Laravelを使ってみよう-7 ログイン認証機能を作る

2022年09月09日

ログイン認証機能を作る

今まではLaravelの仕組みについて勉強してきました。ちょうど「一応作業何をやっていたかわかるようにしてほしい」と言われたので簡単な日報的なものを作ろうと思います。

記録するためのフィールドにするために前回行なっていたマイグレーションを実行して「id」「得意先」「作業内容」「作業時間」「備考」と「作成ユーザーid」のフィールドを作成しました。

今更ですが最初データベースを勉強した時に、テーブルの項目をフィールドと勉強したのでフィールドと表記してましたが、一般的には「カラム」というみたいですね。これからはそうします。

「作成ユーザーid」のカラムを作成した時に「ということはログイン機能がいるな」と思い出したのと、リレーションを組んで検索などもできるようにならないといけないことを思い出しました。覚えることが多いですね。

ということで今回は友人からも簡単だと言われていた、「ログイン認証機能」を作っていきたいと思います。

ログイン機能を有効化する

普通にphpでログイン機能を作ろうとしたら、アカウントとパスワードを入れるフォームを作ってpostでプログラムに投げてパスワードはハッシュ化してデータベースで照合して、しかも入力値はエスケープして必須項目はバリデーションでなんたらかんたら…

どこまでやっても不十分な気分になるので憂鬱なのですが、Laravelには何かがあるみたいです。

すっかりお馴染みプロジェクトのディレクトリでコマンドを実行します。

php artisan make:auth
   ERROR  Command "make:auth" is not defined. Did you mean one of these?  

  ⇂ make:cast  
  ⇂ make:channel  
  ⇂ make:command  
  ⇂ make:component  
  ⇂ make:controller  
  ⇂ make:event  
  ⇂ make:exception  
  ⇂ make:factory  
  ⇂ make:job  
  ⇂ make:listener  
  ⇂ make:mail  
  ⇂ make:middleware  
  ⇂ make:migration  
  ⇂ make:model  
  ⇂ make:notification  
  ⇂ make:observer  
  ⇂ make:policy  
  ⇂ make:provider  
  ⇂ make:request  
  ⇂ make:resource  
  ⇂ make:rule  
  ⇂ make:scope  
  ⇂ make:seeder  
  ⇂ make:test  

あれ…エラーが出てしまいましたね。10分でできるというからワクワクしながら実行したのですが…

“make auth”というコマンドはないけど下記のどれのつもりですか?みたいな意味ですね。

スポンサーリンク

Laravel6からmeke:authは使えない

エラー内容を調べたらLaravel6からは使えないみたいです。残念…

変わりに別のコマンドを使用します。

composer require laravel/ui

エラー出ず。出たらもっと根本的なものをインストールする必要があるみたいです。次に、

php artisan ui vue --auth

こちらを実行すると、認証画面のviewファイルを作成できるようです。

作成できました。最後にWARNとのことでnpmとnpm run devを実行してくれとのことなので実行します。

npm install && npm run dev

ここでも実はエラーが出ていたのですが、これはHomebrewをインストールするときにnode.jsもインストールしてください!って出ていたのを省略してしまっていたから出たエラーでした。

やはり横着してはいけない…インストール方法はこちらのページのコマンドをそのままでできました。今回の話題に直接関係ないので省略。ここも横着。

やっとログイン機能で遊べる!と思ってビルトインサーバーを起動して右上にできたloginのリンクからログインしてみようと思ったらまたエラー。

Vite manifest not found at: /Path to project/public/build/manifest.json

わからなさすぎてスクリーンショットも撮れませんでした。原因と解決策はこちらのサイトを参照しました

スポンサーリンク

Laravelのバージョンアップによる仕様変更と、それに伴ってNode.jsの違うコマンドも追加で実行しないと、ビルトインサーバーで動かした時にせっかくインストールしたnpmがインストールされていない扱いになってしまっているようです。

頭がおかしくなりそうです…

上記でnpm run devを実行した後に別でターミナルを開き、プロジェクトディレクトリに移動してからnpm run buildを実行することでビルトインサーバーでも動くようになりました。

さいごに

簡単と言われていたのにバージョンアップのせいでかなり苦戦しましたが、自力で作るよりは楽でしょうか。無駄にインストールしたりファイルが増えるのがあまり好みではありませんね…。

次回こそは日報を入力できるフォームを作っていきたいと思います。

お知らせ

株式会社プラン・ドゥでは展示会の設営や販促品やホームページなど販促に関わるサービスの販売を行なっております。
展示会などでのノベルティなど豊富に取り揃えております。

取扱商品はこちらからご覧いただけます。
http://plando-inc.co.jp/product

同じカテゴリの記事

関連記事

スポンサーリンク

DTP

Laravel開発

wordpressカスタマイズ

デジタルマーケティング

ライフハック

動画

当社製品について

Contact各種お問い合わせ

お問い合わせ・ご相談など
まずはお気軽にご相談ください

お仕事のご依頼やご相談、弊社サービス内容に関してなど、お気軽にご相談ください。

トップページ コラム 各種お問い合わせ プライバシーポリシー