Bài 6: Upload ảnh lên Database trong Laravel

Chức năng upload hình ảnh rất cần thiết trong mỗi website. Nó sẽ đưa các bức ảnh lên ở trong các bài viết. Sau đây mình sẽ hướng dẫn bạn tạo các tập tin theo mô hình MVC để đưa ảnh vào cơ sở dữ liệu Database.

Bước 1: Tạo một bảng là images với các cột là id và name. (Nhấp vào tab MySQL đưa đoạn code vào)

CREATE TABLE IF NOT EXISTS `images` (
`id` int(11) NOT NULL AUTO_INCREMENT,
`name` varchar(15) NOT NULL,
PRIMARY KEY (`id`)
) ENGINE=InnoDB DEFAULT CHARSET=utf8 COLLATE=utf8_general_ci AUTO_INCREMENT=1 ;

Bước 2: Tạo file ở trong Model là InsertModel.php

<?php

namespace App\Models;

use Illuminate\Database\Eloquent\Factories\HasFactory;
use Illuminate\Database\Eloquent\Model;


class InsertModel extends Model
{
    protected $table='images';  
    public $timestamps = false;
}

Bước 3: Tạo InsertController.php

<?php

namespace App\Http\Controllers;

use Illuminate\Http\Request;
use App\Models\InsertModel;
use DB;

class InsertController extends Controller
{
  public function insertform(){
    return view('insert');
}

  
public function insert_data(Request $request) {
    $request->validate([
                'file' => 'required|image|mimes:jpeg,png,jpg,gif,svg|max:2048',
            ]
        );
        $image = $request->file('file');
        $input['imagename'] = time().'.'.$image->getClientOriginalExtension();
        $destinationPath = public_path('/uploads');
        $image->move($destinationPath, $input['imagename']);
        $article = new InsertModel();
        $article->name = $input['imagename'];
        $article->save();
        
    }
}

Bước 4: Tạo insert.blade.php ở View

<!doctype html>
<html lang="en">

<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
    <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.5.0/css/bootstrap.min.css">

    <title>Laravel File Upload</title>
    <style>
        .container {
            max-width: 500px;
        }
        dl, ol, ul {
            margin: 0;
            padding: 0;
            list-style: none;
        }
    </style>
</head>

<body>

    <div class="container mt-5">
        <form action="create" method="post" enctype="multipart/form-data">
          <h3 class="text-center mb-5">Upload hình ảnh trong Laravel</h3>
            @csrf
            @if ($message = Session::get('success'))
            <div class="alert alert-success">
                <strong>{{ $message }}</strong>
            </div>
          @endif

          @if (count($errors) > 0)
            <div class="alert alert-danger">
                <ul>
                    @foreach ($errors->all() as $error)
                      <li>{{ $error }}</li>
                    @endforeach
                </ul>
            </div>
          @endif

            <div class="custom-file">
                <input type="file" name="file" class="custom-file-input" id="chooseFile">
                <label class="custom-file-label" for="chooseFile">Chọn ảnh</label>
            </div>

            <button type="submit" name="submit" class="btn btn-primary btn-block mt-4">
                Upload Files
            </button>
        </form>
    </div>

</body>
</html>

Bước 5: Tạo routes định tuyến

Route::get('insert','App\Http\Controllers\[email protected]');
Route::post('create','App\Http\Controllers\[email protected]_data');

Bước 6: Tạo thư mục uploads tại C:\xampp\htdocs\quachquynh\public

Truy cập vào http://localhost/quachquynh/public/insert chọn ảnh sau đó up lên. Tiếp theo mở bảng images trên Phpmyadmin để xem đã chèn vào chưa.

Cùng chủ đề

Chuyên mục:

Hãy để lại bình luận:

Mình rất vui khi bạn đã để lại một bình luận. Xin lưu ý rằng tất cả các bình luận đều được kiểm duyệt theo chính sách bảo mật và tất cả các liên kết đều là nofollow. KHÔNG sử dụng từ khóa trong trường tên. Hãy để lại một cuộc trò chuyện cá nhân và ý nghĩa. *