Sebelumnya

Berikutnya

Mengonfigurasi rute fallback

Selesai

Ada /products rute sisi klien di aplikasi front-end Anda yang menampilkan daftar produk untuk daftar belanja Anda. Saat Anda membuka /products di aplikasi dengan memilih tautan Produk , bilah alamat browser Anda mengonfirmasi bahwa Anda berada di /products. Ketika Anda merefresh browser saat berada di halaman ini, Anda ingin aplikasi untuk merefresh dan menampilkan produk sekali lagi. Namun, tanpa rute fallback, Anda akan melihat kesalahan 404 yang menyatakan halaman tidak dapat ditemukan.

Anda melihat kesalahan 404 ketika Anda merefresh halaman karena browser mengirim permintaan ke platform hosting untuk menyajikan /produk. Namun, tidak ada halaman di server bernama produk untuk disajikan.

Untungnya, mudah untuk mengatasi masalah ini dengan membuat rute fallback. Rute fallback adalah rute yang memasangkan semua permintaan halaman yang tidak cocok ke server.

Mengonfigurasi rute fallback

Azure Static Web Apps mendukung aturan perutean kustom yang ditentukan dalam file staticwebapp.config.json opsional yang terletak di folder sumber aplikasi. Anda dapat menentukan rute fallback navigasi di objek navigationFallback. Konfigurasi rute fallback umum terlihat seperti contoh berikut.

{
  "navigationFallback": {
    "rewrite": "/index.html",
    "exclude": ["/_framework/*", "/css/*"]
  }
}

Pengaturan	Nilai	Deskripsi
rewrite	/index.html	File yang akan dilayani ketika rute tidak cocok dengan file lain.
jangan sertakan	["/_framework/*", "/css/*"]	Jalur yang diabaikan dari perutean fallback.

Aturan fallback navigasi diterapkan setelah aturan perutean lain yang muncul di file staticwebapp.config.json.

Lokasi file rute

Lokasi yang direkomendasikan untuk staticwebapp.config.json adalah di folder yang ditetapkan sebagai app_location di file alur kerja. Namun, file dapat ditempatkan di lokasi mana pun dalam folder kode sumber aplikasi Anda.

Lanjutkan