Access relative CSS/JS files with htaccess rewrite rule - php

I was recently asked if I could make my friends server address more user friendly. His current urls looks like this:
http://wwww.example.com/site/index.php?page=home
http://wwww.example.com/site/index.php?page=about/john
http://wwww.example.com/site/index.php?page=portfolio/concept-art/2013
He would like them to look like this
http://wwww.example.com/site/home
http://wwww.example.com/site/about/john
http://wwww.example.com/site/portfolio/concept-art/2013
which I thought would be pretty simple so I wrote this following rewrite.
RewriteEngine On
RewriteCond %{REQUEST_FILENAME} !/(admin|css|fonts|ico|include|js)/
RewriteRule ^([^_]*)$ index.php?page=$1 [L]
which seems to work for the basic links like
http://wwww.example.com/site/home
but for something like this
http://wwww.example.com/site/about/john
none of the css or js will load. So I fixed that for now by making all of the files absolute paths but I am worried that my friend is going to add a new plugin or something and forget that he has to make it an absolute path.
My Question
Is there something I could change or add in my htaccess file to get the css and js files to load with a relative path? If so what would I need to do?

Better to use this rule:
RewriteEngine On
RewriteBase /site/
RewriteCond %{REQUEST_FILENAME} !/(admin|css|fonts|ico|include|js)/
RewriteCond %{REQUEST_FILENAME} !-d
RewriteCond %{REQUEST_FILENAME} !-f
RewriteRule ^(.+?)/?$ index.php?page=$1 [L,QSA]
Then for css/js/images better to use absolute path in your css, js, images files rather than a relative one. Which means you have to make sure path of these files start either with http:// or a slash /.
Alternatively You can try adding this in your page's header:
<base href="/" />
OR
<base href="http://domain.com/site/" />

Is there something I could change or add in my htaccess file to get the css and js files to load with a relative path? If so what would I need to do?
You could just add the proper relative URI base in your page header:
<base href="/site/" />
Or you could brute force redirect them using mod_rewrite (not preferable):
RewriteRule ^(.+)/(admin|css|fonts|ico|include|js)/(.*)$ $2/$3 [L]

Related

url re write issue in .htaccess file

Here is my problem
in my website base url am redirecting to an inside folder
eg: http://example.com/
to
http://onlinevyapari.com/business/ by using this code in .htaccess file
RewriteRule ^(/)?$ /business/index.php [L]
now I want to use search engine friendly url for the same website my query is like this
http://example.com/business-details.php?id=106
but I want to keep my url like this
http://example.com/business-details/106
I have done in different way like bellow
RewriteEngine on
RewriteRule business-details/id/(.*)/ business-details.php?id=$1
RewriteRule business-details/id/(.*) business-details.php?id=$1
its happening but css is not loading properly
it will be really appreciable to me if somebody help.
thank you
Have your rule like this:
RewriteEngine on
RewriteRule ^(/)?$ business/index.php [L]
RewriteRule ^business-details/(\d+)/?$ business-details.php?id=$1 [L,QSA,NC]
For solving css/js/image path issues just use absolute path in your css, js, images files rather than a relative one. Which means you have to make sure path of these files start either with http:// or a slash /.
Alternatively you can try adding this in your page's HTML header: <base href="/" /> so that every relative URL is resolved from that URL and not the current URL.
You need to add the following, before your rules, to make the rewrite rules ignore file and directory names.
RewriteCond %{REQUEST_FILENAME} !-f
RewriteCond %{REQUEST_FILENAME} !-d

urls to other files after rewrite

In my .htaccess file I rewrite all URLs to my index file like this:
RewriteEngine on
RewriteBase /
RewriteCond %{REQUEST_FILENAME} !-f
RewriteCond %{REQUEST_FILENAME} !-d
RewriteRule ^(.*)$ index.php?string=$1 [L,QSA]
So far, so good. When I request the url example.com/path/to/my/page the value of $_GET['string'] is path/to/my/page, as it should be.
Now the problem:
in my index.php I use several script/css files like this:
<script src="script/script.js"></script>
With these rewrite rules on, the script/css files get requested as example.com/path/to/my/script/script.js.
Is there a way to make sure the script gets requested without the /path/to/my part?
The only solution I found is putting the entire url in the src attribute, but I don't like it that way.
Note: the path part can consist of a variable number of parts, so /long/path/to/another/page or /page are also possible URLs.
You can also add a relative URL base to the header of your index.php file:
<base href="/" />

.htaccess File, path is redirected properly but images and css are not loaded

Hi I am using the following lines in my .htaccess file
Options +FollowSymLinks
RewriteEngine on
RewriteBase /coaster/CoasterInsider/
RewriteRule signup$ index.php?page=signup [L,NC]
RewriteRule login$ index.php?page=loginHandle [L,NC]
RewriteRule u/(.*)$ index.php?page=profile&username=$1 [L,NC]
The path is getting redirected properly, but the css,flash and images are not loading. Also if I use the following '/' after any url say,
RewriteRule signup(/?)$ index.php?page=signup [L,NC]
It's not finding any page there, i.e. error 404. I just want my htaccess file to work for both /signup and /signup/
When browser displays:
http://example.com/coaster/CoasterInsider/signup
http://example.com/coaster/CoasterInsider/signup/
and encounters a relative URL such as:
<img src="site/images/photo.png">
It translates the relative URL to (respectively):
http://example.com/coaster/CoasterInsider/site/images/photo.png
http://example.com/coaster/CoasterInsider/signup/site/images/photo.png
You should use absolute URLs for assets. Make this a habit:
<img src="/site/images/photo.png">
Alternately you can use the HTML base tag in your pages which tells browsers how to treat relative URLs. Personally I do not recommend it.
This was advised to, and worked for me, place it inside the <head> tags in your html: <base href="/"> Again, it worked for me, I hope it helps someone else.
Use
RewriteCond %{REQUEST_FILENAME} !-f
RewriteCond %{REQUEST_FILENAME} !-d
to exclude real files and directories from being rewritten.
You could also add
RewriteCond %{REQUEST_FILENAME} !-l
to do the same for symlinks.

url rewrite problem css messing up

basically what im trying to do it :
http://mydomain.com/1/1
to
http://mydomain.com/index.php?mid=1&mpid=1
and im using these codes in htaccess.
RewriteEngine on
RewriteRule ^([^/]+)/([^/]+) index.php?mid=$1&mpid=2 [NC]
it works fine but the problem is that css get messed,its not loading css and images.
whats the solution ?
The problem is that your CSS is no longer relative to the root of your site.
Your index.php file is at /, but when you rewrite to /1/1, the client thinks you actually are at /1/1, and looks for the CSS file relative to that path, as it should.
What you need to do is reference your CSS at the root, /style/something.css or whatever it is. Just make sure you have / at the front of that path.
Use the base element to set the base URL for all assets (CSS and images, etc). Here's the docs: https://developer.mozilla.org/en/HTML/Element/base
<base href="http://www.yourdomain.com/">
Also, your .htaccess may be redirecting the calls for your CSS and images. Change your .htaccess to this:
RewriteEngine on
RewriteCond %{REQUEST_FILENAME} !-f
RewriteCond %{REQUEST_FILENAME} !-d
RewriteRule ^([^/]+)/([^/]+) index.php?mid=$1&mpid=2 [NC]
... that will check to make sure the requested file (-f) and the requested directory (-d) don't exist before doing any redirects.
There can be two problems:
CSS and Images are not loading at all
RewriteEngine on
RewriteCond %{REQUEST_FILENAME} !\.(pdf|js|ico|gif|jpg|png|css|rar|zip|tar\.gz)$
RewriteRule ^([^/]+)/([^/]+) index.php?mid=$1&mpid=2 [NC]
Or the images now have different path. Always put slash at the beginning of the path, it will help. Especially in CSS file, where the path is taken relative from CSS file, not actual url.
Prepend
RewriteCond %{REQUEST_FILENAME} !-f # Existing File
before your RewriteRule - it prevents existing files, like css files, from being rewritten.
Maybe the sript sends the wrong Content-Type. CSS-Data requires Content-Type: text/css.
PHP:
header("Content-Type: text/css");
With a file extension like '.php' no browser will sniff it correct.

mod_rewrite VS relative paths

My mod_rewrite code is:
Options +FollowSymLinks
Options +Indexes
RewriteEngine On
RewriteCond %{REQUEST_FILENAME} !-d
RewriteCond %{REQUEST_FILENAME} !-f
RewriteRule ^(.+)?$ index.php?url=$1 [L,NC]
This structure is placed on my server path /beta
When I place the URL http://mydomain.com/beta/download everything works rewriting to the real path http://mydomain.com/beta/index.php?url=download
The problem happens with the relative paths. When I enter the URL http://mydomain.com/beta/download/box the rewriting goes to http://mydomain.com/beta/index.php?url=download/box... but....
All my relative paths, like my css folder, my js folder, image files.... everything with relative path in my index.php page crashes, cuz my relative paths become download/css, download/js, download/images... etc...
I know this problem happens in reason of the slash in the path "download/", but how can I solve that using the mod_rewrite in .htaccess?
Can I prevent rewriting in relative paths? Or even in internal paths of my own domain?
How can I solve that WITHOUT change my relative paths to absolute paths?
Thanks
Add a <base href="yoururl.com/beta/"; /> tag to your HTML head. Also add RewriteBase /beta/ to the htaccess if you're in that subfolder
you should always use absolute paths for images css etc, when playing with mod_rewrite but simple solution might be to ignore css,js, images and rest in RewriteRule ^(.+)?$ index.php?url=$1 [L,NC]
RewriteRule ((js|css|images)\/.*)$ /$1 [L,NC]
RewriteCond %{REQUEST_FILENAME} !-d
RewriteCond %{REQUEST_FILENAME} !-f
RewriteRule ^(.+)?$ index.php?url=$1 [L,NC]
however this might not work if these dirs actually depend of the current url
I've tested the tag and there's no need to indicate http:// The following code worked for me:
<base href="<?php echo dirname($_SERVER['PHP_SELF']);?>/" />
The server won't ever know whtether the request came via relative or absolute path so there is nothing You can do about it. As stated in another answer, You could make exceptions but maintaining all of them etc will become PITA at some point. ;)
I always use absolute paths especially when rewriting so I'd suggest just that, it's the easiest way
Adding the line:
<BASE href="http://www.sitename.com/">
to my page inside the <head> tag works great for me. It can be coded even a PHP function to automatize this so you don't have to bother with copy/paste on other occasions.
Update:
<?php
$BaseDir = 'http://'.$_SERVER['SERVER_NAME'].substr($_SERVER["SCRIPT_NAME"], 0, strrpos($_SERVER["SCRIPT_NAME"],"/")+1);
?>
<head>
...
<BASE href="<?php echo $BaseDir; ?>">
...
</head>

Categories