multiple htaccess rewrite Conditions / angular routes html5 mode - angularjs

i have a angular project with routes in html5 mode. I set up a htaccess file, that is possible to insert a domain manually or refresh the page.
here the htaccess code with works fine, based on this
Still getting 'Not Found' when manually refreshing with angular.js route
RewriteEngine On
RewriteBase /
RewriteCond %{REQUEST_FILENAME} -f [OR]
RewriteCond %{REQUEST_FILENAME} -d
RewriteRule ^ - [L]
RewriteRule ^ myFolder/myFile.php [L]
but now i want also to redirect the url to https width www, for example:
http://example.com should become https://www.example.com
there for i used this:
RewriteCond %{HTTP_HOST} !^www\.
RewriteRule ^(.*)$ http://www.%{HTTP_HOST}/$1 [R=301,L]
RewriteCond %{HTTPS} !on
RewriteRule (.*) https://%{HTTP_HOST}%{REQUEST_URI} [R=301,L]
But when i try to combine this scripts i always get error!
Thanks!

I'm not sure how you're trying to combine the code, but you should be able to do it this way. Replace example.com with your domain.
RewriteEngine On
RewriteBase /
RewriteCond %{HTTPS} !^on [OR]
RewriteCond %{HTTP_HOST} ^example\.com [NC]
RewriteRule ^ https://www.example.com%{REQUEST_URI} [R=301,L]
RewriteCond %{REQUEST_FILENAME} -f [OR]
RewriteCond %{REQUEST_FILENAME} -d
RewriteRule ^ - [L]
RewriteRule ^ myFolder/myFile.php [L]
Clear your browser cache before trying the new rules.

Related

.htaccess How to redirect to index.html with params but the param value is same as a folder name

The routing url is like 'my_website/:param'
But my location contain a folder name is as same as the params.
So when I browse with http://my_website/apple.
The browser will display the folder instead of pass the value 'apple' to the web.
How should I set the .htaccess?Thanks
The following only work when the folder with same value is not exist.
<ifModule mod_rewrite.c>
RewriteEngine On
RewriteCond %{DOCUMENT_ROOT}%{REQUEST_URI} -f [OR]
RewriteCond %{DOCUMENT_ROOT}%{REQUEST_URI} -d
RewriteRule ^.*$ - [NC,L]
RewriteRule ^(.*) index.html [NC,L]
</ifModule>
Based on your shown samples, could you please try following. Please clear your browser cache before testing your URLs.
RewriteEngine ON
RewriteCond %{REQUEST_FILENAME} !-f
RewriteCond %{REQUEST_FILENAME} !-d
RewriteRule ^(.*)/?$ index.html [L]
OR if you are looking only for link which starts with apple then try following.
RewriteEngine ON
RewriteCond %{REQUEST_FILENAME} !-f
RewriteCond %{REQUEST_FILENAME} !-d
RewriteRule ^apple index.html [NC,L]
Problem in OP's tried code: RewriteRule ^(.*) index.html [NC,L] will create an loop because there is no condition mentioned, so its going true each time for each uri.

.htaccess - redirect between two react apps

I have two react apps in the same subdomain - in different directories.
app.domain.com
app.domain.com/login
For react router to work I have existing .htaccess rules to redirect all traffic to the app (index.html)
RewriteEngine On
#Redirect to https
RewriteCond %{HTTPS} off
RewriteRule ^(.*)$ https://%{HTTP_HOST}%{REQUEST_URI} [L,R=301]
RewriteBase /
#Not sure what this does
RewriteCond %{QUERY_STRING} ^open&guid=
RewriteRule ^ ? [R=301,L,NE]
#Not sure what this does
RewriteRule ^index\.html$ - [L]
#Redirect all to index.html
RewriteCond %{REQUEST_FILENAME} !-f
RewriteCond %{REQUEST_FILENAME} !-d
RewriteRule . /index.html [L]
I want to allow to load the react app in directory /login and redirect all /login/* requests to /login/index.html.
How can I apply these rules using .htaccess?
Kind regards /K
Your existing .htaccess is fine. Just create another .htaccess under /login/ directory as this:
RewriteEngine On
#Redirect all to index.html
RewriteCond %{REQUEST_FILENAME} !-f
RewriteCond %{REQUEST_FILENAME} !-d
RewriteRule . index.html [L]
This will route every non-file and non-directory /login/* request to /login/index.html
With your shown samples, could you please try following. Please make sure you clear your browser cache before testing URLs.
RewriteRule ^login/?$ login/index.html [NC,L]
OR uri has starting login with having other things in uri.
RewriteRule ^login(?!=index\.html) login/index.html [NC,L]

Redirect to https secured not working in react-router

Using create-react-app together with react-router, how can I make any of the following variations (I don't think I missed any):
www.example.com
example.com
http://example.com
http://www.example.com
redirect to:
https://www.example.com (notice the https, secured)
I tried adding a subdomain of www, then created an .htaccess file with the following code:
RewriteEngine On
RewriteCond %{HTTPS} !=on
RewriteRule ^(.*)$ https://%{HTTP_HOST}%{REQUEST_URI} [L,R=301,NE]
When I add that, react routes don't work, and I get a blank page. (I'm using 1and1 to host.)
What am I doing wrong, and how can I fix it?
I got this issue and i'm also using 1&1,
It this because you need to redirect everything to your index.html in order to make react-router work properly.
Here, you only making an http to https redirection, which is the first part on the job.But, you also need to make that https request redirect to your index.html file.
So you make your http to https redirection :
RewriteCond %{REQUEST_FILENAME} !-f
RewriteCond %{REQUEST_FILENAME} !-d
RewriteCond %{REQUEST_FILENAME} !-l
RewriteCond %{HTTPS} off
RewriteRule ^(.*)$ https://%{HTTP_HOST}%{REQUEST_URI} [NC,L,R=301]
Then, if https is "on" you redirect everything to index.html
RewriteCond %{REQUEST_FILENAME} !-f
RewriteCond %{REQUEST_FILENAME} !-d
RewriteCond %{REQUEST_FILENAME} !-l
RewriteCond %{HTTPS} on
RewriteRule ^(.*)$ /index.html [NC,L,QSA]
And you can test your .htaccess here : https://htaccess.madewithlove.be/
It works fine in theory, but i don't know why in my case it the redirection didn't works when the URI was "/".
So I added this :
"If https is not activate and the URI is "/" then redirect to the root of my website with https"
RewriteCond %{HTTPS} off
RewriteCond %{REQUEST_URI} ^.$
RewriteRule .* https://"your-site.com"/ [NC,L,R=301]
To summarize the answer
<IfModule mod_rewrite.c>
RewriteEngine On
RewriteCond %{HTTPS} off
RewriteCond %{REQUEST_URI} ^.$
RewriteRule ^(.*)$ https://"your-site.com"/ [NC,L,R=301]
RewriteCond %{REQUEST_FILENAME} !-f
RewriteCond %{REQUEST_FILENAME} !-d
RewriteCond %{REQUEST_FILENAME} !-l
RewriteCond %{HTTPS} off
RewriteRule ^(.*)$ https://%{HTTP_HOST}%{REQUEST_URI} [NC,L,R=301]
RewriteCond %{REQUEST_FILENAME} !-f
RewriteCond %{REQUEST_FILENAME} !-d
RewriteCond %{REQUEST_FILENAME} !-l
RewriteCond %{HTTPS} on
RewriteRule ^(.*)$ /index.html [NC,L,QSA]
</IfModule>

Rewrite url for Angular app within sub-folder

I've got an Angular app using html5mode, but it's currently sitting within a sub-folder of a site: http://somesite.com/za/
So I've managed to rewrite the url to direct to my assets folder correctly, but I'm still getting 404s when I hit refresh or navigate directly to a page.
So this works: http://somesite.com/za/assets/js/bundle.js
This doesn't work, 404: http://somesite.com/za/home
.htaccess
RewriteEngine On
#This apparently creates a redirect loop for angular
RewriteRule ^(.*)/$ /$1 [L,R=301]
RewriteCond %{REQUEST_FILENAME} !-d
RewriteCond %{REQUEST_FILENAME} !-f
RewriteRule ^(za/.*) /za/index.html [NC]
RewriteCond %{REQUEST_FILENAME} !-f
RewriteRule ^(?:[^/]*/)*([^/.]+\.(?:jpe?g|gif|bmp|png||css|js))$ za/assets/$1 [R=301,L,NC]
AddType image/svg+xml svg svgz
AddEncoding gzip svgz
So where is the rewrite failing to redirect to index.html when I hit or refresh a page?
Solved it with a more elegant rewrite rule:
RewriteEngine on
RewriteCond %{REQUEST_FILENAME} -s [OR]
RewriteCond %{REQUEST_FILENAME} -l [OR]
RewriteCond %{REQUEST_FILENAME} -d
RewriteRule ^.*$ - [NC,L]
RewriteRule ^(.*) /za/index.html [NC,L]
However, this does give read access to other files and directories, so it can have security issues.

htaccess ignore rewrite to api url

I’ve build the front end of a site using angular and have created the cms through Kirby. Kirby allows you to build a json api from the structure you create with the cms, like so.
What I’m trying to do now is use the api provided by Kirby which is:
address.com/projects/api
within my angular app. I’m using html5 and htaccess to rewrite my urls so I dont need to use a hash within the url and page refreshes on a subpage get redirected to the appropriate angular view.
address.com/work
address.com/about
address.com/single-project
my htaccess looks like this
RewriteCond %{REQUEST_FILENAME} !-f
RewriteCond %{REQUEST_FILENAME} !-d
RewriteCond %{REQUEST_URI} !index
RewriteRule (.*) index.html
Kirby requires its own htaccess to serve pages also, so my question... Is it possible to allow access to my json template at address.com/projects/api and still preserve the angular clean urls?
If I'm understanding you correctly, you want to ignore /projects/api? Then you can do this
RewriteCond %{REQUEST_FILENAME} !-f
RewriteCond %{REQUEST_FILENAME} !-d
RewriteCond %{REQUEST_URI} !^/projects/api [NC]
RewriteCond %{REQUEST_URI} !index
RewriteRule (.*) index.html [L]
You can add more exclusions in your negative RewriteCond:
RewriteCond %{REQUEST_FILENAME} !-f
RewriteCond %{REQUEST_FILENAME} !-d
RewriteCond %{REQUEST_URI} !/(index|projects/api) [NC]
RewriteRule ^ index.html [L]
Solved it shortly after posting #facepalm.The additional line that did the trick for anyone in the same or similar situation
RewriteRule (api) index.php
I have the same issue but none of the above solved my problem.
My current .htaccess is as shown below:
RewriteEngine On
RewriteCond %{HTTP_HOST} ^app.mydomain.com [NC]
RewriteRule ^(.*)$ http://www.app.mydomain.com/$1 [L,R=301]
RewriteEngine On
RewriteCond %{DOCUMENT_ROOT}%{REQUEST_URI} -f [OR]
RewriteCond %{DOCUMENT_ROOT}%{REQUEST_URI} -d
RewriteRule ^ - [L]
RewriteRule ^ /index.html
my API folder path is http://www.app.mydomain/api

Resources