/#/

2017-11-03 9 views
1

없이 React 페이지를 다시로드 할 수 없습니다. 내 사이트의 루트 경로로 이동하여 URL에 "/ # /"없이 다른 페이지로 이동할 수 있습니다. 하지만 새로 고침을하면 404 페이지가 나에게 제공됩니다. 예를 들어/#/

, https://kaisinlipersonal.herokuapp.com/. 포트폴리오 페이지로 이동하면 URL에 해시가 없으므로 모든 것이 정상적으로 처리됩니다. URL은 https://kaisinlipersonal.herokuapp.com/portfolio입니다. 그러나 포트폴리오 페이지에서 새로 고침하면 https://kaisinlipersonal.herokuapp.com/portfolio이 404를 제공합니다. 다른 모든 페이지와 동일합니다.

왜 그런지 알고 싶습니다.

내 경로 파일 :

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

답변

1

해시 (https://kaisinlipersonal.herokuapp.com/#hash)가 클라이언트에 의해 처리된다. 서버는 해시가 무엇인지 결코 알지 못합니다. https://kaisinlipersonal.herokuapp.com/#hash을 의미

정말 https://kaisinlipersonal.herokuapp.com/에 대한 요청입니다. 그것이 귀하의 색인 페이지입니다.

당신이 https://kaisinlipersonal.herokuapp.com/profile을 요청

, 당신은 더 이상 인덱스 페이지를로드하지 있습니다. 그러나 URL을 처리해야하므로 색인 페이지를로드해야합니다.

그래서 그 문제를 해결하기 위해, 당신은 /, 인덱스 파일에 대한 모든 요청을 리디렉션하도록 서버를 알 필요가있다.

불행하게도, 파이썬/플라스크 경험 (내가 믿는 사용을 당신의 프로필에 대한 서버)이없는,하지만 프레임 워크를 사용하여이 작업을 수행 할 수있는 방법이 있어야한다.