I'm having a problem with a rewrite rule that I'm using for auto versioning of my CSS and JS.
I have the following HTML code to include my stylesheet:
<link rel="stylesheet" type="text/css" href="includes/css/index_home.1364215354.css" />
I use this in my .htaccess to strip the dot and the 10 digits:
RewriteEngine On
RewriteRule ^(.*)\.[\d]{10}\.(css|js)$ $1.$2 [L]
When I load the site, the stylesheet fails to load even though if I point my browser to http://www.example.com/includes/css/index_home.css I can see the stylesheet.
The method I'm trying to use, I found here How to force browser to reload cached CSS/JS files?
I'm guessing the RewriteRule is the problem, but I don't know why.
The RewriteRule is fine so far. Maybe the problem lies in the relative URL and the request has some prefix.
If this is the case, you must be more specific (start with includes) and also don't anchor at the beginning of the request string. Also rewrite it to an absolute URL path
RewriteRule (includes/.*)\.[\d]{10}\.(css|js)$ /$1.$2 [L]
If you have multiple .htaccess files, the more specific (css) overrides the .htaccess nearer to the root directory. To merge these .htaccess files, you must use RewriteOptions Inherit or RewriteOptions InheritBeforein the css .htaccess file.
Related
I want to redirect every url entered in the Browser to the index.php.
This also works with my Code. For Example:
url.com/test1/test2/test3
url.com/test1/test2
url.com/test1
The CSS, images and JS files are also always forwarded.
I now have to exclude files with certain extensions (css, js, jpg, png, pdf) from the redirection.
My code in the htaccess file:
RewriteEngine on
RewriteCond %{REQUEST_FILENAME} !-f
RewriteCond %{REQUEST_FILENAME} !-d
RewriteRule ^(.*)$ /index.php?path=$1 [NC,L,QSA]
My Code in the Index file where i import the css-file:
<link href="css/bootstrap.min.css" rel="stylesheet">
If I enter "url.com/test" the integration of my css file works. When I enter "url.com/test/test2" the stylesheet file does not load.
Firstly make sure to place your htaccess rules file into root directory. You may need to use base tag to fix your js and other relative resources. If you are linking js files using a relative path then the file will obviously get a 404 because its looking for URL path. for example if the URL path is /file/ instead of file.html then your relative resources are loading from /file/ which is not a directory but rewritten html file. To fix this make your links absolute or use base tag. In the header of your webpage add this <base href="/"> so that your relative links can load from the correct location.
Please make sure to clear your browser cache before testing your URLs.
what I'm trying to achieve is
domain.com/register/free
that would be
domain.com/register.php?type=free
When I go go domain.com/register the page loads fine, but if I put the next /free part it cant find the css or js images etc. Not too sure where I have gone wrong but this is my .htaccess file:
RewriteRule ^register$ register.php
RewriteRule ^register/$ register.php
RewriteRule ^register/([a-zA-Z0-9\-\_]+)$ register.php?type=$1
First, you can improve your rules
Options -MultiViews
RewriteEngine On
RewriteBase /
RewriteRule ^register/?$ register.php [L]
RewriteRule ^register/([a-zA-Z0-9_-]+)$ register.php?type=$1 [L]
Then, since you create a virtual folder because of your rule (/register/) and you're using relative paths (instead of absolute paths), your links are not good anymore.
Two options (both using absolute paths):
add a leading slash for all your css (and js, img, etc) links.
e.g: href="/css/style.css" instead of href="css/style.css"
add this tag just after <head> in all your concerned pages: <base href="/"> (this will avoid you to replace each link one by one)
Below is the htaccess scripti am using:
Options +FollowSymlinks
RewriteEngine On
RewriteRule ^gecko/([^/]*)$ gecko.php?gecko=$1 [L]
Which changes http://localhost/geckology/gecko.php?gecko=Zilly (which loads css etc fine) to http://localhost/geckology/gecko/zilly which doesn't load the css etc fine as it looking in directories like this http://localhost/geckology/gecko/css/theme.css when it should be http://localhost/geckology/css/theme.css
The site is huge, so if possible i would like a htaccess way of fixing this, however i will change everything to absolute urls if it's not possible
You can fix the relative URI base by simply adding this to the header of your pages:
<base href="/" />
or if you have to use htaccess, which is really inefficient and will assume all of your css/scripts/etc are all in one place, while at the same time making the rest of the world think the same thing is actually 2 different URLs:
RewriteCond %{REQUEST_FILENAME} !-f
RewriteRule ^gecko/(css|images|other)(/.*)$ /$1/$2 [L]
This blindly rewrites any URL that tries to access "css", "image" or "other" folders within the /gecko/ path.
One angular app using $location html5 mode, located in an app subdirectory.
when the user makes direct access on a subpage (/thing/123), angular gives a wrong css URL.
for example : the path of the css is site.com/app/css/styles.css, but when the user makes a direct access to site.com/app/thing/123, this page calls a wrong css path: site.com/app/thing/css/styles.css. It is like angular is looking for the css relatively to the current URL. Oddly, the javascript files paths on the same page are correct (site.com/app/js/scripts.js).
However, this problem is only on direct access to a subpage. When accessing from site.com/app/things and navigating to site.com/app/thing/123, the css is loaded correctly.
in index.html, the css link tag is like this :
<link rel="stylesheet" href="css/styles.css"/>
To solve this, I could set an absolute css path: /app/css/styles.css, but I would prefer to keep it relative to the app directory.
The .htaccess:
Options +FollowSymLinks
<ifModule mod_rewrite.c>
RewriteEngine On
RewriteCond %{REQUEST_FILENAME} !-f
RewriteCond %{REQUEST_FILENAME} !-d
RewriteCond %{REQUEST_URI} !index
RewriteCond %{REQUEST_URI} !.*\.(js|html|png|css)
RewriteRule (.*) index.html [L]
</ifModule>
How can i solve this wrong css path?
i found prepending the path to the stylesheet with a / solves the problem
<link rel="stylesheet" href="/css/styles.css"/>
This worked for me, together with a htaccess like above:
Set the base url, probably in the base index.html:
<base href="/">
Use paths starting with / to navigate relative base url
<link rel="stylesheet" href="/css/styles.css"/>
I have this link formats on my webpage:
https://mypage.com/index2.php?page=registration
https://mypage.com/index2.php?page=food&category=1
The first type is replaced as this:
https://mypage.com/registration (works well)
And I would like to format the second as:
https://mypage.com/food/1 (doesn't work, the page is loaded, but the images don't)
So I created the following htaccess file:
RewriteEngine on
RewriteRule ^$ index.php [L]
RewriteRule ^([^/.]+)?$ index2.php?page=$1 [L]
RewriteRule ^food/([^/.]+)?$ index2.php?page=food&category=$1 [L]
But doesn't work. :(
What is wrong with this? And where are the pictures?
Thank you for your answer.
(doesn't work, the page is loaded, but the images don't)
Probably because your links are relative (doesn't begin with a /) and when you have that extra slash after /food, it changes the URL base (tries to access images in a non-existent /food/ directory). Change all your links to absolute URLs or add a base in the page header:
<base href="/" />