反応ルータで2+レベルのルートがリフレッシュに問題を表示

Question

私はreact + react-routerを使用してアプリケーションを開発していますが、2つ以上のレベルのURLでリフレッシュを処理する最適な方法を知りたいのですが深い。

私は既にconnect-history-api-fallbackモジュールを使用しています。これは、単純なURLをリフレッシュするときに機能します（localhost/eventsなど）。 しかし、もっと詳細なもの（localhost/events/1234）をリフレッシュすると、アプリケーションが失われ、jsファイルが見つかりません。

ここに私のルータの設定です：

Failed to load resource: the server responded with a status of 404 (Not Found) http://localhost:3000/event/public/js/index.js

どのように私はこの問題を扱う上で行く必要があります。リフレッシュをしながら、

const AppRouter =() => (
    <Router history={browserHistory}> 
    <Route path="/" component={App}> 
     <IndexRoute component={Home} /> 
     <Route path="/events" component={EventList} /> 
     <Route path="/events/:eventId" component={EventDetail} /> 
     <Route path="*" components={NotFound} /> 
    </Route> 
    </Router> 
); 

そしてここでは、私のブラウザのコンソールですか？

ありがとうございました。

Answer 1

おそらく問題はあなたのサーバーにあります。バックエンドコードが不足しているため、ご使用のサーバーが要求されたすべてのルートを処理するように構成されていないと仮定できます。

実際の例：あなたはhttp://yourpage.comに行けば、それはロードするために、待って、/その後、リアクトにリンク経由http://yourpage.com/page1に移動し、ルーティングは、クライアント側で処理されるため、サーバが実際に機能していませんページ1。 あなたが気づいたように、ページをリフレッシュするまで、これはすてきできれいです。実際には/ page1をサーバーから要求しますが、サーバーはこのページについて知りません。したがって、サーバーをすべてのルートにリダイレクトするか（quick'n'dirty）、手動ですべてのルートを定義するか、または完全に実装するのがちょっと面倒な同形アプローチを掘り下げるようにサーバーを構成する必要があります。 StackOverflowとGoogleの一般的な情報については、多くの情報があります。

このoneをご覧ください。