Réagir-routeur “Ne peut pas OBTENIR /*”, sauf pour la racine de l'url
Je suis prêt à utiliser Réagir-routeur pour mon application, et je suis en train l'exemple donné dans la doc première, dont j'ai copié ci-dessous. Maintenant, quand je vais à localhost:3000/
, je vois des "App" comme prévu, mais toutes les autres pages, comme localhost:3000/inbox
retourne "Ne peut pas OBTENIR /de la boîte de réception". Ce qui me manque ici ?
var About = React.createClass({
render: function () {
return <h2>About</h2>;
}});
var Inbox = React.createClass({
render: function () {
return <h2>Inbox</h2>;
}});
var App = React.createClass({
render () {
return (
<div><h1>App</h1>
<RouteHandler/>
</div>
)}});
var routes = (
<Route path='/' handler={App}>
<Route path="about" handler={About}/>
<Route path="inbox" handler={Inbox}/>
</Route>
);
OriginalL'auteur JulienD | 2015-08-19
Vous devez vous connecter pour publier un commentaire.
Je crois que le problème, c'est que vous faites une ressource http demande:
mais sont utilisation côté client uniquement de routage. Êtes-vous l'intention de le faire côté serveur de rendu trop? Vous pourriez avoir besoin de changer votre routeur emplacement
HistoryLocation
au lieu deHashLocation
(valeur par défaut).L'emplacement prop de
Router.run
lui indique où pour faire correspondre les routes contre. Si vous n'êtes pas en cours d'exécution côté serveur Réagir, je crois que vous devez utiliserRouter.HashLocation
(ou laisser le champ vide).Si non, vous accédez à votre composant dans le mauvais sens. Essayez d'utiliser
http://localhost:3000/#/inbox
. Il peut prendre un peu de vous familiariser avec Réagissent-Routeur, mais il est certainement la peine!Réagir La Documentation Du Routeur - HashLocation
Router.run(routes, Router.HistoryLocation, function (Handler, state) {...}
, je ne sais pas à propos de HashLocation. Tout ce que je besoin est un autre texte à afficher en fonction du nom que j'ai ajouter, après le " / " (par exemple, '/boîte de réception"). La /#/ renvoie la même chose que ce que j'ai mis après lui (c'est à dire '/#/boîte de réception " est traité de la même façon que '/' et affiche 'App':state.params
est un objet vide).Exécutez-vous Réagir sur le serveur? ou êtes-vous juste de montage Réagir sur une base index.html fichier?
J'ai un Apache instance qui sert de mon frontend à localhost:3000, et le index.html il contient l'React.js code. Si elle fait aucun sens. J'ai aussi un backend Python servi à :8000 mais je suppose que c'est sans rapport.
Donc, fondamentalement, lorsque vous appuyez sur /index, le serveur Apache est à la recherche d'une autre ressource pour mettre en place, au lieu de les garder à l'index.html fichier. Vous avez besoin de changer votre
router.Run
à utiliserRouter.HashLocation
et puis appuyez sur la /#/boîte de réception (même index.html document de base).Ce n'est pas à jour v2.x. Essayez de suivre permettant ici: github.com/reactjs/react-router/blob/master/docs/guides/...
OriginalL'auteur Brad Bumbalough
Si vous utilisez
webpack-dev-server
il y a une option appeléehistory-api-fallback
. Si la valeurtrue
erreur 404 se replie sur/index.html
.Ajout de l'option de
devServer
section de la Webpack config comme ceci:Lien vers Webpack docs: https://webpack.github.io/docs/webpack-dev-server.html
Cette solution correcte à la question
Merci, c'est la réponse!
OriginalL'auteur tobi
Option la plus simple: utiliser hachage de l'histoire à la place. L'url de séjour ne sont pas très agréable et si vous avez besoin d'un meilleur RÉFÉRENCEMENT, je préfère le rendu côté serveur.
Si vous êtes intéressé dans le détail à ce sujet, cette réponse a été vraiment utile pour moi: Réagir-routeur url ne fonctionnent pas lors de l'actualisation ou de les écrire manuellement
OriginalL'auteur thevangelist
La demande sera envoyée au serveur, et le répertoire/fichier n'existe vraiment, de sorte qu'il sera de retour 404, de sorte que vous avez à dire au serveur pour revenir à la page d'index pour toutes les demandes, et de réagir en va gérer l'enracinement :
si comme moi, vous êtes l'hébergement de votre réagissent application sur IIS, il suffit d'ajouter un site web.fichier de configuration contenant :
Cela indiquera serveur IIS pour revenir à la page principale du client au lieu de l'erreur 404.
OriginalL'auteur Chtiwi Malek
Je suis tombé sur le même problème, si vous avez un serveur qui répond aux demandes et un HashRouter si vous utilisez un fichier statique serveur. Au lieu d'utiliser BrowserRouter utilisation HashRouter ce n'est pas le perfect fix, mais devrait résoudre le ne peut pas OBTENIR "/" chemin de l'erreur. assurez-vous d'importer HashRouter de "réagir-routeur-dom'
source: https://github.com/ReactTraining/react-router/blob/master/packages/react-router-dom/docs/guides/basic-components.md
OriginalL'auteur user3460150