Beberapa hari tersisa sampai dimulainya kursus baru dari OTUS - "Framework Laravel" . Untuk mengantisipasi dimulainya kursus, kami membagikan bagian terakhir dari publikasi penulis tentang konsep-konsep dasar di Laravel. Penting: seri publikasi ini tidak terkait dengan program pendidikan kursus dan sedikit bahan yang berguna untuk pemula . Program kursus dapat ditemukan di sini .
Di
artikel terakhir
, kami mulai menulis galeri tempat pengguna dapat masuk dan mendaftar, membuat album dengan deskripsi, sampul, dan judul. Dalam aplikasi yang dibuat ada nilai utama dari
view kita dan sekarang perlu untuk sedikit memperluasnya.
Juga, kode yang ada patut sedikit ditingkatkan:
Kami sudah memiliki dua pengontrol -
AlbumController dan
ImageController . Tambahkan impor kelas tambahan yang bertanggung jawab untuk bekerja dengan string:
use Illuminate\Support\Str;
Dan ubah baris yang bertanggung jawab untuk menghasilkan nama gambar acak di basis data kami:
$random_name = Str::random(8);
Selain itu, sekarang ada baiknya sedikit mengubah kode migrasi untuk meningkatkan keandalan aplikasi kami, karena pengguna harus memiliki hak untuk membiarkan bidang
description kami kosong (jika tidak, Laravel with dynamite akan memberi tahu kami tentang kesalahan tersebut). Mari kita masuk ke migrasi yang terkait dengan tabel gambar, dan perbaiki di sana garis yang terkait dengan deskripsi gambar untuk yang ini:
$table->string('description')->nullable();
Nah, dengan "refactoring" aplikasi selesai. Selanjutnya, Anda harus menyelesaikan tampilan aplikasi kami. Buat formulir di mana pengguna dapat membuat album mereka:
file
addimage.blade.php @include('includes.header') <body> @include('includes.nav') <div class="container" style="text-align: center;"> <div class="span4" style="display: inline-block; margin-top:100px;"> @if (isset($errors) && $errors->has('')) <div class="alert alert-block alert-error fade in"id="error-block"> <?php $messages = $errors->all('<li>:message</li>'); ?> <button type="button" class="close"data-dismiss="alert">×</button> <h4>Warning!</h4> <ul> @foreach($messages as $message) {{$message}} @endforeach </ul> </div> @endif <form name="createnewalbum" method="POST"action="{{route('create_album')}}" enctype="multipart/form-data"> {{ csrf_field() }} <fieldset> <legend> </legend> <div class="form-group"> <label for="name"> </label> <input name="name" type="text" class="form-control"placeholder=" " value="{{old('name')}}"> </div> <div class="form-group"> <label for="description"> </label> <textarea name="description" type="text"class="form-control" placeholder=" ">{{old('descrption')}}</textarea> </div> <div class="form-group"> <label for="cover_image"> </label> {{Form::file('cover_image')}} </div> <button type="submit" class=«btn btn-default">!</button> </fieldset> </form> </div> </div> <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.2.4/jquery.min.js"></script> <script src="//netdna.bootstrapcdn.com/bootstrap/3.0.0-rc1/js/bootstrap.min.js"></script> </body> </html>
Biarkan saya mengingatkan Anda bahwa di
includes di bagian atas halaman kami memiliki navigasi dan perpustakaan yang digunakan, yang dijelaskan di bagian terakhir.
Selain itu, kita perlu menambahkan tampilan
album.blade.php @include('includes.header') <body> @include('includes.nav') <div class="container"> <div class="starter-template"> <div class="media"> <img class="media-object pull-left"alt="{{$album->name}}" src="/albums/{{$album->cover_image}}" width="350px"> <div class="media-body"> <h2 class="media-heading" style="font-size: 26px;"> :</h2> <p>{{$album->name}}</p> <div class="media"> <h2 class="media-heading" style="font-size: 26px;"> :</h2> <p>{{$album->description}}<p> <a href="{{route('add_image',array('id'=>$album->id))}}"><button type="button"class="btn btn-primary btn-large"> </button></a> <a href="{{route('delete_album',array('id'=>$album->id))}}" onclick="return confirm(' ?')"><button type="button"class="btn btn-danger btn-large"> </button></a> </div> </div> </div> </div> <div class="row"> @foreach($album->Photos as $photo) <div class="col-lg-3"> <div class="thumbnail" style="max-height: 350px;min-height: 350px;"> <img alt="{{$album->name}}" src="/albums/{{$photo->image}}"> <div class="caption"> <p>{{$photo->description}}</p> <p> : {{ date("d FY",strtotime($photo->created_at)) }}at {{ date("g:ha",strtotime($photo->created_at)) }}</p> <a href="{{route('delete_image',array('id'=>$photo->id))}}" onclick="returnconfirm(' ?')"><button type="button"class="btn btn-danger btn-small"> </button></a> <p> :</p> <form name="movephoto" method="POST"action="{{route('move_image')}}"> {{ csrf_field() }} <select name="new_album"> @foreach($albums as $others) <option value="{{$others->id}}">{{$others->name}}</option> @endforeach </select> <input type="hidden" name="photo"value="{{$photo->id}}" /> <button type="submit" class="btn btn-smallbtn-info" onclick="return confirm(' ?')"> </button> </form> </div> </div> </div> @endforeach </div> </div> <script src="//netdna.bootstrapcdn.com/bootstrap/3.0.0-rc1/js/bootstrap.min.js"></script> <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.2.4/jquery.min.js"></script> </body> </html>
Selain itu, kami dapat sedikit memperbarui perutean kami, misalnya, di
nav.blade.php :
<li><a href="{{URL::route('create_album_form')}}"> </a></li>
Ke opsi yang lebih baru dan lebih modis:
<li><a href="{{route('create_album_form')}}"> </a></li>
Di sisi lain, versi sebelumnya bekerja pada 6 Laravel. Jadi, kami sudah memiliki formulir di mana pengguna dapat menambahkan foto ke album, dan ada
view utama album kami. Selanjutnya, kita perlu menambahkan controller yang akan bertanggung jawab untuk memproses satu foto.
Jadi, kami membuat pengontrol yang bertanggung jawab untuk bekerja dengan foto individual:
php artisan make:controller ImageController
Jadi, apa yang harus ada dalam diri kita:
<?php namespace App\Http\Controllers; use Illuminate\Http\Request; use Illuminate\Support\MessageBag; use Validator;
Registrasi dan otorisasi
Saat ini, aplikasi kami hampir siap. Namun, kita masih perlu memperketat kemampuan untuk mendaftar dalam aplikasi kita, logout, dan login ke akun yang ada.
Pada bagian terakhir, kami telah menunjukkan bagaimana
includes/nav.blade.php . Karena kami ingin tombol
Login dan
muncul ketika pengguna belum mendaftar, dan tombol
Keluar ketika dia terdaftar di kami.
Jadi, ini adalah bagaimana kita sekarang melihat daftar di
includes/nav.blade.php :
<ul class="nav navbar-nav"> @if (Auth::check()) <li> <button type="button" class="btn btn-primary"> <!-- , -> --> {{{ Auth::user()->name}}} </button> </li> <li><a href="{{route('create_album_form')}}"> </a></li> @else <!-- --> <li><a href="{{route('register')}}"></a></li> <li><a href="{{route('login')}}"></a></li> @endif @if (Auth::check()) <!-- , --> <!-- --> <li> <a href="{{url('/logout') }}" onclick="event.preventDefault(); document.getElementById('logout-form').submit();"> </a> <form id="logout-form" action="{{ url('/logout') }}" method="POST" style="display: none;"> {{ csrf_field() }} </form> </li> @endif </ul>
Dengan menggunakan
Auth::check construction dan element
if else , kita dapat membuat perubahan dalam
view kita, tergantung pada apakah pengguna kita terdaftar atau tidak.
Namun, dengan perubahan pada
view sebelum membuat model dan pengontrol, kami menjalankan sedikit di depan mesin. Untuk membuat otentikasi kami, kami akan menggunakan semua solusi siap pakai dan cepat yang ada di Laravel 6.
Jadi, tentang model
Pengguna - kami akan menggunakan model yang ada di dalam kotak. Di satu sisi, itu jelas tidak cukup untuk aplikasi penuh, di sisi lain - saya tidak ingin membatasi diri pada lingkup satu aplikasi tertentu. Galeri seperti apa yang Anda inginkan? Di mana pengguna dapat membuat album pribadinya sendiri yang tidak dapat diakses oleh siapa pun? Atau di mana semua orang membagikan foto mereka? Kami tidak akan memiliki batasan dalam aplikasi kami - saya pikir pembaca akan dapat menyelesaikannya tanpa masalah dengan selera dan warnanya.
Jadi, di Laravel 6, membuat otentikasi menjadi lebih mudah. Kita pergi ke baris perintah aplikasi kita:
composer require laravel/ui —dev
Yang memberi kami paket yang diperlukan. Sekarang buat:
php artisan ui:auth
Apa yang diberikan tim ini kepada kita? Pertama, kami memiliki folder
auth baru dalam
resources/views , di mana kami memiliki semua
views yang mungkin diperlukan untuk mengotorisasi pengguna dan mendaftarkannya:
login ,
register dan
verify . Ada juga subfolder
passwords didedikasikan untuk mengatur ulang dan memulihkan kata sandi. Dalam folder
Http/Controllers , kami memiliki
HomeController , yang diperlukan untuk mengalihkan ke halaman rumah setelah pendaftaran pengguna. Kami juga akan memiliki
layouts subfolder, yang akan berisi
app.blade.php , yang tidak akan kami bongkar hari ini, tetapi ini bisa menjadi dasar yang sangat baik untuk aplikasi yang dibuat dari awal.
Templat blade yang dibuat sudah memiliki tata letak awal yang dirancang khusus untuk
Bootstrap . Kami sudah menghubungkannya di
header.blade.php .
Selain itu, kami telah memperbarui sedikit perutean di
routes/web.php . Baris berikut ditambahkan:
Auth::routes(); Route::get('/home', 'HomeController@index')->name('home'); Route::post('/logout', 'Auth\LoginController@logout')->name('logout');
Jalur ke
home dihasilkan secara otomatis, dan saya melakukan pengalihan untuk
logout sendiri.
Agar tata letak Anda berfungsi pada templat yang dihasilkan, kami akan menyambungkan
nav dan
header dengannya:
@include('includes.header') <body> @include('includes.nav') @extends('layouts.app')
Hebat, sekarang semuanya sudah siap. Cobalah mendaftar. Konfirmasi kata sandi juga harus berfungsi:
Di masa mendatang, pengguna dapat memilih halaman layanan mana yang ingin ia kunjungi (atau pembaca dapat membuat arahan sendiri, itu tidak terlalu sulit) Kami hanya perlu memperbaiki detail kecil: untuk membuatnya sehingga hanya pengguna terdaftar dan resmi yang dapat melihat album berharga kami.
Untuk melakukan ini, kami menambahkan kondisi ke perutean kami sehingga pengguna masuk untuk mengakses album.
Memperbarui
web.php kami:
Route::get('/', array('as' => 'index','uses' => 'AlbumsController@getList')) ->middleware('auth');; //middleware http Route::get('/createalbum', array('as' => 'create_album_form','uses' => 'AlbumsController@getForm')) ->middleware('auth');; // Route::post('/createalbum', array('as' => 'create_album','uses' => 'AlbumsController@postCreate')) ->middleware('auth');; // Route::get('/deletealbum/{id}', array('as' => 'delete_album','uses' => 'AlbumsController@getDelete')) ->middleware('auth');; // Route::get('/album/{id}', array('as' => 'show_album','uses' => 'AlbumsController@getAlbum')) ->middleware('auth');; //
Pada dasarnya, pada tahap ini kita sudah bisa menyelesaikannya. Saya akan menyerahkan kepada pembaca aplikasi apa yang ingin ia buat: dengan album pribadi atau dengan album publik. Secara teori, aplikasi ini sudah dapat digunakan jika Anda melihat kemungkinan registrasi dan membuat pengguna secara langsung di dalam basis data - misalnya, jika Anda dan kolega Anda akan mengatur album pribadi Anda dan karena alasan tertentu tidak ingin menggunakan layanan lain.
Terima kasih atas perhatian Anda! Seperti biasa, tautan bermanfaat: