Переход к URL-адресу маршрутизатора напрямую не работает.

Question

Я использую реактивный маршрутизатор, и все работает нормально, за исключением случаев, когда я перехожу непосредственно к URL. Например, если я нажал ссылку в приложении, которая идет на «/ quizreview? QuizId = nAUl3DmFlX», она работает без проблем. Но если бы я вошел в URL "http://localhost:3000/quizreview?quizId=nAUl3DmFlX" он говорит:

не может получить/quizreview quizId = nAUl3DmFlX

Вот мой маршрутизатор код:

ReactDOM.render((
<Router history={browserHistory}> 
    <Route path="/" component={App}> 
     <IndexRoute component={UserQuiz} onEnter={loginRequired}/> 
     <Route path="/login" component={Login}/> 
     <Route path="/quiz/:id" component={Quiz}/> 
     <Route path="/quizreview" component={PostQuiz}/> 
     <Route path="/quizquestions/:quizId" component={QuestionForm}/> 
     <Route path="/questionreview/:questionId" component={QuestionReview}/> 
     <Route path="/noquestions" component={NoQuestionsDialog}/> 
    </Route> 
</Router> 
), document.getElementById('app')); 

Могу ли я делать что-то здесь не так? Я последовал за учебником React-Router, и он работает нормально, и я считаю, что я следовал тем же инструкциям, но с этой проблемой.

Answer 1

Если вы используете HTML5, а затем посетить URL непосредственно browserHistory вам нужно иметь historyApiFallback: true в файле WebPack, если вы используете WebPack

, что historyApiFallback делает, это сделать так, чтобы ваш сервер возвращает index.html для любой URL-адрес, к которому вы пытаетесь получить доступ, и поскольку ваши маршруты затем настроены в отношении index.html, чтобы вы могли напрямую получить доступ к любому URL-адресу маршрута

, иначе вы можете попробовать альтернативу, то есть использовать history={hashHistory} с react-router, а затем посетить свой url like

http://localhost:3000/#/quizreview?quizId=nAUl3DmFlX