Upload image bằng ajax trong laravel 6x

Bài này mình sẽ hướng dẫn các bạn upload hình ảnh bằng ajax trong laravel 6x.

Mình sẽ đi thẳng vào vấn đề luôn nhé. 

Cài đặt project 

  • Bước này cũng khá quen rồi nên mình không hướng dẫn nữa 
  • Các bạn tạo cho mình 1 project laravel 6x 
  • Sau đó run câu lệnh sau
php artisan serve

Connect cơ sở dữ liệu

Tiếp theo mình sẽ cấu hình csdl tuỳ thuộc vào thông số user và pass bên máy các bạn nhé.

DB_PORT=3306

DB_DATABASE=blog

DB_USERNAME=root

DB_PASSWORD=root

Tạo một bảng chứa ảnh images 

Mình sẽ tạo 1 bảng images bằng câu lệnh sau

php artisan make:migration create_images_table

Nội dung file migrate là 

Tạo model

Tiếp đến mình sẽ tạo models là Image nằm trong folder Models

php artisan make:model Models/Image

Nôi dung file Image là 

Create route

Nội dung route như sau 

Route::get('ajaxImageUpload', 'AjaxImageUploadController@ajaxImageUpload');
Route::post('ajaxImageUpload', 'AjaxImageUploadController@ajaxImageUploadPost')->name('ajaxImageUpload');

Tạo Controller

Các bạn tạo cho mình 1 controller AjaxImageUploadController với câu lệnh

 php artisan make:controller AjaxImageUploadController

với nội dung như sau.

Tạo view

Các bạn tạo cho mình 1 view ajaxImageUpload và nội dung như sau 

Demo xem kêt quả

Bạn run project 

php artisan serve

Sau đó bạn vào http://127.0.0.1:8000/ajaxImageUpload để upload và xem kết quả trong csdl xem đã lưu được dữ liệu chưa nhé.

Để lại comment của bạn nếu gặp khó khăn

Bài viết liên quan