I have an angularJS app, configured with the following:
$locationProvider.html5Mode(true);
$locationProvider.hashPrefix('!');
So in modern browsers, it works with pushstate no problem, an example URL would be:
In older browsers, e.g. IE9, when I browse to that URL, it rewrites it as expected to:
!/members
Clicking any links from this point on uses the hashbang method, also correctly:
!/members/add
However...
If I full reload a page once it's on a hashbang rewritten url, it will keep appending the hash to itself. First refresh:
!/members#!/members#!%2Fmembers
.. and second refresh:
!/members#!/members#!%2Fmembers#!/members#!%2Fmembers%23!%2Fmembers%23!%2Fmembers
What is going on here that could be causing this? Usually it won't happen as people will navigate within the app and angular will handle the urls, but doing a full reload seems to break it. Thanks.
I have an angularJS app, configured with the following:
$locationProvider.html5Mode(true);
$locationProvider.hashPrefix('!');
So in modern browsers, it works with pushstate no problem, an example URL would be:
http://myapp./members
In older browsers, e.g. IE9, when I browse to that URL, it rewrites it as expected to:
http://myapp./members#!/members
Clicking any links from this point on uses the hashbang method, also correctly:
http://myapp./members#!/members/add
However...
If I full reload a page once it's on a hashbang rewritten url, it will keep appending the hash to itself. First refresh:
http://myapp./members#!/members#!/members#!%2Fmembers
.. and second refresh:
http://myapp./members#!/members#!/members#!%2Fmembers#!/members#!%2Fmembers%23!%2Fmembers%23!%2Fmembers
What is going on here that could be causing this? Usually it won't happen as people will navigate within the app and angular will handle the urls, but doing a full reload seems to break it. Thanks.
Share Improve this question asked May 30, 2013 at 6:00 RuncibleRuncible 3,0983 gold badges22 silver badges19 bronze badges 1- "In older browsers, e.g. IE9" Well there's your problem! LOL (I know, not helpful, but as penance, now I'll go and look for our shim code on this.) – Sharondio Commented May 30, 2013 at 15:49
2 Answers
Reset to default 6Try setting
<base href="/" />
in the head? It may be an angular 1.1.5 bug/feature.
Placing a <base> tag in your <head> seems to be the way to go...
<head>
<base href="/">
</head>
...but there might be more that needs to be done. I set my $locationProvider to html5Mode too and got errors when I loaded my page.
myAngularModule.config($locationProvider =>
{
$locationProvider.html5Mode({
enabled: true,
requireBase: false,
rewriteLinks: false
});
});
I also had to configure my server for html5Mode.