Routing php using .htaccess - url-routing

My folder structure:
--root
-----includes
-----content.php
-----index.php
-----sitemap.php
-----rss.php
i want using .htaccess file for routing my web application look like this:
http://mysite.domain/ => index.php
http://mysite.domain/any-slug/ => content.php
http://mysite.domain/sitemap.xml => sitemap.php
http://mysite.domain/any-slug.rss => rss.php
This is my .htaccess file:
RewriteEngine On
RewriteCond %{REQUEST_FILENAME} !-d
RewriteCond %{REQUEST_FILENAME} !-f
RewriteCond %{REQUEST_FILENAME} !-l
RewriteRule ^sitemap.xml$ sitemap.php
RewriteRule ^(.+).rss$ rss.php?slug=$1
RewriteRule ^(.+)$ content.php?slug=$1 [QSA,L]
But, it not working. Somebody can help me?

I don't know if you've solved the problem but the .htaccess file just reroutes all the requests to index.php. From there you need to employ a router in order to show different pages depending on the url submitted.
For example:
User visits localhost/home/index/hello.
This gets redirected to index.php.
index.php uses $_SERVER['REQUEST_URI'] to retrieve the /home/index/hello explode it and require in the right page.

Related

.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]

load the wordpress website on particular route of react app

i have hosted my react app on domain example.com
when i hit example.com/blog i want to load my wordpress site.
For that i have placed wordpress in folder named blog inside public folder of react app
for that i have placed .htaccess file in public folder to handle that
<IfModule mod_rewrite.c>
RewriteEngine On
RewriteBase /blog1
RewriteRule ^blog1$ - [L]
RewriteCond %{REQUEST_FILENAME} !-f
RewriteCond %{REQUEST_FILENAME} !-d
RewriteCond %{REQUEST_FILENAME} !-l
RewriteRule ./blog1 [L]
</IfModule>
but that doesn't worked for me.
may be i am using the wrong approach to achieve this,as i don't have much experience in react.
The easiest way that worked for me:
You need to have a PHP server.
Build your react app and upload via FTP to public_html.
Upload wordpress to public_html/blog folder and setup db for it.
Update your .htaccess file for React routing:
<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>
Default wordpress .htaccess file after install in subdirectory:
# BEGIN WordPress
<IfModule mod_rewrite.c>
RewriteEngine On
RewriteRule .* - [E=HTTP_AUTHORIZATION:%{HTTP:Authorization}]
RewriteBase /blog/
RewriteRule ^index\.php$ - [L]
RewriteCond %{REQUEST_FILENAME} !-f
RewriteCond %{REQUEST_FILENAME} !-d
RewriteRule . /blog/index.php [L]
</IfModule>
# END WordPress
Without knowing more about the problem.
You may need ensure that the react app and WordPress app use different uri paths if they both run on the same domain.
You need to link outside the app when you are making a request to the WordPress theme and vice versa when you link to your react app. Using an a tag rather than the typical react link.
e.g. using the traditional tag rather than the component
You will probably need to use a reverse proxy file and configure it to be able to run two apps on one server.
You could use a specific react library developed for WordPress called Frontity. This page might help clarify things. Frontity Connection to Wordpress

How to rewrite any subpath of a folder to a specific index.html file in .htaccess

I have an apache server with a joomla installation in the root directory. Now i want to host a React.js app with react router in a subdirectory /react. This app has different views on different subpaths and also pulls information from the url parameters, so i basically need to rewrite any url with the pattern %ROOT%/react/* to /react/index.html
How can i do that? I already tried multiple variations of
RewriteCond %{REQUEST_FILENAME} !-f
RewriteCond %{REQUEST_FILENAME} !-d
RewriteCond %{REQUEST_URI} /react/(.*) [NC]
RewriteRule ^ /react/index.html [L]
but without success. Any ideas?

Apache 2.4 + React Router 4 always routing to my 404 page component

I'm having trouble getting my create react app build to properly route to my components on my server.
I have a .htaccess file
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]
so that it always routes to my index.html
the url to my site is .com/project and my homepage option in my package.json file is homepage: '/project'
I have ran out of things to do.
Because of my htaccess it's always routing to my index.html but the router is always loading the 404 component. What am I missing.
This occured because the base routing was wrong so it was constitently routing to the 404 page.
Setting the <Router basename="/<Directory>"> and adding the homepage option to my package.json file fixed this problem.
For me worked with this .htaccess:
RewriteEngine On
RewriteBase /project
RewriteCond %{REQUEST_FILENAME} !-f
RewriteCond %{REQUEST_FILENAME} !-d
RewriteCond %{REQUEST_FILENAME} !-l
RewriteRule ^(.*)$ index.html?$1 [L,QSA]

redirect using htaccess angular js

I have a website created using angular js.I need to show one page when user request one url.
for example
when the url is mydomain.com/assets then it shuld show this page mydomain.com/article/1234
I have added teh bellow htaccess,but it throws 500 error
RewriteEngine on
RewriteCond %{REQUEST_FILENAME} !-f
RewriteCond %{REQUEST_FILENAME} !-d
RewriteRule ^(.assets)$ index.html#/article/1234 [L] // here i add redirect
RewriteRule ^(.*)$ index.html#/$1 [L]
How to resolve this?
Use this.
RewriteRule ^(.assests)$ mydomain.com/index.html#/article/1234 [R=301,L]

Resources