Laravel Jetstreamの2段階認証を使う方法

こんにちは❗フリーランス・コンサルタント&エンジニアの 九保すこひ です。

さてさて、前回記事「Laravel8.x以降でログイン機能をインストールする方法」では、Laravel Jetstreamでログインまわりの機能を使えるようにしてみました。

もちろんJetstreamの一番大きな機能はログイン認証ですが、実はそれ以外にもたくさんの機能がついているのをご存知でしょうか。

そして、その中から今回ご紹介するのが・・・・・・

2段階認証 🔓

です。

2段階認証という言葉は、最近だとあるコンビニ大手のQRコード決済サービスで不正使用が相次いだというニュースの中で聞くことが多かったように思いますが、つまりセキュリティをより高めるシステムのことで、よく使われる形は次のようなものになります。

  1. メールアドレス&パスワードを送信
  2. スマホに送信されてくるワンタイムパスワードを入力して送信

そして、実はJetstreamではこの2段階認証が最初から使えるんですね😲

そこで❗
今回は、Jetstreamの2段階認証の使い方をご紹介したいと思います。

※というこで、今回は久しぶりにコードのお話は全くなしです。いつぶりでしょうか(笑)

「ホントになんでもやってくれる
Jetstreamさん、サンキューです👍」

実行環境: Laravel 8.x、Laravel Jetstream 1.0.2

前提として

もちろんLaravel Jetstreamがインストールされていることが条件ですが、さらに、実際にログインできるユーザーが登録されていることが前提です。

もしまだインストールしていない方は、以下を参考にしてやってみてくださいね。

Laravel8.x以降でログイン機能をインストールする方法

Authenticatorをスマホにインストールしておく

Authenticatorは、2段階目の認証に必要なワンタイムパスワードを教えてくれるアプリになります。

ということで今回はLaravelの説明でも登場するGoogle Authenticatorを使って進めていきたいと思います。

先に以下のリンクからアプリをインストールしておいてください。

2段階認証が使えるようにする

では、「https://******/login」にアクセスして、まずは通常どおりメールアドレス&パスワードでログインしてください。

するとダッシュボードが表示されますので、ページ右上にあるアイコンをクリックして、「Profile」をクリックしてください。

すると、プロフィールページの中ほどのところに「Two Factor Authentication」という項目があるので、すぐ横にある「ENABLE」ボタンをクリックして有効にします。

これで2段階認証が有効になりました😊

2段階認証を使ってログインしてみる

では、ここからは実際に2段階認証でログインをしてみましょう!

2段階認証を有効すると、以下のようにQRコードとリカバリー・トークンが表示されていると思います。

まずは、下に表示されている「リカバリー・トークン」(全部で8つあります)をコピーしてどこかに保存しておいてください。(これは、一度だけ使える復活パスワードです 🔓)

そして、先ほどインストールしたGoogle Authenticatorを起動してQRコードを読み取りましょう。

(すみません、アプリ側でスクショが取れない設定になっているので、画像はなしです・・・)

QRコードを読み取ると、6桁の数字が表示され、その右側に円グラフのようなタイムリミットが表示されていると思います。(つまり、この時間がすぎると新しい数字が表示されることになります)

では、この状態で一度ログアウトして、2段階認証を実行してみましょう。

まずは、メールアドレス&パスワードを送信します。

すると、今回は以下のように認証コードのフォームが表示されますので、現在スマホに表示されている認証コードを入力して送信してみてください。

すると・・・・・・

はい❗
先ほどと同じくログインができました。

これで、2段階認証がうまくいきましたね😊👍✨

毎回ワンタイムパスワードを入力するのはめんどうかもしれませんが、こうすることでとても強固なセキュリティを実現することができます。

リカバリー・コードを使ってログインする

では、先ほどコピーしておいたリカバリー・トークンを使ってログインする方法もご紹介しましょう。

リカバリー・トークンは1行ずつ全部で8つあると思います。
どのトークンでも有効なので、お好みで使っていただいて問題ありません。

では、やってみましょう。

まずはメールアドレス&パスワードを送信します。

すると、アプリを使ってログインしたときと同じく以下のフォームが表示されますが、今回は6桁の数字を入力せず「Use a recovery code」というリンクをクリックしてください。

すると、リカバリー・トークンを入力するフォームが表示されるので、今回はここに先ほどとっておいたリカバリー・トークンを入力して送信してください。

すると・・・・・

やはりログインができます😊👍

ご注意

ただし、注意が必要なのがリカバリー・トークンは一度だけしか使えないということです。そのため、今回8つのうち1つを使ってしまいましたので、残り7つだけが有効ということになります。

リカバリー・トークンを再発行する

先ほどご説明したとおりリカバリー・トークンを使ってログインしてしまうと、もうそのトークンは二度と使うことはできなくなってしまいます。

ただ、リカバリー・トークンはいつでも再発行することができるので、その方法もご紹介しましょう。

まず、何かしらでログインをして先ほど2段階認証を設定した項目のところへ移動してください。

すると、リカバリー・トークンが表示されているすぐ下に「REGENERATE RECOVERY CODES」というボタンがあるので、これをクリックするだけでOKです。

2段階認証を無効にする

一度有効にした2段階認証を無効にしたい場合は、リカバリー・トークンが表示されているすぐ下の「DISABLE」ボタンをクリックしてください。

お疲れ様でした😊✨

おわりに

ということで、今回はLaravel Jetstreamの2段階認証の使い方についてご紹介しました。

2段階認証は、アプリやショートメッセージとの連携が必要なのでなかなか複雑になりがちですが、Jetstreamを使えばインストールするだけで利用できるので、ありがたい限りですね。

あとは、日本語環境にするという作業が必要ですが、これも「resources/views/profile」フォルダの中にビューが入っているので、ここを変更すればOKです。(さすがに自動で全部翻訳してはくれないですが・・・)

インストールするだけで使えるので、ぜひ皆さんもやってみてくださいね。

ではでは〜❗

「子供の頃好きだった
おはじき飴が無性に食べたくなりました」

開発のご依頼お待ちしております 😊✨
開発のご依頼はこちらから: お問い合わせ
どうぞよろしくお願いいたします!
このエントリーをはてなブックマークに追加       follow us in feedly  

開発効率を上げるための機材・まとめ