Skip to content

emka.web.id

menulis pengetahuan – merekam peradaban

Menu
  • Home
  • Tutorial
  • Makalah
  • Ke-NU-an
  • Kabar
  • Search
Menu

Cara Mengatasi Error 404 di ReactJS

Posted on April 20, 2022

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

Terbaru

  • Cara Mengatasi Masalah Konektivitas VM Hyper-V ke Host
  • Cara Memperbaiki Error 0x8000FFFF Catastrophic Failure Saat Ekstrak Zip
  • Cara Memperbaiki File Explorer Crash Saat Membuka Folder Besar di Windows 11/10
  • Cara Mengatasi Error Login 0x8007003B di Outlook, Microsoft, XBox dll
  • Cara Memulihkan Akun Admin Microsoft 365 Karena MFA Gagal
  • Cara Mengatasi Error “A Conexant audio device could not be found”
  • Cara Memperbaiki Windows Tidak Nyala Lagi Setelah Sleep/Locked
  • Cara Memperbaiki Komputer Crash karena Discord
  • Cara Memperbaiki Error Windows “Failed to update the system registry”
  • Cara Memperaiki LGPO/exe/g
  • Cara Memperbaiki Error Tidak bisa Add Calendar di Outlook
  • Cara Memperbaiki File Transfer Drop ke 0 di Windows 11
  • Cara Memperbaiki Microsoft Copilot Error di Outlook
  • Cara Memperbaiki Error Virtualbox NtCreateFile(\Device\VBoxDrvStub) failed, Not signed with the build certificate
  • Cara Memperbaiki Error “the system detected an address conflict for an IP address, with Event ID 4199”
  • Cara Memperbaiki Password Microsoft Edge yang Hilang
  • Cara Memperbaiki Email Outlook yang Hilang atau Tidak Muncul
  • Cara Menemukan Username dan Password di Windows 11
  • Cara Mengatasi Error Virtualbox not detecting Graphics Card di Windows 11
  • Cara Mengatasi Error Windows MFReadWrite.dll not found or missing
  • Cara Membuat Formulir Menggunakan Zoho Form
  • Pemerintah Ganti Ujian Kesetaraan Dengan TKA 2025
  • Ini Perbedaan TKA vs Ujian Nasional: TKA Lebih Sakti?
  • Daftar TKA Tutup 5 Oktober: Sudah 3.3 Juta Yang Daftar
  • Review Aplikasi ClipClaps: Penipuan atau Tidak?
  • Review Aplikasi Wibuku: Alternatif Nonton Anime Gratis untuk Para Wibu Indonesia!
  • Inilah Alat dan Software Phone Farming dengan Samsung Galaxy J7 Prime
  • Cara Cek Paket Internet Telkomsel Kena Pembatasan/Throttling Atau Tidak
  • Cara Mengatasi YMusic APK Error Tidak Bisa Dibuka
  • Cara Memblokir Akun Teman di Mobile Legend: Panduan Lengkap
  • Cara Mengatasi Masalah Konektivitas VM Hyper-V ke Host
  • Cara Memperbaiki Error 0x8000FFFF Catastrophic Failure Saat Ekstrak Zip
  • Cara Memperbaiki File Explorer Crash Saat Membuka Folder Besar di Windows 11/10

©2025 emka.web.id | Design: Newspaperly WordPress Theme