Laravel excel bilah kemajuan impor

Unggah file ajax Laravel 8 dengan tutorial progress bar. Dalam tutorial ini, kami akan menunjukkan cara membuat bilah progres ajax untuk mengunggah file di aplikasi laravel 8

Bilah kemajuan adalah salah satu cara terbaik untuk menampilkan status operasi yang sedang berlangsung. Dalam contoh ini, mari kita belajar membuat bilah progres menggunakan jQuery sambil mengunggah file melalui AJAX. Opsi input file digunakan untuk memilih file dan binari file diposting ke server melalui AJAX

Status progres menampilkan sisa waktu untuk mengupload file. Jadi tutorial Pengunggahan File Ajax dengan Bilah Kemajuan di Laravel 8 ini akan menunjukkan kepada Anda tentang cara mengunggah file dengan bilah kemajuan menggunakan ajax di aplikasi laravel 8

Laravel 8 File Ajax Upload Progress Bar Contoh

• Langkah 1 – Instal Aplikasi Laravel 8
• Langkah 2 – Menghubungkan Aplikasi ke Database
• Langkah 3 – Buat Migrasi dan Model
• Langkah 4 – Tambahkan Rute
• Langkah 5 – Buat Pengontrol oleh Artisan
• Langkah 6 – Buat Tampilan Blade
• Langkah 7 – Jalankan Server Pengembangan
• Langkah 8 – Uji Aplikasi Ini

Langkah 1 – Instal Aplikasi Laravel 8

Pertama-tama, Jalankan perintah berikut di terminal untuk menginstal atau mengunduh aplikasi laravel 8

cd xampp\htdocs

Then

composer create-project --prefer-dist laravel/laravel Blog

Langkah 2 – Menghubungkan Aplikasi ke Database

Pada langkah ini, Arahkan ke bilah progres unggah file laravel yang Anda unduh menggunakan direktori root aplikasi ajax dan buka. env. Kemudian tambahkan detail basis data Anda. env, sebagai berikut

 DB_CONNECTION=mysql 
 DB_HOST=127.0.0.1 
 DB_PORT=3306 
 DB_DATABASE=here your database name here
 DB_USERNAME=here database username here
 DB_PASSWORD=here database password here

Direkomendasikan. - Tutorial Pengunggahan Gambar Laravel 8

Langkah 3 – Buat Migrasi dan Model

Pada langkah ini, buka prompt perintah dan jalankan perintah berikut

php artisan make:model Doc -m

Perintah ini akan membuat satu nama model Doc. php dan juga satu file migrasi untuk tabel Docs

Kemudian Arahkan ke folder database/migrations dan buka create_docs_table. php. Kemudian perbarui kode berikut menjadi create_docs_table. php

increments('id');
            $table->string('title');
            $table->timestamps();
        });
    }

    /**
     * Reverse the migrations.
     *
     * @return void
     */
    public function down()
    {
        Schema::dropIfExists('docs');
    }
}

Setelah itu, jalankan perintah berikut untuk memigrasikan tabel ke database pilihan Anda

php artisan migrate

Direkomendasikan. - Pengunggahan Gambar Ajax Laravel 8 dengan Tutorial Pratinjau

Langkah 4 – Buat Rute Untuk File

Pada langkah ini, Arahkan ke direktori aplikasi dan buka web. file php. Kemudian perbarui rute berikut ke web. file php

  use App\Http\Controllers\UploadFileController;

  Route::get('ajax-file-upload-progress-bar', [UploadFileController::class, 'index']);
  Route::post('store', [UploadFileController::class, 'store']);

Langkah 5 – Hasilkan Pengontrol oleh Artisan

Pada langkah ini, jalankan perintah berikut di terminal untuk membuat file pengontrol upload file ajax

php artisan make:controller UploadFileController

Perintah ini akan membuat pengontrol bernama UploadFileController. file php

Selanjutnya, Arahkan ke folder app/http/controllers/ dan buka UploadFileController. php. Kemudian tambahkan metode pengunggahan file berikut ke dalam UploadFileController Anda. file php

validate([
            'file' => 'required',
        ]);

       $title = time().'.'.request()->file->getClientOriginalExtension();
 
       $request->file->move(public_path('docs'), $title);

       $storeFile = new Doc;
       $storeFile->title = $title;
       $storeFile->save();
 
        return response()->json(['success'=>'File Uploaded Successfully']);
    }
}

Direkomendasikan. - Laravel 8 Ajax Tutorial Pengunggahan Banyak Gambar

Langkah 6 – Buat Tampilan Blade

Pada langkah ini, buat satu file tampilan blade bernama progress-bar-file-upload. Pedang. php

Sekarang, navigasikan /resources/views dan buat satu nama file progress-bar-file-upload. Pedang. php. Kemudian perbarui kode berikut ke dalam unggahan-file-bilah-progres Anda. Pedang. file php

Laravel 8 Progress Bar File Upload Using Ajax Tutorial



@csrf





0%

Direkomendasikan. - Contoh Tutorial Upload File Livewire Laravel 8

Langkah 7 – Jalankan Server Pengembangan

Sekarang, jalankan perintah berikut di terminal untuk memulai server pengembangan untuk file laravel 8 ajax Anda dengan aplikasi progress bar

 php artisan serve
If you want to run the project diffrent port so use this below command 
php artisan serve --port=8080  

Jika Anda ingin menghapus public atau public/index. php dari URL Di laravel, Klik Saya

Langkah 8 – Uji Aplikasi Ini

Sekarang, buka browser Anda dan tekan URL berikut ke dalamnya

 DB_CONNECTION=mysql 
 DB_HOST=127.0.0.1 
 DB_PORT=3306 
 DB_DATABASE=here your database name here
 DB_USERNAME=here database username here
 DB_PASSWORD=here database password here

Kesimpulan

Pengunggahan file ajax Laravel 8 menggunakan ajax di laravel 8 contoh tutorial, Anda telah belajar cara mengunggah file dengan progres menggunakan ajax di aplikasi laravel 8