Hlavným problémom súvisiacim s presmerovaním React Router 404 je, že môže byť ťažké ho implementovať. Keďže React Router nemá vstavanú stránku 404, vývojári musia manuálne vytvoriť trasu pre stránku 404 a potom nakonfigurovať smerovač tak, aby presmeroval všetky požiadavky, ktoré sa nezhodujú s existujúcou cestou. Vyžaduje si to dodatočný kód a konfiguráciu, čo môže byť časovo náročné a náročné na ladenie, ak sa niečo pokazí. Okrem toho, ak používateľ prejde priamo na adresu URL, ktorá neexistuje, namiesto presmerovania na stránku 404 sa mu stále zobrazí chybová stránka.
import { BrowserRouter as Router, Route, Switch } from "react-router-dom";
const App = () => (
<Router>
<Switch>
<Route exact path="/" component={Home} />
<Route exact path="/about" component={About} />
{/* 404 Redirect */}
<Route render={() => (<Redirect to="/" />)} />
</Switch>
</Router>
);
// Riadok 1: Tento riadok importuje komponenty BrowserRouter, Route a Switch z knižnice respond-router-dom.
// Riadok 3: Tento riadok definuje funkciu s názvom App, ktorá vracia JSX.
// Riadky 5-7: Tieto riadky zabalia komponent App do komponentu Router z reakčnej-router-dom.
// Riadky 8-10: Tieto riadky definujú dve trasy pre komponenty Home a About.
// Riadok 12: Tento riadok definuje trasu, ktorá presmeruje na domovskú stránku, ak sa nezhoduje žiadna iná trasa.
Čo je kód chyby 404
Chybový kód 404 v React Router je stavový kód HTTP, ktorý označuje, že požadovaný zdroj sa nepodarilo nájsť. Zvyčajne sa vráti, keď sa používateľ pokúsi o prístup na stránku alebo cestu, ktorá neexistuje. Môže k tomu dôjsť, ak používateľ nesprávne zadal adresu URL alebo ak bola stránka odstránená alebo presunutá bez aktualizácie odkazov na ňu. Keď k tomu dôjde, React Router zobrazí všeobecnú stránku 404 s príslušnou správou informujúcou používateľa o chybe.
404 Presmerovanie
V React Router je presmerovanie 404 spôsob, ako presmerovať používateľov na inú stránku, keď sa pokúšajú získať prístup na neplatnú adresu URL. Môže to byť užitočné, keď používateľom poskytnete lepšiu skúsenosť, keď zadajú nesprávnu adresu URL alebo sa pokúsia prejsť na neexistujúcu stránku. Presmerovanie 404 je možné implementovať pomocou komponentu Redirect z React Router, ktorý vám umožňuje zadať cestu k stránke, na ktorú chcete používateľa presmerovať. Napríklad, ak sa niekto pokúsi o prístup k /invalid-url, môžete použiť komponent Redirect takto:
