Jika sebelumnya saya menjelaskan mengenai upload image menggunakan Amazon S3, pada artikel kali ini saya akan menjelaskan bagaimana cara mengupload image dengan menggunakan Cloudinary. Jika Amazon S3 adalah layanan premium maka kita bisa memanfaatkan Cloudinary ini sebagai alternatif nya karena layanan gratis yang disediakan oleh Cloudinary ini sudah cukup besar yaitu 10GB untuk storage.
Salah satu keunggulan menggunakan layanan Cloudinary ini adalah anda dapat menghemat space storage serta bandwidth dari hosting yang anda pakai. Anda dapat mengupload file seperti gambar dan video pada Cloudinary ini. Berikut ini adalah langkah-langkah yang harus anda lakukan :
#Membuat akun Cloudinary
Gunakan link berikut https://cloudinary.com/ dan lakukan registrasi. Isilah data-data yang diperlukan dan kemudian cek email anda untuk melakukan aktivasi akun. Setelah semua proses selesai anda akan melihat tampilan dashboard dari akun anda seperti gambar di bawah ini.
Dashboard Cloudinary |
Pada tampilan dashboard tersebut ada 3 informasi yang perlu anda simpan karena nantinya akan digunakan pada program laravel yaitu, Cloud name, API Key, dan API Secret.
#Menginstall Package jrm2k6/cloudder
Langkah selanjutnya adalah menginstall package yang sudah disediakan untuk memanipulasi data pada Cloudinary yaitu jrm2k6/cloudder. Caranya adalah dengan menjalankan perintah composer di bawah ini pada direktori program laravel anda
composer require jrm2k6/cloudder
Setelah proses tersebut selesai silahkan tambahkan kode di bawah ini pada file config/app.php.
'providers' => array(
'JD\Cloudder\CloudderServiceProvider'
);
'aliases' => array(
'Cloudder' => 'JD\Cloudder\Facades\Cloudder'
);
Seperti biasanya tambahkan providers pada bagian providers dan aliases pada bagian aliases seperti anda menginstall package laravel lainnya.
Kemudian jalankan perintah artisan di bawah ini pada command prompt direktori program anda
php artisan vendor:publish --provider="JD\Cloudder\CloudderServiceProvider"
Untuk lebih jelasnya dapat anda lihat pada gambar di bawah ini
Langkah terakhir yang perlu anda lakukan adalah menambahkan variabel pada file .env.
CLOUDINARY_API_KEY=xxxxx
CLOUDINARY_API_SECRET=yyyyy
CLOUDINARY_CLOUD_NAME=zzzzz
Isilah variabel-variabel tersebut dengan 3 informasi yang terdapat pada dashboard Cloudinary anda sebelumnya.
#Contoh Penggunaan pada Laravel
Berikut ini adalah contoh bagaimana melakukan upload Image pada Cloudinary
public function uploadCloudinary(Request $request){
Cloudder::upload($request->file('fileToUpload'));
// Cloudder::upload($request->file('fileToUpload'),null, ['folder' => 'Test/']);
$c=Cloudder::getResult();
dd($c);
}
Perintah dasar yang digunakan untuk melakukan upload adalah
Cloudder::upload($request->file('fileToUpload'));
Untuk mendapatkan hasil upload digunakan perintah berikut
Cloudder::getResult();
Disini saya menggunakan dd($c) untuk melihat nilai kembalian dari file yang saya upload. Berikut ini adalah hasil yang muncul
Pada gambar di atas dapat anda lihat terdapat informasi public_id, url, dan secure_url. Jika program anda menyimpan informasi gambar pada database maka data-data inilah yang menurut saya perlu anda simpan dalam database anda.
- public_id digunakan sebagai primary key dari image yang anda buat. Nantinya public_id yang akan digunakan jika anda ingin menghapus image tersebut atau mendapatkan informasi-informasi lainnya.
- url digunakan sebagai url yang menampilkan image yang anda upload pada Cloudinary
- secure_url sama dengan url hanya menggunakan https
Pada contoh kode di atas terdapat kode yang saya comment //. Kode tersebut digunakan jika anda ingin melakukan upload image ke dalam folder tertentu pada Cloudinary. Silahkan ubah nilai pada bagian folder dan sesuaikan dengan nama folder yang anda buat.
Sedangkan jika anda ingin menghapus image pada Cloudinary gunakan perintah berikut
Sedangkan jika anda ingin menghapus image pada Cloudinary gunakan perintah berikut
Cloudder::delete($publicId)
Dimana $publicId adalah public_id dari image yang ingin anda hapus.
Perintah-perintah lengkapnya jika misalnya anda membutuhkan hal-hal lainyya dapat anda baca pada link berikut https://github.com/jrm2k6/cloudder. Pada link tersebut diberikan informasi lengkap kode-kode perintah apa saja yang dimiliki oleh package tersebut.
Demikianlah artikel Tutorial Laravel 5.5 - Mengupload Image menggunakan CDN Gratis Cloudinary. Semoga penjelasan di atas dapat dimengerti dan selamat mencoba.
Tutorial Laravel 5.5 - Mengupload Image menggunakan CDN Gratis Cloudinary
Reviewed by Donny Winarto
on
August 25, 2018
Rating:
No comments: