There is an application on react in it using react router.

ReactDOM.render( <Router history={hashHistory}> <Route path="/" component={Layout}> <Route path="/about" component={About} /> </Route> </Router> , document.getElementById('app') );

when I work in webpack-dev-server, everything is fine with the historyApiFallback option, when I open the same code via puma on rails 5, the router works if the index.html page has already been loaded. If you go to http://site.heroku.com/about gives an error 404 how to overcome it?

  • Apparently you need to add to about.html the same js-s as at index.html - Mal Skrylev

1 answer 1

Problem

About the path /about knows only your client javascript, but not the server. For example:

  • the browser says GET / , the server gives index.html with the router code;
  • you click on the /about link, the router renders the component and changes the window.location ;
  • you refresh the page;
  • the browser says GET /about , the server responds 404.

Decision

Give the same html ( index.html ?) From the server to any 1 GET request. Not knowing what is happening on the server more precisely, I cannot give a more specific recommendation.

(Documentation in English for Node.js - https://github.com/reactjs/react-router-tutorial/tree/master/lessons/11-productionish-server .)

1 wisely, of course, so that, instead of feeding a html browser, instead of a favicon or a script, by chance.