Cara Praktis Mengintegrasikan Object Storage ke Flutter

Oleh Hazar Farras
Object Storage ke Flutter

Hai DomaiNesians! Pernah nggak, kepikiran gimana caranya integrasi object storage ke Flutter? Kalau iya, selamat! Kamu berada di tempat yang tepat. Kalau belum, nggak apa-apa kok, ini bakal tetap jadi perjalanan yang menarik buat kamu.

Di sini, kami nggak cuma ngomongin sekadar “integrasi object storage ke Flutter” tapi juga mengupas apa saja persyaratan teknis yang perlu kamu siapkan sebelum terjun ke dunia Flutter dan object storage. Mulai dari instalasi sampai penentuan dependensi yang sering bikin kening berkerut. Tenang, kami bakal bikin semua itu terasa ringan!

Lalu, setelah semuanya siap, lanjut ke langkah-langkah cloning script dari Git. Di bagian ini, kamu akan belajar gimana cara menyiapkan proyek Flutter biar bisa langsung dipakai buat mengunggah file ke object storage. Prosesnya nggak ribet, semua bakal diurai jadi langkah-langkah yang gampang diikuti.

Dan tentu saja, momen paling seru adalah melihat hasilnya, file kamu berhasil terunggah ke object storage, lengkap dengan URL yang bisa dipakai! Ada rasa puas tersendiri saat tahu semua proses yang lalui bekerja dengan sempurna.

Jadi, yuk mulai perjalanan ini dengan langkah pertama. Siapkan secangkir kopi, tarik napas, dan biarkan integrasi object storage ke Flutter jadi kombinasi sempurna buat menyelesaikan tugas upload file.

Object Storage ke Flutter
Sumber: Storyset

Persyaratan Integrasi Object Storage ke Flutter

Berikut adalah persyaratan untuk integrasi object storage ke Flutter, penting untuk keberhasilan proses integrasinya:

  • Kredensial object storage (access key dan secret key) –  dibutuhkan untuk autentikasi ke object storage. Ini seperti username dan password, tapi untuk aplikasi. Jangan lupa, kredensial ini harus disimpan dengan aman (misalnya di file .env atau menggunakan layanan pengelola rahasia).
  • Bucket object storage – bucket adalah wadah di object storage tempat file akan disimpan. Kamu perlu membuat bucket terlebih dahulu di konsol object storage.
  • Endpoint object storage – URL tempat bucket kamu bisa diakses, misalnya https://nama-bucket.s3.nevaobjects.id Kalau pakai penyedia lain (seperti MinIO atau Wasabi), mereka juga punya endpoint yang serupa.
  • Flutter SDK yang memadai – pastikan Flutter SDK sudah diinstal (versi terbaru lebih baik). Versi minimum tergantung library yang kamu gunakan, seperti flutter 3.x.
  • Paket HTTP atau library pendukung – gunakan library seperti dio atau http untuk menangani upload file, atau library khusus seperti flutter-s3-uploader jika ingin lebih praktis.
  • File yang akan diunggah – file apa yang mau kamu upload? Pastikan file itu ada di perangkat atau sudah bisa diakses melalui path tertentu.
  • Pre-signed URL (opsional) – kalau nggak mau langsung memberikan kredensial ke aplikasi, kamu bisa buat URL khusus dengan waktu kadaluarsa tertentu, sehingga file bisa diunggah tanpa autentikasi langsung ke object storage.

Dengan memenuhi persyaratan ini, kamu sudah siap untuk memulai integrasi object storage ke Flutter! 

Langkah-langkah Integrasi Object Storage ke Flutter

Berikut adalah langkah-langkah lengkap untuk membuat bucket di object storage DomaiNesia, meng-clone script uploader Flutter dari Git, hingga menghasilkan output upload file ke object storage. Kami akan menjelaskan dengan detail agar bisa langsung diimplementasikan.

1. Membuat Bucket di Object Storage DomaiNesia

Sebelum bisa upload file, kamu harus punya bucket sebagai tempat penyimpanannya. Begini caranya:

  • Masuk ke MyDomaiNesia dapat dilakukan dari URL https://my.domainesia.com/
  • Kelola object storage DomaiNesia dari menu My Services.

Object Storage ke Flutter

  • Pilih menu Buckets, tuliskan nama bucket sesuai kebutuhan (contoh: Flutter, Test) kemudian klik Create.

Object Storage ke Flutter

  • Setelah itu pindah ke menu Access Keys, untuk membuat kode akses ke bucket yang sudah dibuat. Isi Access Key Label sesuai kebutuhan (contoh: Flutter, Main) dan kemudian klik Create. Disini akan memunculkan detail access key dan secret key untuk kredensial akses object storage kamu. Catat nama bucket dan access key serta secret key, ini penting untuk konfigurasi di Flutter nanti.

Object Storage ke Flutter

Object Storage ke Flutter

2. Clone Script Uploader Flutter dari Git

Sekarang akan mengambil script uploader Flutter dari GitHub dan menjalankannya di VSCode. Berikut tahapan dan penjelasan beberapa scriptnya: 

  • Pastikan kamu sudah menginstal VSCode dan ekstensi Flutter di komputermu.
  • Buka terminal di VSCode dan jalankan perintah clone github berikut:

Object Storage ke Flutter

Ganti URL dengan alamat repo yang berisi script uploader object storage ke Flutter.

  • Buka folder proyek dengan klik File > Open Folder, lalu pilih folder hasil clone tadi.
  • Install dependensi yang diperlukan dengan jalankan perintah berikut di terminal untuk mengunduh library yang diperlukan:

Object Storage ke Flutter

Catatan: github yang digunakan khusus untuk testing upload file dari Flutter ke object storage, jika kamu sudah memiliki script Flutter sebelumnya, silakan bisa fokus pada logika dalam penerapan kredensial object storagenya.

3. Konfigurasi Script untuk Koneksi ke S3

Setelah script terclone, buka file konfigurasi s3_uploader_test.dart pada folder test. Berikut konfigurasi yang perlu dilakukan: 

  • Di awal script, silakan sesuaikan detail kredensial dan bucket seperti contoh berikut: 

Object Storage ke Flutter

  • accessId dan secretId – kredensial untuk mengakses bucket object storage. Sangat penting untuk tidak menyimpan informasi ini secara langsung dalam kode produksi (gunakan variabel lingkungan atau pengelola rahasia).
  • bucketName – nama bucket object storage tempat file akan diunggah.
  • region – wilayah object storage (dalam skrip ini dibiarkan kosong).
  • endPoint – URL endpoint untuk bucket object storage.

 

  • Script fungsi untuk mencetak progres pengiriman diatur dalam bagian berikut:

Fungsi ini menerima dua parameter, yaitu:

  • count – jumlah byte yang telah diunggah.
  • total – total byte yang akan diunggah.

Ini untuk menghitung dan mencetak progres pengiriman file dalam bentuk persentase.

  • Script test case debugging upload ke object storage, pada bagian berikut:

Fungsi test adalah unit test yang menguji pengunggahan file ke object storage menggunakan paket flutter-s3-uploader.

  • Sesuaikan script membuka file untuk diunggah, ada pada bagian: 

Contohnya, membuka file lokal dengan jalur test/test-upload.jpg. File ini harus ada di lokasi yang sesuai agar pengujian berhasil.

  • Setelah itu sesuaikan juga script mengunggah file ke object storage, seperti contoh berikut:

Parameternya sebagai berikut:

  • file – file lokal yang akan diunggah.
  • imagePathInS3Bucket – jalur file di bucket object storage setelah diunggah.
  • expirationTime – waktu kadaluarsa dalam detik (1 hari di sini).
  • onSendProgress – fungsi callback untuk mencetak progres unggahan.

4. Jalankan Aplikasi Flutter

Saatnya mencoba script uploader langsung dari VSCode, dengan klik Run pada editing script, atau klik icon run di kanan atas. Tunggu beberapa saat dan hasil akan keluar pada bagian bawah tampilan VSCode, seperti contoh dibawah ini. 

Object Storage ke Flutter

5. Cek Output di Bucket Object Storage

Setelah proses upload selesai, kamu bisa memeriksa apakah file berhasil diunggah ke object storage dengan akses menggunakan aplikasi Cyberduck atau lainnya seperti informasi dalam artikel Panduan Cara Mengakses Object Storage (Nevaobjects).

Object Storage ke Flutter

Jika berhasil, kamu akan melihat file yang diupload muncul di dalam bucket, dengan nama dan struktur folder yang sesuai.

Kesimpulan

Nah, sampai di sini, kamu sudah tahu langkah demi langkah mulai dari persyaratan dasar Flutter untuk upload ke object storage, cara clone script dari Git, hingga menikmati hasil file yang berhasil terunggah di bucket object storage. Gimana, seru kan?

Prosesnya mungkin kelihatan teknis di awal, tapi setelah dicoba, semuanya akan terasa lebih mudah. Yang terpenting adalah kamu memahami alur dan mampu memodifikasi sesuai kebutuhan proyekmu. Setelah ini, nggak cuma integrasi object storage ke Flutter, kamu bahkan bisa mengembangkan fitur-fitur keren lain untuk aplikasi Fluttermu.

VPS Managed

 

Tapi ingat, semakin canggih aplikasi kamu, semakin penting infrastruktur yang mendukung. Kalau kamu butuh solusi server yang stabil untuk proyekmu, kami punya penawaran menarik nih, paket VPS Managed dengan performa tinggi dan dukungan teknis 24/7. Jadi, kamu bisa fokus ngoding tanpa pusing urusan server. Mau coba? Yuk, ngobrol lebih lanjut!

Hazar Farras

Hi ! I'm a Technical Content Specialist in DomaiNesia. Passionate about challenges, technology enthusiast, and dedicated K-pop lover always exploring new horizons and trends

Berlangganan Artikel

Dapatkan artikel, free ebook dan video
terbaru dari DomaiNesia

{{ errors.name }} {{ errors.email }}
Migrasi ke DomaiNesia

Migrasi Hosting ke DomaiNesia Gratis 1 Bulan

Ingin memiliki hosting dengan performa terbaik? Migrasikan hosting Anda ke DomaiNesia. Gratis jasa migrasi dan gratis 1 bulan masa aktif!

Ya, Migrasikan Hosting Saya

Hosting Murah

This will close in 0 seconds