Tự học Laravel: (29) CERTIFICATION (PART 2)

Last time , I set up certification-related functions provided by Laravel. This time, while confirming the contents, add some corrections.

LAYOUT REPLACEMENT

Currently, both the layout file created by myself and the layout generated by artisan make: auth are used. Change the layout used in authentication related views to the layout you created.

resources/views/
├── layout.blade.php    //Created by myself
└── layouts
    └── app.blade.php   //Created by command artisan make:auth

Change the layout specification in all views under resouces/views/auth and resouces/view/home.blade.php.

{{-- @extends('layouts.app') --}}
@extends('layout') 
...

ROUTE FIX

By the addition of HomeController.php in artisan make: auth, there are duplicates where “home” is specified in named route. There are two places where I read Home and it is confusing. 
Fix this.

// routes/web.php
 
Route::get('/', 'ArticlesController@index')->name('home');
Route::get('/home', 'HomeController@index')->name('home');

In this tutorial we will name the ‘/’ named route ‘home’. In other words, speaking of home is a list of articles. The screen displayed after login is named dashboard.

Modify routes/web.php as follows:

// routes/web.php
 
Route::get('/', 'ArticlesController@index')->name('home');
// Route::get('/home', 'HomeController@index')->name('home');
Route::get('/dashboard', 'DashboardController@index')->name('dashboard');

CONTROLLER FIX

As we fix Route, we will also fix Controller.

MODIFY HOMECONTROLLER.PHP

Rename HomeController.php to DashboardController.php. 
The contents are also corrected as follows.

<?php
//app/Http/Controllers/DashboardController.php
 
namespace App\Http\Controllers;
 
use Illuminate\Http\Request;
 
// class HomeController extends Controller
class DashboardController extends Controller // ①
{
    public function __construct()
    {
        $this->middleware('auth');
    }
 
    public function index()
    {
        // return view('home');
        return view('dashboard'); // ②
    }
}
  1. the change Class name change the view name to call
  2. with it, home.blade.phpwo dashbord.blade.phpto change the file name.

FIX REDIRECT DESTINATION OF AUTHENTICATION RELATED CONTROLLER

After user registration and login, change the path displayed (redirected) after password reset. 
Modify all the following files:

  • RegisterController.php
  • LoginController.php
  • ResetPasswordController.php
// protected $redirectTo = '/home';
 
protected function redirectTo ()
{
    return route('dashboard');
}

NAVBAR FIXES

Add links to authentication related pages in Navbar. Also, change the displayed menu according to the login status.

{{-- resouces/views/navbar.blade.php --}}
 
<nav class="navbar navbar-expand-lg navbar-dark bg-dark">
  <div class="container"> 
    ...    
    <div class="collapse navbar-collapse" id="navbarSupportedContent">

      ...
 
      <ul class="navbar-nav">
        {{-- ① --}}
        @guest
          <li class="nav-item">
            {{-- ②  --}}
            <a class="nav-link" href="{{ route('login') }}">Login</a>
          </li>
          <li class="nav-item">
            {{-- ③ --}}
            <a class="nav-link" href="{{ route('register') }}">Register</a>
          </li>
        @else
          <li class="nav-item">
            {{-- ④ --}}
            <a class="nav-link" href="{{ route('dashboard') }}">Dashboard</a>
          </li>
 
          <li class="nav-item dropdown">
            <a class="nav-link dropdown-toggle" href="#" id="navbarDropdown" role="button" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
              {{-- ⑤ --}}
              {{ Auth::user()->name }} <span class="caret"></span>
            </a>
 
            <div class="dropdown-menu dropdown-menu-right" aria-labelledby="navbarDropdown">
              {{-- ⑥ --}}
              <a class="dropdown-item" href="#"
                onclick="event.preventDefault(); document.getElementById('logout-form').submit();">
                Logout
              </a>
 
              {{-- ⑦ --}}
              <form id="logout-form" action="{{ route('logout') }}" method="POST" style="display: none;">
                @csrf
              </form>
            </div>
          </li>
        @endguest
      </ul>
    </div>
  </div>
</nav>

Mainly correct the part of the right alignment menu.

  1. @guest is used to divide the menu display into guest (not logged in) and logged in.
  2. Specify the route to the login page for the link destination.
  3. Specify the link to the user registration page route. 
  4. Specify a link to the dashboard route. 
  5. Display the name of the logged in user. 
  6. It is written in javascript to submit 7 logout-form when clicked. 
  7. logout This is a form for sending a POST request to the root. Sent when 6 is clicked, the logout process is executed. 
    Here, instead of using the Form helper, the <form> tag is written directly, so you need to embed the CSRF countermeasure token yourself. Therefore, we write @csrf. This is replaced with a CSRF token. View the HTML source code in your browser to see how it was converted.

OPERATION CHECK

The correction is complete. Please check the sequence of actions.

  • user registration
  • Login
  • Logout
  • Resetting a password

Leave a Reply

Your email address will not be published.

This site uses Akismet to reduce spam. Learn how your comment data is processed.