Beranda
Dokumentasi

Konfigurasi Firebase

Konfigurasikan proyek firebase untuk blog.
Admin

Beberapa plugin dalam templat ini bergantung pada Layanan Firebase, misalnya Realtime Database untuk Penghitung Tampilan Postingan, dll. Oleh karena itu, jika Anda ingin menggunakan salah satu plugin ini, Anda perlu mengonfigurasi Proyek Firebase dengan template blog.

Membuat Proyek Firebase

Jika Anda sudah memiliki Proyek Firebase yang dibuat sebelumnya, Anda dapat menggunakannya dan melewati langkah-langkah untuk membuat yang baru yang dijelaskan di bawah ini.

  1. Pergi ke Konsol Firebase.
  2. Klik + Create a project dan ikuti petunjuk untuk membuat proyek. Anda dapat memberi nama proyek apa pun yang Anda inginkan.
  3. Setelah proyek dibuat, navigasikan ke Project settings.
  4. Di bawah General > Your apps, klik </> Web dan ikuti petunjuk untuk membuat aplikasi Web dalam proyek tersebut.

Anda sekarang telah membuat Proyek Firebase untuk Aplikasi Web.

Menyiapkan Aturan Basis Data Realtime

Menambahkan aturan aman ke Realtime Database sangat penting karena aturan yang tidak aman mengizinkan akses read dan write basis data kepada siapa pun di internet, yang memungkinkan mereka membaca dan mengubah apa pun di dalam basis data. Oleh karena itu, kita perlu menambahkan batasan untuk memastikan seseorang tidak dapat membaca atau mengubah data tanpa izin. Ikuti langkah-langkah di bawah ini untuk melindungi basis data Anda.

  1. Buka Firebase Project > Realtime Database.
  2. Beralih ke tab Rules.
  3. Tempel JSON berikut dengan membuat perubahan yang sesuai di editor aturan dan klik Publish.

    Peringatan!
    Aturan yang diberikan dapat diperbarui di masa mendatang oleh tim kami jika ditemukan masalah kritis atau plugin baru tersedia. Disarankan untuk memperbarui aturan seperti di bawah ini secara berkala (minimal 3 bulan sekali) dengan mengunjungi halaman ini.
    Aturan terakhir diperbarui pada 1 September 2023 oleh Deo Kumar. 

    {
  "rules": {
    ".write": false,
    ".read": false,
    "blogs": {
      "$blog_id": {
        ".validate": "$blog_id.matches(/^\\d{18,22}$/) && ($blog_id === '000000000000000000' || $blog_id === '0000' || $blog_id === '0000')",
        "posts": {
          "$post_id": {
            ".validate": "$post_id.matches(/^\\d{18,22}$/)",
            "views": {
              ".read": true,
              ".write": "newData.exists()",
              ".validate": "newData.isNumber() && newData.val() % 1 === 0 && newData.val() === (data.exists() ? data.val() + 1 : 1)"
            }
          }
        }
      }
    }
  }
}
    {
  "rules": {
    ".read": true,
    ".write": true
  }
}

Mendapatkan Konfigurasi Firebase

Sekarang kita membutuhkan objek konfigurasi aplikasi web Proyek Firebase kita. Ikuti langkah-langkah berikut untuk menemukannya.

  1. Navigasi ke Firebase Project Anda.
  2. Buka Project Settings.
  3. Di bawah tab General > Your apps, pilih aplikasi web Anda dan klik Config. Anda akan melihat objek JavaScript yang terlihat seperti berikut: 
    const firebaseConfig = {
  apiKey: "xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx-xxxxx",
  authDomain: "xxxxxxxxxxxxx.firebaseapp.com",
  databaseURL: "https://xxxxxxxxxxxxx.firebaseio.com",
  projectId: "xxxxxxxxxxxxx",
  storageBucket: "xxxxxxxxxxxxx.appspot.com",
  messagingSenderId: "000000000000",
  appId: "1:000000000000:web:xxxxxxxxxxxxxxxxxxxxxx",
  measurementId: "G-XXXXXXXXXX",
};

    Jika kolom databaseURL tidak tersedia, berarti Anda belum membuat instans Realtime Database. Buat instans tersebut melalui bagian Realtime Database, lalu periksa ulang untuk memastikan kolom databaseURL tersedia.

Biarkan tab browser terbuka karena kami memerlukan informasi tentang objek ini.

Menyiapkan Konfigurasi Firebase

Sekarang kita akan menambahkan konfigurasi firebase ke blog kita.

  1. Buka Dasbor Blogger dan navigasikan ke Tata Letak.
  2. Temukan gadget Daftar Tautan dengan judul Firebase Configurations (jika Anda belum mengganti namanya), klik tombol Edit.
  3. Buat atau edit tautan yang ada untuk setiap pasangan kunci-nilai, kuncinya sebagai Nama situs dan nilainya (konten di bawah tanda kutip) sebagai URL Situs seperti yang ditunjukkan di bawah ini. 
    const firebaseConfig = {
  apiKey: "xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx-xxxxx",
  authDomain: "xxxxxxxxxxxxx.firebaseapp.com",
  databaseURL: "https://xxxxxxxxxxxxx.firebaseio.com",
  projectId: "xxxxxxxxxxxxx",
  storageBucket: "xxxxxxxxxxxxx.appspot.com",
  messagingSenderId: "000000000000",
  appId: "1:000000000000:web:xxxxxxxxxxxxxxxxxxxxxx",
  measurementId: "G-XXXXXXXXXX",
};
    Tautan Anda akan terlihat seperti yang ditunjukkan di bawah ini:
    Nama situs URL situs
    apiKey xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx-xxxxx
    authDomain xxxxxxxxxxxxx.firebaseapp.com
    databaseURL https://xxxxxxxxxxxxx.firebaseio.com
    projectId xxxxxxxxxxxxx
    storageBucket xxxxxxxxxxxxx.appspot.com
    messagingSenderId 000000000000
    appId 1:000000000000:web:xxxxxxxxxxxxxxxxxxxxxx
    measurementId G-XXXXXXXXXX
  4. Simpan gadget untuk menerapkan perubahan.

Selesai! Anda telah berhasil mengonfigurasi Proyek Firebase dengan blog Anda.

Posting Komentar