Rewrite AngularJS URL - angularjs

How can an AngularJS site's url be automatically rewritten from example.com/app to example.com/app/#/?
Currently, it changes from example.com/app to example.com/app#/.

You can use this rule:
RewriteCond %{REQUEST_FILENAME} !-f
RewriteCond %{REQUEST_FILENAME} !-d
RewriteRule ^(.+?[^/])$ /$1/#/ [L,NE,R=302]

Related

htaccess with two indexes for locales

I am using Reactjs client-side, and I have two indexes index.html and indexAR.html I am doing it for SEO for every language make an index.
URL example: example.com/ar/{pages}
URL example: example.com/en/{pages}
so I need to tell the HTTP server if find ar in URL returns indexAR.html if anything else returns index.html
#.htaccess
Options -Indexes
RewriteEngine on
RewriteCond %{REQUEST_FILENAME} !-f
RewriteCond %{REQUEST_FILENAME} !-d
RewriteRule ^(.*)$ /index.html?path=$1 [NC,L,QSA]
Have your htaccess rules file in following manner. make sure your htaccess rules file is present along with ar, en folders(not inside them, besides them).
Make sure to clear your browser cache before testing your URLs.
RewriteEngine ON
Options -Indexes
RewriteCond %{REQUEST_FILENAME} !-f
RewriteCond %{REQUEST_FILENAME} !-d
RewriteRule ^ar indexAR.html [NC,L]
RewriteCond %{REQUEST_FILENAME} !-f
RewriteCond %{REQUEST_FILENAME} !-d
RewriteRule ^(.*)/?$ index.html?path=$1 [NC,L,QSA]

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>

htaccess with Angular and Phalcon

I'm trying to switch the frontend of my Phalcon app to AngularJS. I'm having some troubles with the .htaccess file though. Below is what I currently have.
RewriteEngine On
RewriteBase /
RewriteCond %{REQUEST_FILENAME} !-d
RewriteCond %{REQUEST_FILENAME} !-f
RewriteRule ^api/.* api/index.php [L,QSA]
RewriteCond $1 !^(api)
RewriteRule ^(.*)$ public/index.php?_url=/$1 [QSA,L]
It routes to Phalcon, but all the .css and .js files in the public folder now throw a 404. What am I doing wrong here?
If you want to ignore files and directories you need to add extra rewrite rules to your .htaccess. if you want to ignore extensions as well, there's another rewrite rule for that.
https://stackoverflow.com/a/17029882 will give you the information you need. In your case
RewriteCond %{REQUEST_URI} !(\.css|\.js|\.png|\.jpg|\.gif)$ [NC]
is enough and in most cases also the files and directories are not rewritten with this:
RewriteCond %{REQUEST_FILENAME} !-f
RewriteCond %{REQUEST_FILENAME} !-d

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

Rewrite rule - redirect dynamic url to a subdirectory without loop

I have these possible path to images:
/media/thumbnail/img.jpg
or
/media/thumbnail/product/img.jpg
or
/media/thumbnail/product/some-text/img.jpg
All have to be redirected to:
/media/thumbnail/uploads/img.jpg
I tried this:
RewriteCond %{REQUEST_FILENAME} \.(png|jpg|jpeg|gif)$
RewriteRule ^/media/(.*)/(.*)$ /media/$1/uploads/$2 [L,R]
but i get an error loading the page due to a loop so I need to stop if the path contains a folder called uploads.
EDIT:
There's another problem, the rule I'm asking for must works with this one:
RewriteCond %{REQUEST_FILENAME} .(png|jpg|jpeg|gif)$
RewriteRule ^(.*)$ uploads/$1 [L,NC,QSA]
Which redirects /img.jpg to /upoloads/img.jpg
Thanks in advance
RewriteRule in your .htaccess doesn't match leading slash.
Change your code:
RewriteCond %{REQUEST_FILENAME} !-f
RewriteRule ^[^./]+\.(?:png|jpe?g|gif)$ /uploads%{REQUEST_URI} [L,NC]
RewriteCond %{REQUEST_FILENAME} /(?=[^/]*$)([^.]+\.(?:png|jpe?g|gif))$
RewriteCond %{REQUEST_FILENAME} !-f
RewriteRule ^media/([^/]+)/(.*)$ /media/$1/uploads/%1 [L,R]

Resources