When I click on this : <a href="#/home">home</a>
the url is localhost/Sites/App/#!/#%2Fhome
When I click on this : <a href="#!/home">home</a>
the url is localhost/Sites/App/#!/home
But this only works on my computer, for my co-workers it's the opposite, the links don't works if there are !
in the url.
I understand the SEO best practices but we don't have a public website, we need to have a website working without exclamation mark in url.
I understand the /
in the url are encoded because angular think this is not a path separator but why in my only computer ? We have the same code.
We use IIS or IIS express, Chrome or IE, there are no differences. When it works for me, it does not work for all of the others.
In the browser networks calls we can see there are no server calls between the click on the link and the bad url generation.
This is the module configuration :
angular.module('paper.app', [ 'ngMaterial'
, 'ngMessages'
, 'ngRoute'
, ...])
.config(function ($routeProvider, $mdThemingProvider, $mdIconProvider, $locationProvider, $mdDateLocaleProvider, contentUrl, contentSvg) {
$routeProvider
.when("/", {
templateUrl: contentUrl + 'view-home/html/home.html',
controller: 'HomeController',
controllerAs: 'homeCtrl'
})
.otherwise({
redirectTo: '/'
});
$locationProvider.html5Mode(false);
...
});
This is the bower.json :
{
"name": "...",
"version": "1.0.0",
"authors": [
"..."
],
"ignore": [
"node_modules",
"bower_components"
],
"description": "",
"main": "",
"homepage": "",
"dependencies": {
"angular": "^1.5.7",
"angular-material": "^1.0.9",
"angular-route": "^1.5.7",
"angular-material-data-table": "^0.10.9",
"moment": "^2.14.1"
}
}
I solved it by adding this:
$locationProvider.hashPrefix('');
//Client side Configuration to pretty url //Remove # from url
$locationProvider.html5Mode(true);
and add this to your index.html
<base href="/"></base>
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With