Apache web server doesn't allow me to refresh on /about but on localhost its working fine Apache web server doesn't allow me to refresh on /about but on localhost its working fine apache apache

Apache web server doesn't allow me to refresh on /about but on localhost its working fine


Hey this is actually a pretty common thing.

What's happening is you need to get your apache server to ignore any nested paths and just send all requests /* to root instead. That way your front-end javascript can pick up the route on the client-side and display the correct view.

This is sometimes referred to as "HTML5 Mode" in different webservers.

In apache the way you do this is add a rule like the following:

  RewriteEngine On    RewriteCond %{DOCUMENT_ROOT}%{REQUEST_URI} -f [OR]  RewriteCond %{DOCUMENT_ROOT}%{REQUEST_URI} -d  RewriteRule ^ - [L]  RewriteRule ^ /index.html [L]

What this does is to tell Apache to serve any files that exist, but if they dont exist, just serve /index.html rather than a 404 not found.


In case of laravel, you need to render the same view where all the routes are written for react file. Laravel route is written as:

Route::get('{url}', function () { return view('welcome'); })->where(['url' => '.*']);

welcome blade file is:

<!doctype html> <html lang="{{ app()->getLocale() }}">    <head>         <meta charset="utf-8">         <meta http-equiv="X-UA-Compatible" content="IE=edge">         <meta name="viewport" content="width=device-width, initial-scale=1">         <title>Laravel</title>         <link href="{{asset('css/app.css')}}" rel="stylesheet" type="text/css">    </head>    <body>         <div id="root"></div>         <script src="{{asset('js/app.js')}}" ></script>    </body> </html>

app.js file for route

 <Route>     <Route name = "App" path="/" handler = {App}>     <Route name="About" path="/about" handler = {About}/>     <DefaultRoute name="Projects" handler = {Projects}/>   </Route> 

so every time you refresh on your about route, it will show the welcome blade and its respective routes in app.js file