Refreshing page gives Cannot GET /page_url in react-router 2

Viewed 1279

I am using client side rendering with react 0.14 and react-router 2. I have deployed my app to a local node server.

I am at url (server_url/component1). Whenenver I refresh the page I am getting

Cannot GET /component1 

error from server side.

I know this is happening because I am sending request to server again for /component1 which route does not exists on server. But I want to disable that whenever I am refreshing the page it should handled by client side routing only. I do not want to send any request to server.

Entry point to my app index.js

import React from 'react';
import ReactDOM from 'react-dom';
import {Router,browserHistory} from 'react-router';
import routes from './routes';

ReactDOM.render(
    <Router routes={routes} history={browserHistory}/>
  , document.querySelector('.init')
);

My routes.js file

module.exports = (
       <Route path="/" component={App}>
           <IndexRoute component={Home}/>
           <Route path="/component1" component={comp1}/>
       </Route>
)

Edit: In this scenario should I use browser history or hash history? Are they same?

1 Answers
Related