0

I have route 

import { HashRouter } from 'react-router-dom';

 <HashRouter>
  <BrowserRouter>
    <Switch>
      <Route path="/admin" render={props => <AdminLayout {...props} />} />
      <Route path="/auth" render={props => <AuthLayout {...props} />} />
      <Redirect from="/" to="/auth/login" />
    </Switch>
  </BrowserRouter>
  </HashRouter>

When I refresh the page on the server getting a 404 error. also how to set base URL?

ash
  • 1
  • 1
  • 1
  • That doesn't sound like a react or react-router problem, it sounds like a webserver configuration problem, or the use of a relative script in your index.html (`./reactprojectname.js` instead of a absolute path `/reactprojectname.js`) – Brian Thompson Jun 04 '20 at 17:07
  • this might help you https://stackoverflow.com/questions/27928372/react-router-urls-dont-work-when-refreshing-or-writing-manually – arnavpanwar99 Jun 04 '20 at 17:10
  • You can check [this](https://stackoverflow.com/a/62050700/2873538) about how to solve **404 Error** on servers. I am also wondering if we use both `HashRouter` and `BrowserRouter` together in an app? [Here](https://reacttraining.com/react-router/web/api/HashRouter) is example of How to use `HashRouter` with `basename`. – Ajeet Shah Jun 04 '20 at 17:24

1 Answers1

2

This is really simple.

Create a .htaccess file on /public_html folder and copy that code:

RewriteBase /
RewriteRule ^index\.html$ - [L]
RewriteCond %{REQUEST_FILENAME} !-f
RewriteCond %{REQUEST_FILENAME} !-d
RewriteRule . /index.html [L]

If you want to know about the process, read this article: https://ui.dev/react-router-cannot-get-url-refresh/

Pablo Naveira López
  • 41
  • 4
  • As it’s currently written, your answer is unclear. Please [edit] to add additional details that will help others understand how this addresses the question asked. You can find more information on how to write good answers [in the help center](/help/how-to-answer). – Community Jan 25 '22 at 14:08