Buka konsol

Konfigurasi Penerapan

File firebase.json

Perintah firebase init membuat file setelan firebase.json di root direktori project Anda. File yang wajib ada ini digunakan untuk mengonfigurasi file mana yang akan dipublikasikan setelah penerapan. Konfigurasi Firebase Hosting pada firebase.json akan terlihat seperti ini:

{
  "hosting": {
    "public": "app",
    "ignore": [
      "firebase.json",
      "**/.*",
      "**/node_modules/**"
    ]
  }
}

Properti default

Properti default—public dan ignore—dijelaskan secara detail di bawah ini.

public

"public": "app"

wajib — Setelan public memberi tahu perintah firebase direktori mana yang perlu diupload ke Firebase Hosting. Direktori ini harus berada di dalam direktori project dan wajib ada. Nilai defaultnya adalah direktori dengan nama "public".

ignore

"ignore": [
  "firebase.json",
  "**/.*",
  "**/node_modules/**"
]

opsional — Setelan ignore adalah parameter opsional yang menentukan file yang akan diabaikan saat penerapan. Setelan ini dapat menangani definisi glob dengan cara yang sama seperti git menangani .gitignore.

Properti lanjutan

File firebase.json memiliki beberapa parameter opsional lainnya untuk konfigurasi Hosting. Anda dapat melihat file firebase.json konfigurasi Hosting selengkapnya di sini, sementara parameter opsional ini dijelaskan secara detail di bawah.

redirects

"redirects": [ {
  "source" : "/foo",
  "destination" : "/bar",
  "type" : 301
}, {
  "source" : "/firebase/*",
  "destination" : "https://www.firebase.com",
  "type" : 302
} ]

opsional — Setelan redirects adalah parameter opsional yang berisi serangkaian aturan pengalihan. Setiap aturan harus menentukan source, destination, dan type.

Parameter source adalah pola glob yang dicocokkan dengan semua lokasi URL di awal setiap permintaan (sebelum keberadaan file atau folder di lokasi tersebut ditentukan). Jika kecocokan ditemukan, respons pengalihan HTTP ditentukan dengan header "Location" yang disetel ke string destination statis yang bisa berupa lokasi relatif maupun URL mutlak.

Terakhir, parameter type menentukan kode respons HTTP tertentu yang disajikan dan bisa berupa 301 untuk 'Pengalihan Permanen' atau 302 untuk 'Ditemukan' (Pengalihan Sementara).

Menangkap pengalihan

Terkadang, kita perlu menangkap sebagian URL sumber dari suatu pengalihan dan menggunakannya kembali di tujuan. Anda dapat melakukannya dengan menggunakan prefiks : untuk mengidentifikasi segmen dan * opsional setelah tulisan nama untuk menunjukkan bahwa bagian dari URL tersebut perlu ditangkap:

"redirects": [ {
  "source": "/blog/:post*",
  "destination": "https://blog.myapp.com/:post*",
  "type": 301
},
{
  "source": "/users/:id/profile",
  "destination": "/users/:id/newProfile",
  "type": 301
} ]

rewrites

"rewrites": [ {
  "source": "**",
  "destination": "/index.html"
} ]

opsional — Setelan rewrites adalah parameter opsional yang berisi serangkaian aturan penulisan ulang URL. Sama seperti pengalihan di atas, setiap aturan penulisan ulang harus memiliki pola glob source dan destination lokal (yang harus ada dan berupa file). Aturan penulisan ulang hanya diterapkan jika file atau folder tidak ada di sumber yang ditentukan dan mengembalikan konten file aslinya di tujuan, bukannya pengalihan HTTP.

Contoh di atas menulis ulang setiap URL ke konten /index.html jika file yang diupload tidak ada yang cocok - berguna untuk aplikasi yang menggunakan HTML5pushState.

headers

"headers": [ {
  "source" : "**/*.@(eot|otf|ttf|ttc|woff|font.css)",
  "headers" : [ {
    "key" : "Access-Control-Allow-Origin",
    "value" : "*"
  } ]
}, {
  "source" : "**/*.@(jpg|jpeg|gif|png)",
  "headers" : [ {
    "key" : "Cache-Control",
    "value" : "max-age=7200"
  } ]
}, {
  // Sets the cache header for 404 pages to cache for 5 minutes
  "source" : "404.html",
  "headers" : [ {
    "key" : "Cache-Control",
    "value" : "max-age=300"
  } ]
} ]

opsional — Setelan headers adalah parameter opsional yang berisi serangkaian definisi header kustom. Setiap definisi harus memiliki kunci source yang dicocokkan dengan lokasi permintaan asli tanpa memedulikan aturan penulisan ulang yang menggunakan notasi glob. Setiap definisi juga harus memiliki serangkaian headers untuk diterapkan, masing-masing dengan key dan value.

Contoh di atas menentukan header CORS untuk semua file font dan menimpa cache browser default 1 jam dengan cache 2 jam untuk file gambar.

Header berikut tidak diizinkan untuk disiapkan melalui konfigurasi headers:

  • Strict-Transport-Security
  • Public-Key-Pinning
  • Set-Cookie

cleanUrls

"cleanUrls": true

opsional — Setelan cleanUrls adalah parameter opsional yang jika true, akan otomatis menghilangkan ekstensi .html dari URL file yang diupload. Jika ekstensi .html ditambahkan, pengalihan 301 akan dilakukan ke lokasi yang sama tanpa ekstensi .html.

trailingSlash

"trailingSlash": false

opsional — Setelan trailingSlash adalah parameter opsional yang bisa Anda gunakan untuk mengontrol apakah URL harus memiliki garis miring di bagian akhir atau tidak. Jika true, setelan ini akan mengalihkan URL dan menambahkan garis miring di bagian akhirnya. Jika false, setelan ini akan mengalihkan URL dan menghapus garis miring di bagian akhirnya. Jika tidak ditentukan, garis miring sesudah URL hanya digunakan untuk file indeks direktori (misalnya, about/index.html).

Pencocokan pola glob

Definisi firebase.json yang diuraikan di atas memanfaatkan notasi kecocokan pola glob dengan extglob secara luas, sama seperti ketika Git menangani aturan gitignore dan Bower menangani aturan ignore. Halaman wiki ini adalah referensi yang lebih detail dan berikut ini adalah penjelasan contoh di atas:

  • firebase.json hanya mencocokkan file firebase.json di root direktori publik.
  • ** mencocokkan file atau folder apa saja di sub-direktori arbitrer. Perhatikan bahwa * hanya mencocokkan file dan folder di direktori root.
  • **/.* mencocokkan file apa saja yang diawali dengan '.' (biasanya file tersembunyi, seperti folder .git) di sub-direktori arbitrer.
  • **/node_modules/** mencocokkan file atau folder apa saja di sub-direktori arbitrer dari folder "node_modules", yang dengan sendirinya juga bisa berada dalam sub-direktori arbitrer dari direktori publik.
  • **/*.@(jpg|jpeg|gif|png) mencocokkan file apa saja di sub-direktori arbitrer yang diakhiri '.' dan salah satu akhiran berikut 'jpg', 'jpeg', 'gif', atau 'png'.

Contoh konfigurasi hosting lengkap

{
  "hosting": {
    "public": "app",
    "ignore": [
      "firebase.json",
      "**/.*",
      "**/node_modules/**"
    ],
    "redirects": [ {
      "source" : "/foo",
      "destination" : "/bar",
      "type" : 301
    }, {
      "source" : "/firebase/*",
      "destination" : "https://www.firebase.com",
      "type" : 302
    } ],
    "rewrites": [ {
      "source": "/app/**",
      "destination": "/app/index.html"
    } ],
    "headers": [ {
      "source" : "**/*.@(eot|otf|ttf|ttc|woff|font.css)",
      "headers" : [ {
        "key" : "Access-Control-Allow-Origin",
        "value" : "*"
      } ]
      }, {
      "source" : "**/*.@(jpg|jpeg|gif|png)",
      "headers" : [ {
        "key" : "Cache-Control",
        "value" : "max-age=7200"
      } ]
      }, {
      "source" : "404.html",
      "headers" : [ {
        "key" : "Cache-Control",
        "value" : "max-age=300"
      } ]
    } ],
    "cleanUrls": true,
    "trailingSlash": false
  }
}