-
-
Save alexsasharegan/173878f9d67055bfef63449fa7136042 to your computer and use it in GitHub Desktop.
| <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 works fine on url's like
example.com/component(react router fires upcomponent), but fails on routes likeexample.com/component/othercomponent. The react router can navigate fine to these hypothetical url's once the app is loaded, but Apache is confused.what is solution for that problem "example.com/component/othercomponent" ?
Use this instruction: https://gkedge.gitbooks.io/react-router-in-the-real/content/apache.html
Works perfectly for me!
I have this situation: example.com/realfolder/maincomponent/othercomponent
Put the following .htaccess file in the 'realfolder' and all works perfectly!
<IfModule mod_rewrite.c>
RewriteEngine on
# Don't rewrite files or directories
RewriteCond %{REQUEST_FILENAME} -f [OR]
RewriteCond %{REQUEST_FILENAME} -d
RewriteRule ^ - [L]
# Rewrite everything else to index.html to allow html5 state links
RewriteRule ^ index.html [L]
</IfModule>
what is solution for that problem "example.com/component/othercomponent" ?
I was able to solve this by adding a <base href="http://example.com/"> tag to my document head.
So simply I solved my solution. Thank you a lot ;)
Can someone help me I'm new to this and could not get the .htaccess file to work
hi everyone.
I want to know the configuration of .htaccess file if I put contents of web-build (using expo build:web) in the sub-directory of main domain . Because my static paths(https://stiff.com/Home/about) are working fine but under sub-folder name(https://stiff.com/stiff2/Home/about) it is overriding to static path name(https://stiff.com/Home/about) .
Do you have another .htaccess file on your sub-folder /stiff2/?
Can you share a bit of your folder structure and where are you saving this .htaccess file
At last if you wish run React Node Express app to Apache and here port 80, you must setting environment variable to example server.js
const PORT = process.env.PORT || 80;
app.listen(PORT, () => {
console.log(Server is listening on port ${PORT});
});
And in package.json file set like init file
"main": "server.js",
And set webpack
webpack.config.js
const path = require('path');
module.exports = {
entry: './src/entry.js',
output: {
filename: 'bundle.js',
path: path.resolve(__dirname, 'dist')
},
How webpack can make bundle.js file
Love it
I really appreciate this
This doesn't work for me locally on Manjaro so I don't know what to say really
Works Fine, but was necessary activate "mod_rewrite"
sudo a2enmod rewrite
sudo /etc/init.d/apache2 restart
Completely necessary. Thanks!
what is solution for that problem "example.com/component/othercomponent" ?
I was able to solve this by adding a <base href="http://example.com/"> tag to my document head.For those also looking to solve this problem - I don't think you need the domain in this tag.
I set the value to<base href="/">
works for me thanks bro
SI PUDIERA TE BESARIA! Muchas gracias!
good
How can I set my .htaccess to allow my app users to use their custom domain to access my react app, after they've pointed their dns to my ip address?
I resolved it by implementing the following steps
Step 1
Add the following in package.json
"homepage": "."
Step 2
Added the following in .htaccess
<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>
Step 3
Add the following in the public/index.html above meta:description
<script type="text/javascript"> document.write("<base href='//" + document.location.host + "' />"); </script>
Exactly 5 years later, still works like a charm, thank you for this!
RewriteCond %{HTTPS} on
RewriteRule (.*) http://%{HTTP_HOST}%{REQUEST_URI} [R=301,L]
Should be?
RewriteCond %{HTTPS} off RewriteRule (.*) https://%{HTTP_HOST}%{REQUEST_URI} [R=301,L]
I did found one solution
Just replace "api" with any subfolder you'll like to ignore
<IfModule mod_rewrite.c> RewriteRule ^(api)($|/) - [L] RewriteEngine On RewriteBase / RewriteRule ^index\.html$ - [L] RewriteCond %{REQUEST_FILENAME} !-f RewriteCond %{REQUEST_FILENAME} !-d RewriteCond %{REQUEST_FILENAME} !-l RewriteRule . /index.html [L] </IfModule>For multiple directories use
(directory_one|directory_two)
Hi, just to learn: can you explain why this is necessary?
I don't understand why you have to exclude the folders explicitly. If they are real folders, they should be excluded by this rule: RewriteCond %{REQUEST_FILENAME} !-d right?
To be honest, htaccess files are not my strong suit, it's more of a trial and error for me.
I'm sorry I can't be of help here, maybe someone else can explain better.
How and in more application like is server application, ever exists some configuration file, who getting some away of work. In our case is file .htaccess. There we must setting how we wish , other word how is need us. Example for developing and run server for web, we can use different ports for that. In our case for web address use port 80. But if we don't say to server config. file some other port. Our work can't see any body. reason is wrong port who show application. For that we must reprograming configuration file and get order to server who port he must use for showing our application. This is one of solution. Other solution is in our react node express application, there in package.json file we get some proxy and for environment port write number port who is need. For that case we must make file .env . There we write const port =80; And that our server part see this and our application setting on this port.
All in all, two things are needed to solve any problem:
- One is to find out how something works
- second to identify the cause of the problem based on the first point.
The reason for this approach is for the reason that no matter what is invented, the working principle is almost identical. If we look at the code functions, they are written the same in almost all program speeches, sometimes they have smaller differences. But it’s not something big. While the main point is to talk about how something is very good, fast, efficient. But when you start working on it, you can see that it is just a complication without any need. We used to have PHP, HTML, MySQl, PYTHON. If we go back a long time, we will notice the Astec C programming language, from which PHP, java, java script, c ++ were created. pascal, and many others. Under the pretext of how they are better. but do you judge for yourself.
Works great!
Children routing not loading.
I have following configuration in .htaccess file
In index.tsx file we mention that BrowserRouter basename=${ENV:REACT_APP_SUBPATH}
It is working for parent routes but children routes its not working means
http://sample.com/account -> this is working
http://sample.com/account/create -> this is not working it showing blank pages.
Sir you are a god among men. I've been trying to figure this out for hours.
I resolved it by implementing the following steps Step 1 Add the following in package.json
"homepage": "."Step 2 Added the following in .htaccess<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>Step 3 Add the following in the public/index.html above meta:description<script type="text/javascript"> document.write("<base href='//" + document.location.host + "' />"); </script>
Thank you so much!
Will this work for dreamhost server as well?
I'm new and facing the same problem. Surfing on the internet for almost a week tried everything but nothing worked for me.
Will this work for dreamhost server as well? I'm new and facing the same problem. Surfing on the internet for almost a week tried everything but nothing worked for me.
Technically if your hosting is using Apache it will work, the only thing you will need is to create the file via FTP (Or your preferred way) in the folder of your website.
Here a link to dreamhost docs about creating the file.
When i host under direct domain its worked, But in sub folder blank page with favicon only displayed
for starting react app on different Port , you can use make file .env and in here you add next code PORT= 80 example if you start develop on port 80, or build app at this port.
This is possible because babel and other when build production code for final app looking this file and accepted . But , you must get attantion for admin premision on this port.
And setting virtual in access httpdocs .
For Nginx add / merge the following in your nginx config file
location / {
try_files $uri $uri/ /index.html;
}
Thanks you my friend!! Perfect, It Work!