Laravel
809
w3alert.com
10-01-2020
In the previous tutorial, you have learned how to insert, update, read, delete data from MySQL database table. And create CRUD (Create, Read, Update, Delete) web application in Laravel.
In this tutorial, you will learn how to upload files/images into the database table and folder. Also, you will learn how to validate files/images on the server before uploading it into the folder and before inserting it into the database table.
First Step, you need to download or install laravel web application new setup on your local machine. you can use the following command to download or install laravel application new setup:
composer create-project laravel/laravel Laravel-File-Upload –-prefer-dist
If you want to install a specific version of laravel, you can follow the following tutorial
https://w3alert.com/laravel-tutorial/laravel-install-on-windows-ubuntu-with-composer
After that, you will set up the database credentials in .env file. So open your .env file and update database credentials following:
DB_CONNECTION=mysql DB_HOST=127.0.0.1 DB_PORT=3306 DB_DATABASE=database_name DB_USERNAME=root DB_PASSWORD=root
Next, we need to create a model and migration in your laravel web application using the php artisan make:model model_name -m. So run the following command in your project root directory.
Go to the command prompt
cd/project_root_directory
php artisan make:model Document -m
after that, go to database/migrations/ and find created migration file and add fields, as you want to in your database table.
Your migration file looks like:
<?php use Illuminate\Database\Migrations\Migration; use Illuminate\Database\Schema\Blueprint; use Illuminate\Support\Facades\Schema; class CreateDocumentsTable extends Migration { /** * Run the migrations. * * @return void */ public function up() { Schema::create('documents', function (Blueprint $table) { $table->bigIncrements('id'); $table->string('file_name'); $table->timestamps(); }); } /** * Reverse the migrations. * * @return void */ public function down() { Schema::dropIfExists('documents'); } }
And go to the app/ directory and find the model file.
Your model file looks like:
<?php namespace App; use Illuminate\Database\Eloquent\Model; class Document extends Model { // }
Before you will run php artisan migrate command. Go to app/providers/AppServiceProvider.php and update the below code :
.. use Illuminate\Support\Facades\Schema; .... function boot() { Schema::defaultStringLength(191); } ...
Next, go to command prompt and run the following command:
php artisan migrate OR php artisan migrate:fresh
This php artisan migrate command creates a table in your database.
Next step, go to routes/web.php file and update the following routes into your file:
//display file uploading form Route::get('file','[email protected]'); //insert files/images into mysql database table laravel Route::post('file-upload','[email protected]');
Now, you need to generate or create a controller file using artisan command, so use the php artisan make:controller command and generate/create a new controller file:
php artisan make:controller FileController
In this controller file, we will create 2 methods for display file uploading form and store file into database and folder in laravel web application.
After that, go to App/Http/Controllers/ directory and find the created FileController file and update the following code into your file:
<?php namespace App\Http\Controllers; use Illuminate\Http\Request; use Validator,Redirect,Response,File; Use App\Document; class FileController extends Controller { public function index() { return view('file-upload'); } public function fileSave() { request()->validate([ 'fileName' => 'required', 'fileName.*' => 'mimes:doc,docx,pdf,txt,jpeg,png,jpg,gif,svg' ]); if ($files = $request->file('fileName')) { $destinationPath = 'public/document/'; // upload path $fileName = date('YmdHis') . "." . $files->getClientOriginalExtension(); $files->move($destinationPath, $fileName); $insert['file_name'] = "$fileName"; } $check = Document::insertGetId($insert); return Redirect::to("file-upload") ->withSuccess('File has been uploaded.'); } }
Next, you need to create a blade views file, so go resource/views directory and create the following blade views file.
Go to resource/views/ then create a new file name file-upload.blade.php and update the following code:
<html lang="en" class=""> <head> <meta charset="UTF-8"> <title>Laravel File Upload Example Tutorial </title> <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/4.1.3/css/bootstrap.min.css" /> </head> <body> <div class="container"> <div class="row justify-content-center"> <div class="card"> <div class="card-header">Laravel Upload File Example</div> <div class="card-body"> @if ($message = Session::get('success')) <div class="alert alert-success alert-block"> <button type="button" class="close" data-dismiss="alert">×</button> <strong>{{ $message }}</strong> </div> @endif @if (count($errors) > 0) <div class="alert alert-danger"> <strong>Whoops!</strong> There were some problems with your input.<br><br> <ul> @foreach ($errors->all() as $error) <li>{{ $error }}</li> @endforeach </ul> </div> @endif <form action="{{ url('/file-upload') }}" method="post" enctype="multipart/form-data"> @csrf <div class="form-group"> <input type="file" class="form-control-file" name="fileName" id="fileName" aria-describedby="fileHelp"> <small id="fileHelp" class="form-text text-muted">Please Choose file</small> </div> <button type="submit" class="btn btn-primary">Submit</button> </form> </div> </div> </div> </div> </html>
You can use the following command artisan command to start the development server:
php artisan serve
The final step, go to your browser and type the below-given URL into your browser:
http://localhost:8000/file OR http://localhost/Laravel-File-Upload/public/file
This tutorial idea has taken from the following urls: