Setelah Anda membuat build produksi dari aplikasi ReactJS Anda. Itu membuat file index.html, yang melayani seluruh aplikasi. Semua request harus di hist ke index.html terlebih dahulu kemudian React Router menyajikan konten berdasarkan query di URL. Ketika kami mengakses aplikasi dengan URL utama, itu mengenai index.html dan berfungsi dengan baik. Jika Anda langsung mengakses satu sub URL di browser, server web tidak menemukan file apa pun dengan nama itu. Dalam hal ini, pesan kesalahan 404 dikembalikan ke pengguna.
Masalah:
Pesan kesalahan 404 dikembalikan oleh server web ketika kami secara langsung menekan sub URL dari aplikasi ReactJS produksi.
Solusi:
Solusi sederhana adalah merutekan semua permintaan ke t dia file index.html. Istirahatkan router React akan menangani this.
Perbarui konfigurasi server Anda berdasarkan webserver running.
1. Pengguna Nginx
Pengguna Nginx dapat mengedit file konfigurasi blok server (host virtual) dan menambahkan cuplikan berikut. Ini akan mengarahkan semua permintaan ke file index.html.
#Add this in Nginx
server block location /
{
...
try_files $uri.html $uri $uri/ /index.html;
...
}
Simpan file dan mulai ulang layanan Nginx.
2. Pengguna Apache
Jika aplikasi reaksi di-host di server web Apache. Kemudian Anda dapat menambahkan file .htaccess di root situs Anda dan menambahkan snippet.
berikut
RewriteEngine On
RewriteBase /
RewriteRule ^index.html$ - [L]
RewriteCond %{REQUEST_FILENAME} !-f
RewriteCond %{REQUEST_FILENAME} !-d
RewriteCond %{REQUEST_FILENAME} !-l
RewriteRule . /index.html [L]
Pastikan modul penulisan ulang Apache diaktifkan di sistem Anda.
Referensi tecadmin.com