SPA .htaccess breaks JS files after top level [duplicate] - .htaccess

I want to make my URL as SEO Friendly URL. I tried editing .htaccess file by rewriting rule
RewriteRule ^swift-details/([0-9]+)/([0-9a-zA-Z_-]+)$ swift-details.php?id=$1 [NC,L]
RewriteRule ^swift-details/(css|js|img)/(.*)?$ /$1/$2 [L,QSA,R=301]
It's routing the correct URL but in that page CSS JS and images are not working.
Example URL:
http://www.example.com/swift-details/2/abblinbb

This is because your relative URIs have their base changed. Originally, the base is / when the page is /swift-details.php?id=foo, and the browser properly fills in relative links with the / base. But when the browser goes to a page like /swift/details/foo the base suddenly becomes /swift/ and it tries to append that in front of all relative URLs and thus none of them load.
You can either make your links absolute, or change the URI base in the header of your pages (inbetween the <head> </head> tags):
<base href="/">

You dont need the second rewrite rule. Your CSS/JS paths are all 'relative' to your current location.
Your CSS exists here:
/css/normalize.css
Your page is looking here:
/swift-details/2/abblinbb/css/normalize.css
All you need is 'forward-slashes' before your CSS/JS paths.

Related

Problem of links when create friendly links with htaccess [duplicate]

I want to make my URL as SEO Friendly URL. I tried editing .htaccess file by rewriting rule
RewriteRule ^swift-details/([0-9]+)/([0-9a-zA-Z_-]+)$ swift-details.php?id=$1 [NC,L]
RewriteRule ^swift-details/(css|js|img)/(.*)?$ /$1/$2 [L,QSA,R=301]
It's routing the correct URL but in that page CSS JS and images are not working.
Example URL:
http://www.example.com/swift-details/2/abblinbb
This is because your relative URIs have their base changed. Originally, the base is / when the page is /swift-details.php?id=foo, and the browser properly fills in relative links with the / base. But when the browser goes to a page like /swift/details/foo the base suddenly becomes /swift/ and it tries to append that in front of all relative URLs and thus none of them load.
You can either make your links absolute, or change the URI base in the header of your pages (inbetween the <head> </head> tags):
<base href="/">
You dont need the second rewrite rule. Your CSS/JS paths are all 'relative' to your current location.
Your CSS exists here:
/css/normalize.css
Your page is looking here:
/swift-details/2/abblinbb/css/normalize.css
All you need is 'forward-slashes' before your CSS/JS paths.

.htaccess setting for local pathing and development

My initial feeling is this can be done with .htaccess, but if there is another/better way I'm open to it.
I'll try and explain what I'm doing and want.
I am developing a site (newsite.com), to replace currentsite.com.
There is already a site up an currentsite.com domain.
I figured I'll try and develop on my personal domain, until tested ready to launch, and move things over, replacing current site.com
So I have personalsite.com (my personal domain)..and I created a directory called staging.newsite.com
So the full URL is http://www.personalsite.com/staging.newsite.com.
However, I am having trouble pathing to CSS and JS files with this set up.
In the header file I load my css as so:
<link href="_includes/css/default.css" type="text/css" rel="stylesheet" />
Doing this:
<link href="/_includes/css/default.css" type="text/css" rel="stylesheet" />
makes it point to _root of www.personalsite.com to look for includes folder.
which seems to work fine when I go:
http://www.personalsite.com/staging.newsite.com
but when I go to a content page on the staging.newsite.com, like:
(for example)
http://www.personalsite.com/staging.newsite.com/sub-dir1/sub-dir2/contentpage.php
The CSS breaks..
Is there a way to set this up so http://www.personalsite.com/staging.newsite.com is seen as the root directory for this staging.newsite.com? Or some other way to set it up for easier developing and then will be a simple upload to its final domain (without the need for the .htaccess rules?)
I tried this:
RewriteCond %{HTTP_HOST} !^staging\.newsite\.com$ [NC]
RewriteRule (.*) http://staging.newsite.com/$1 [R=301,L]
but that re-directs the MAIN personalsite.com to http://www.staging.newsite.com (which of course is just a subdirectory of personal.com for development purposes..etc)
update: 08.11.2015
edit: This is NOT a vanity URL re-write question.. please treat it as such, and do not post it as a duplicate of that topic. If you feel it IS the same, explain why and how the same solution applies, out of context links do nothing for anyone.
update: 08.11.2015
I believe what I am looking for/to do is referred to as: "normalizing" the sub-domain/directory? (new term for me, so I'll search on that as well)

.htaccess to redirect images

i'm still new to the redirectrule thing from htaccess and have successfully redirected my pages so that the pretty URL shows up, but is there a way to redirect the images so that it is not relative? Is there a way or function that allows me to redirect images without changing it one by one ?
Like i after redirecting the page, i get relative URL, hence my images are showing something extra in their links.
so this is the actual url to the image
http://www.yousite.com/page/images/this.jpg
but i'm getting stuff like
http://www.yoursite.com/images/page/images/this.jpg
I am not sure this will solve the problem, but instead of modifying all the links you could use the BASE element in each page to define a base URI:
From http://www.w3.org/TR/html4/struct/links.html#h-12.4:
When present, the BASE element must appear in the HEAD section of an
HTML document, before any element that refers to an external source. The
path information specified by the BASE element only affects URIs in the
document where the element appears.
Examples:
<HEAD>
<BASE href="ImagesBasePath">
</HEAD>
Or just:
<HEAD>
<BASE href="/">
</HEAD>

Convert to SEO friendly URL

I'm trying to make my website URLs SEO-friendly, and I'm having problems...
How can I change this URL:
http://www.example.com/media.php?album=Album_1&page=1
To this kind of URL:
http://www.example.com/media/Album_1/1
I've tried this code that works, but my CSS seems KO...
RewriteEngine On
RewriteRule ^media/(.*?)/([0-9]+)$ media.php?album=$1&page=$2
Your rule's target doesn't need the &, it should just be &. Apache will propery encode it as needed (like in the anchor link in the HTML returned in a redirect). The reason your css isn't working sounds like a relative vs absolute URL issue. If your css is linked like <link rel=stylesheet href="something.css">, the relative URL resolution ends up being /media/Album_1/something.css.
Try adding this in the headers of your pages:
<base href="/">
Try reading mod_rewrite apache documents or just searching 'mod_rewrite' This specific question was asked many times

Multiple subdirectory error with mod_rewrite

I am trying to use mod_rewrite manually in joomla, and I have the following Rule:
RewriteRule ^test/(t1|t2|t3)-(.*).html$ /index.php?option=com_jumi&fileid=39&$1=$2 [L,NC]
So that I want the url
http://www.mysite.com/index.php?option=com_jumi&fileid=39&t1=foo
be displayed like
http://www.mysite.com/test/t1-foo.html
The rule works correctly, but when I am in the rewritten page the links like
http://www.mysite.com/link.html
or
http://www.mysite.com/xxx/link.html
become
http://www.mysite.com/test/link.html
or
http://www.mysite.com/xxx/test/link.html
respectively.
any suggestions?
thank you
You are using relative urls in your page. Your page contains a link like <a href="link.html">... and the browser makes the links relative to the current 'folder', namely "test", so when clicked the browser loads /test/link.html.
You should just use root-relative urls. So the link should become more like <a href="/link.html">.... The leading '/' makes the browser load the page relative to the root ("/"), not relative to "/test/".

Resources