/＃/

Question

を除いたReactページをリロードできません私のサイトでルートルートに行き、URLに "/＃/"を付けずに別のページに移動できます。しかし、リフレッシュすると404ページになります。

たとえば、https://kaisinlipersonal.herokuapp.com/。あなたがポートフォリオページに行くと、URLにハッシュはなく、すべてうまく見えます。 URLはhttps://kaisinlipersonal.herokuapp.com/portfolioです。しかし、ポートフォリオページで更新した場合、https://kaisinlipersonal.herokuapp.com/portfolioは404を返します。他のすべてのページでも同じです。

なぜこのようなケースが考えられますか？

マイroutesファイル：

import React from 'react'; 
import { IndexRoute, Router, Route, browserHistory } from 'react-router'; 

import Main from './components/Main'; 
import Home from './components/Home'; 
import Portfolio from './components/Portfolio'; 
import Contact from './components/Contact'; 
import Blog from './components/Blog'; 

export default (
    <Router history={browserHistory}> 
     <Route path='/' component={Main}> 
     <IndexRoute component={Home}/> 
     <Route path='/portfolio' component={Portfolio} /> 
     <Route path='/blog' component={Blog} /> 
     <Route path='/contact' component={Contact} /> 
     </Route> 
    </Router> 
); 

私が使用して反応し、ルートはバージョン3

Answer 1

ハッシュ（https://kaisinlipersonal.herokuapp.com/#hash）であるが、クライアントによって処理されます。サーバーは、ハッシュが何であるか分からない。

つまり、https://kaisinlipersonal.herokuapp.com/#hashは、実際にはhttps://kaisinlipersonal.herokuapp.com/へのリクエストです。それがあなたのインデックスページです。

https://kaisinlipersonal.herokuapp.com/profileをリクエストすると、インデックスページは読み込まれなくなります。しかし、URLを処理する必要があるため、インデックスページをロードする必要があります。

これを修正するには、インデックスファイルである/にすべてのリクエストをリダイレクトするようにサーバーに指示する必要があります。

残念ながら、私はPython/Flaskの経験はありません（あなたのプロファイルのサーバーとして使用していると思いますが）、そのフレームワークを使用してこれを行うには何らかの方法が必要です。