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 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
  • Profil Farida Farichah, Wakil Menteri Koperasi Kabinet Merah Putih Reshuffle 17 September 2025
  • Ini Info Terbaru Pencairan BSU BPJS Ketenagakerjaan 2025!
  • Cara Reset Printer Epson L3110 2025
  • WhatsApp Tiba-tiba Keluar dan Meminta Verifikasi: Apa yang Harus Dilakukan?
  • Bisakah Saldo BNI Kamu Nol? Fakta dan Cara Mengatasinya
  • Inilah Tanda-tanda Chat Audio di Grup WhatsApp Sudah Disadap
  • Cara Mengatasi Tidak Bisa Live Instagram Karena Tidak Memenuhi Syarat
  • 7 Spek Laptop yang Ideal untuk Coding & Ngoding Web/App
  • Cara Memperbaiki Error Windows “Failed to update the system registry”
  • Cara Memperaiki LGPO/exe/g
  • Cara Memperbaiki Error Tidak bisa Add Calendar di Outlook

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