How to configure server for reloading page in reactjs-CodePudding

I am using Apache 2.2, on centos OS to host my reactjs app ... in my App.js I have this code

import React from "react";
import { createBrowserHistory } from "history";
import { BrowserRouter, Route, Switch} from "react-router-dom";
import axios from "axios";
// import { useSelector } from "react-redux";

// core components
import AuthLayout from "layouts/Auth.js";
import RtlLayout from "layouts/RTL.js";
import AdminLayout from "layouts/Admin.js";
import LoginPage from "views/Pages/LoginPage";
import User from "layouts/User";

import "assets/scss/material-dashboard-pro-react.scss?v=1.10.0";
import moment from 'moment'

require('moment-timezone')
moment.tz.setDefault('Africa/Nairobi')

const App = () => {

  const hist = createBrowserHistory();

  axios.defaults.baseURL = `https://myurl.com:8443/strategy/api/`;

  return (
    <BrowserRouter history={hist}>
    <Switch>
      <Route path="/rtl" component={RtlLayout} />
      <Route path="/auth" component={AuthLayout} />
      <Route path="/admin" component={AdminLayout} />
      <Route path="/user" component={User} />
      <Route path="/" component={LoginPage} />      
          </Switch>
  </BrowserRouter>
  );
}

export default App;

I then use yarn build and everything in my build folder is moved to my DocumentRoot folder /var/www/html/stratex

In this /var/www/html/stratex i also have a .htaccess file and in that I have

<IfModule mod_rewrite.c>
  RewriteEngine On
  RewriteBase /subdirectory
  RewriteRule ^index\.html$ - [L]
  RewriteCond %{REQUEST_FILENAME} !-f
  RewriteCond %{REQUEST_FILENAME} !-d
  RewriteCond %{REQUEST_FILENAME} !-l
  RewriteRule . /index.html [L]
</IfModule>

After this , i restarted my server :

sudo service httpd restart

When i go to /admin/dashboard it is fine and when i hit refresh i get

The requested URL /admin/dashboard was not found on this server.

I also have another link /user/dashboard which loads fine but on refresh it says

The requested URL /user/dashboard was not found on this server

Has anyone come across this issue ? I see so much online about the .htaccess file fixing the issue but it has not worked for me at all. I also added this line in my httpd.conf

LoadModule rewrite_module modules/mod_rewrite.so

Any recommendations/help will be appreciated.

CodePudding user response：

To solve this , i added this in my virtualhost

 <Directory /var/www/html/stratex>
    AllowOverride All
 </Directory>

I followed this tutorial.

And my .htaccess looks like this :

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