When I deploy my website built with React and React-router the landing page of my website works fine but when I try to navigate into my website I run into 403 forbidden response. I use Apache as an HTTP server and the general config of my server is the following :
<IfModule mod_php.c>
php_value date.timezone Europe/Brussels
</IfModule>
<IfModule mod_userdir.c>
UserDir /var/www/users/staff/*
</IfModule>
For your information, the website is located under /var/www/projects
I added the following .htaccess to my project :
<IfModule mod_rewrite.c>
RewriteEngine On
RewriteBase /
RewriteRule ^index\.html$ - [L]
RewriteCond %{REQUEST_FILENAME} !-f
RewriteCond %{REQUEST_FILENAME} !-d
RewriteCond %{REQUEST_FILENAME} !-l
RewriteRule . /index.html [L]
</IfModule>
Despite those configurations the 403 forbidden error when navigating in pages managed by react-router. Did I miss some configurations?
It seems that the settings you have applied are not enough, You should change some parameters in apache.conf too...
open the apache main config file, Its path varies depending on your distribution, that's located in one of these locations:
1- /etc/apache2/httpd.conf
2- /etc/apache2/apache2.conf
3- /etc/httpd/httpd.conf
4- /etc/httpd/conf/httpd.conf
look for "AllowOverride" parameter like the example below:
<Directory "/var/www/blahblah">
AllowOverride All
</Directory>
And give the "All" value to that.
Then create a .htaccess file in the root folder of the webserver & set the following configs:
Options -MultiViews
RewriteEngine On
RewriteCond %{REQUEST_FILENAME} !-f
RewriteRule ^ index.html [QSA,L]
NOTE: Before performing these things you have to enable the rewrite module, By entering the following commands you can do this:
debian base: sudo a2enmod rewrite
centos: uncomment mod_rewrite.so in /etc/httpd/conf/httpd.conf
Finally, restart your web server... Now expected there is no anymore problem.
If you got any permission/server error take a look at the webserver logs which are located in one of these locations:
1- /var/log/httpd/
2- /var/log/apache2
Related
Full error message: Not Found
The requested URL was not found on this server.
Additionally, a 404 Not Found error was encountered while trying to use an ErrorDocument to handle the request.
My problem is when I uploaded my build file to cpanel(via bluehost) I started getting this error when I try to navigate to different pages within my react. The homepage works and displays all that it's supposed to. My local host doesn't have this problem because according the react documents the development server knows how to handle the requests. I have researched everywhere on the internet for the answer to this problem, but nothing seems to work.
This is the configuration in my .htaccess file in my public directory:
<IfModule mod_rewrite.c>
RewriteEngine On
RewriteBase /
RewriteRule ^index\.html$ - [L]
RewriteCond %{REQUEST_FILENAME} !-f
RewriteCond %{REQUEST_FILENAME} !-d
RewriteCond %{REQUEST_FILENAME} !-l
RewriteRule . /index.html [L]
</IfModule>
This is my package. json file:
My build file was uploaded as a zip file into cpanel > public_html. All files were extracted from the build folder and moved into public_html. Like previously stated my homepage works but when I navigate to other pages it does not.
npm run build without a .htaccess file
In cpanel in the top right corner there is a settings option. Choose settings and check the option "show hidden files." (also make sure you're in the document root)
In the top left corner there is the option to add a file. Click that and create a new .htaccess file.
Paste this in the new file, save it and you should be able to move through your website without the error message. Hopefully I just saved you the 5 days it took me to figure this out.
<IfModule mod_rewrite.c>
RewriteEngine On
RewriteBase /
RewriteRule ^index\.html$ - [L]
RewriteCond %{REQUEST_FILENAME} !-f
RewriteCond %{REQUEST_FILENAME} !-d
RewriteRule . /index.html [L]
</IfModule>
I need to host my react project in a sub-folder of a domain. e.g. mydomain.com/react-project/
In the project, I am using react-router library for routing. I have this .htaccess file in the react-project folder to make work the router.
<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>
For the home page, the project working fine. But for other URLs, the server shows the default apache "not found" page.
I tried to create a .htaccess file in the root folder of the server.
ErrorDocument 404 /react-project/index.html
With this .htaccess file, I wanted to redirect the browser to react projects index.html file. But it didn't work.
May be this is because of Client side, Server side routing issue.
I think when you refresh the page it shows 404 not found on server.
You can check this answer for help. Also use HashRouter instead of BrowserRouter and add basename={"/subdirectory"} in Routes.
I am using apache server for an angularJS web-app. Its purely based on AngularJS/HTML5 and has no server side programming like php or others.
When I say localhost on my browser (Chrome 49+), it takes me to http://localhost/Login/Index as per the routes defined. But when I refresh the page, browser says The requested URL /Login/Index was not found on this server.
I went through some posts on stackoverflow and tried this in my .htaccess file:
<IfModule mod_rewrite.c>
RewriteEngine On
Options FollowSymLinks
RewriteBase /
RewriteCond %{REQUEST_FILENAME} !-f
RewriteCond %{REQUEST_FILENAME} !-d
RewriteRule ^(.*)$ /#/$1 [L]
</IfModule>
I tried removing few lines and it shows me some error while refreshing the page. So this means that .htaccess file is being applied. So I suppose the problem must be with the RewriteRule. What should I write in the RewriteRule? Any other quick/better way to solve this problem?
I'm trying to redirect show files in folder/dist when accessing folder/ in a webapp using .htaccess.
This works as desired on localhost (xampp apache) but when pushed to the server (AWS Elastic Beanstalk Apache) I get a error code 500 Internal Server Error.
I've created the webapp using the Yeoman Angular generator and it's running the webapp on an Apache server. The project is in a subfolder of the whole site (http://url.com/pages/webapp). Grunt creates the application in the dist folder and I this content is what I want the visitor to see when accessing the root of the webapp.
Basically I want to redirect/rewrite http://url.com/pages/webapp/ to http://url.com/pages/webapp/dist/
Im trying to accomplish this with a .htaccess that looks like this:
RewriteEngine On
RewriteRule ^$ dist/ [L]
RewriteCond %{REQUEST_FILENAME} !-f
RewriteCond %{REQUEST_FILENAME} !-d
RewriteCond %{REQUEST_URI} !^dist/
RewriteRule ^(.*)$ dist/$1
The exact same htaccess-content is used in other projects on the same server and they work fine. Only projects created with this generator has this issue.
Is the problem in my htacceess-file, other part of webapp or Elastic Beanstalk...?
I have tried adding AllowOverride All (root directory) and LoadModule rewrite_module modules/mod_rewrite.so to /etc/httpd/conf/httpd.conf but it didn't work.
I also didn't find anything interesting in error_log
I realize the problem is probably hard to solve with the information provided but I am hoping someone else has had a similar issue.
Thanks
Try this code in root .htaccess:
RewriteEngine On
RewriteRule ^$ dist/ [L]
RewriteCond %{REQUEST_FILENAME} !-f
RewriteCond %{REQUEST_FILENAME} !-d
RewriteCond %{REQUEST_URI} !^/dist/ [NC]
RewriteRule ^(.*)$ dist/$1 [L]
Note leading / before dist in RewriteCond.
I am facing issue in my first intallation of CakePHP.
I am working on Windows OS and using WAMP. I am able to point my browser to localhost -> phpcake to open my installation of CakePHP.
However I get an error as below:
Missing Controller
Error: PhpcakeController could not be found.
Following are the steps which I followed for installing CakePHP:
Unzipped CakePHP, version 2.4.7 and loaded that in my WAMP
Created database using phpMyAdmin
Updated the app\Config\database.php file with login, password and databasename
The contents of the .htaccess files of cake is as below:
phpcake/.htaccess
<IfModule mod_rewrite.c>
RewriteEngine on
RewriteRule ^$ app/webroot/ [L]
RewriteRule (.*) app/webroot/$1 [L]
</IfModule>
phpcake/app/.htaccess
<IfModule mod_rewrite.c>
RewriteEngine on
RewriteRule ^$ webroot/ [L]
RewriteRule (.*) webroot/$1 [L]
</IfModule>
phpcake/app/webroot/.htaccess
<IfModule mod_rewrite.c>
RewriteEngine On
RewriteBase D:/Vivek/phpcake/
RewriteCond %{REQUEST_FILENAME} !-d
RewriteCond %{REQUEST_FILENAME} !-f
RewriteCond %{REQUEST_URI} !^/(app/webroot/)?(img|css|js)/(.*)$
RewriteRule ^(.*)$ index.php [QSA,L]
</IfModule>
The mod_rewrite is disabled on my Apache. If I enable it, then I get 404 error on launching CakePHP install.
Could you guide me as to which step am I missing?
Finally i got it working. This is what i was doing (wrong).
In my WAMP i created an alias directory. Apache -> Alias -> Add an Alias Directory. In this alias i pointed to the location of my CakePHP unzipped folder. I updated the App/Config/Database.php to point to created MySQL database. However on selecting mod_rewrite module in Apache i was getting 404/403 errors. And without mod_rewrite i was getting missing controller error.
Missing Controller
Error: PhpcakeController could not be found.
I tried fresh installations 3 times with same results.
My understanding is that the mod_rewrite, the instructions in Alias file and .htaccess files were creating this trouble.
So this is what i did (Worked):
I copied my CakePHP into WAMP's www directory. That's it, it did the trick. I went through various articles about .htaccess, and mod_rewrite. Frankly speaking it is complex for me.