Memulai Cloud Storage di Web

Dengan Cloud Storage for Firebase, Anda dapat mengupload dan membagikan konten buatan pengguna, seperti gambar dan video, sehingga Anda dapat memperkaya aplikasi dengan konten multimedia. Data Anda disimpan dalam bucket Google Cloud Storage, yakni solusi penyimpanan objek berskala exabyte dengan ketersediaan tinggi dan redundansi global. Dengan Cloud Storage for Firebase, Anda dapat mengupload file tersebut secara langsung dari perangkat seluler dan browser web dengan aman, sehingga masalah jaringan yang kurang stabil dapat ditangani dengan mudah.

Sebelum memulai

  1. Jika belum melakukannya, pastikan Anda telah menyelesaikan panduan memulai untuk aplikasi web. Hal ini mencakup:

    • Membuat project Firebase.

    • Mendaftarkan aplikasi web Anda ke project, dan menghubungkan aplikasi ke Firebase dengan menambahkan Firebase JS SDK dan objek konfigurasi Firebase ke aplikasi Anda.

  2. Pastikan project Firebase Anda menggunakan paket harga Blaze bayar sesuai penggunaan. Jika Anda baru menggunakan Firebase dan Google Cloud, periksa apakah Anda memenuhi syarat untuk mendapatkan kredit sebesar $300.

Membuat bucket Cloud Storage default

  1. Dari panel navigasi Firebase console, pilih Storage.

    Jika project Anda belum menggunakan paket harga Blaze bayar sesuai penggunaan, Anda akan diminta untuk mengupgrade project.

  2. Klik Get started.

  3. Pilih lokasi untuk bucket default Anda.

  4. Konfigurasi Firebase Security Rules untuk bucket default Anda. Selama pengembangan, sebaiknya siapkan aturan Anda untuk akses publik.

  5. Klik Done.

Sekarang Anda dapat melihat bucket di tab File Cloud Storage di Firebase console. Format nama bucket default Anda adalah PROJECT_ID.firebasestorage.app.

Menyiapkan akses publik

Cloud Storage for Firebase menyediakan bahasa aturan deklaratif sehingga Anda dapat menentukan cara data disusun, diindeks, serta kapan data tersebut dapat dibaca dan ditulisi. Secara default, akses baca dan tulis pada Cloud Storage dibatasi, sehingga hanya pengguna terautentikasi yang dapat membaca atau menulisi data. Untuk memulai tanpa menyiapkan Authentication, Anda dapat mengonfigurasi aturan untuk akses publik.

Tindakan ini membuat Cloud Storage terbuka untuk siapa saja, bahkan orang yang tidak menggunakan aplikasi Anda. Oleh sebab itu, pastikan Anda membatasi Cloud Storage kembali saat menyiapkan autentikasi.

Tambahkan Cloud Storage JS SDK dan lakukan inisialisasi Cloud Storage:

Anda harus menentukan nama bucket Cloud Storage saat melakukan inisialisasi JavaScript SDK.

Anda dapat menemukan nama bucket Cloud Storage di tab File Cloud Storage di Firebase console. Bergantung pada waktu pembuatan bucket default, nama bucket akan menggunakan salah satu format berikut:

  • PROJECT_ID.firebasestorage.app (bucket default yang dibuat pada atau setelah 30 Oktober 2024)
  • PROJECT_ID.appspot.com (bucket default dibuat sebelum 30 Oktober 2024)

Lakukan inisialisasi SDK menggunakan cuplikan kode berikut:

Web 

import { initializeApp } from "firebase/app";
import { getStorage } from "firebase/storage";

// TODO: Replace the following with your app's Firebase project configuration
// See: https://firebase.google.com/docs/web/learn-more#config-object
const firebaseConfig = {
  // ...
  storageBucket: 'BUCKET_NAME'
};

// Initialize Firebase
const app = initializeApp(firebaseConfig);


// Initialize Cloud Storage and get a reference to the service
const storage = getStorage(app);

Web 

import firebase from "firebase/app";
import "firebase/compat/storage";

// TODO: Replace the following with your app's Firebase project configuration
// See: https://firebase.google.com/docs/web/learn-more#config-object
const firebaseConfig = {
  // ...
  storageBucket: 'BUCKET_NAME'
};

// Initialize Firebase
firebase.initializeApp(firebaseConfig);


// Initialize Cloud Storage and get a reference to the service
const storage = firebase.storage();

Anda siap untuk mulai menggunakan Cloud Storage.

Langkah berikutnya? Pelajari cara membuat referensi Cloud Storage.

Penyiapan lanjutan

Ada beberapa kasus penggunaan yang memerlukan penyiapan tambahan:

Kasus penggunaan pertama sangat cocok jika Anda memiliki pengguna di seluruh dunia dan ingin menyimpan datanya di dekat mereka. Misalnya, Anda dapat membuat bucket di Amerika Serikat, Eropa, dan Asia untuk menyimpan data bagi pengguna di region-region tersebut guna mengurangi latensi.

Kasus penggunaan kedua sangat membantu jika Anda memiliki data dengan berbagai pola akses. Misalnya: Anda dapat menyiapkan bucket multiregional atau regional yang menyimpan gambar atau konten lain yang sering diakses, dan bucket nearline atau coldline yang menyimpan cadangan pengguna atau konten lainnya yang jarang diakses.

Dalam salah satu kasus penggunaan ini, sebaiknya gunakan beberapa bucket Cloud Storage.

Kasus penggunaan ketiga berguna jika Anda membuat aplikasi yang memungkinkan pengguna untuk memiliki beberapa akun login (misalnya, akun pribadi dan akun kerja), seperti Google Drive. Anda dapat menggunakan instance Aplikasi Firebase kustom untuk mengautentikasi setiap akun tambahan.

Menggunakan beberapa bucket Cloud Storage

Jika Anda ingin menggunakan bucket Cloud Storage selain bucket default yang dijelaskan sebelumnya dalam panduan ini, atau menggunakan beberapa bucket Cloud Storage dalam satu aplikasi, Anda dapat membuat instance firebase.storage yang mereferensikan bucket kustom Anda:

Web

import { getApp } from "firebase/app";
import { getStorage } from "firebase/storage";

// Get a non-default Storage bucket
const firebaseApp = getApp();
const storage = getStorage(firebaseApp, "gs://my-custom-bucket");
storage_multiple_buckets.js

Web

// Get a non-default Storage bucket
var storage = firebase.app().storage("gs://my-custom-bucket");
index.js

Menangani bucket hasil impor

Saat mengimpor bucket Cloud Storage yang sudah ada ke Firebase, Anda harus memberikan izin kepada Firebase untuk mengakses file ini menggunakan alat gsutil, yang disertakan dalam Google Cloud SDK:

gsutil -m acl ch -r -u service-PROJECT_NUMBER@gcp-sa-firebasestorage.iam.gserviceaccount.com gs://BUCKET_NAME

Anda dapat menemukan nomor project seperti yang dijelaskan dalam pengantar project Firebase.

Hal ini tidak akan memengaruhi bucket yang baru dibuat karena bucket ini memiliki kontrol akses default yang ditetapkan untuk mengizinkan Firebase. Ini adalah tindakan sementara dan akan dilakukan secara otomatis di masa mendatang.

Menggunakan Aplikasi Firebase kustom

Jika Anda membuat aplikasi yang lebih rumit menggunakan firebase.app.App kustom, Anda dapat membuat instance firebase.storage.Storage yang diinisialisasi dengan aplikasi tersebut:

Web

import { getStorage } from "firebase/storage";

// Get the default bucket from a custom firebase.app.App
const storage1 = getStorage(customApp);

// Get a non-default bucket from a custom firebase.app.App
const storage2 = getStorage(customApp, "gs://my-custom-bucket");
storage_custom_app.js

Web

// Get the default bucket from a custom firebase.app.App
var storage = customApp.storage();

// Get a non-default bucket from a custom firebase.app.App
var storage = customApp.storage("gs://my-custom-bucket");
index.js

Langkah berikutnya