React Router på PHP hosting

Som du allerede ved, efter build repræsenterer et React-projekt almindelig statik, som kan uploades til enhver hosting, og det vil fungere der med det samme.

Der er dog et problem med React Router. Faktum er, at Router under arbejde ændrer URL'en på siderne i browseren. Samtidig genindlæses siden ikke rigtigt, kun URL'en ændres via JavaScript.

På et websted, der er lagt på hosting, vil Router fungere. Men hvis du, mens du er på en side på webstedet, undtagen forsiden, genindlæser den, vil der komme en 404 fejl.

Og det er logisk, for browseren vil lede efter en fil på den angivne URL, som det er sædvanligt for statiske websteder. Og i vores applikation vil en sådan side ikke eksistere, for vi simulerer kun dem, mens hele vores applikation faktisk kører på index.html.

For at løse problemet er det nødvendigt at gøre sådan, at alle URL'er, der ikke peger på reelt eksisterende filer, omdirigeres til index.html. Dette gøres via web-serveren, der kører på hostingen.

Virtuelle hostingtjenester kører på PHP. Som regel bruges Apache som server. Der er en speciel fil .htaccess tilgængelig, som kan bruges til at indstille omdirigeringen.

For at gøre dette skal du i roden af dit websted placere filen .htaccess med følgende indhold:

RewriteEngine On
RewriteCond %{REQUEST_FILENAME} !-f
RewriteRule ^ index.html [QSA,L]

Lav et projekt med React Router.

Upload det til hosting. Vær sikker på, at routing som standard ikke virker.

Løs problemet ved hjælp af filen .htaccess.