skip to Main Content

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"
      }
}

2

Answers


  1. //Client side Configuration to pretty url
    //Remove # from url

    $locationProvider.html5Mode(true);
    

    and add this to your index.html
    <base href="/"></base>

    Login or Signup to reply.
  2. I solved it by adding this:

    $locationProvider.hashPrefix('');
    
    Login or Signup to reply.
Please signup or login to give your own answer.
Back To Top
Search